Angular Logo

angular-logo.component.ts

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-angular-logo',
  template: `
    <div class="logo">
      <a href="http://angular.io" target="_blank" alt="Angular">
        <svg>
          <style type="text/css">.st0 { fill: #DD0031; } .st1 { fill: #C3002F; } .st2 { fill: #FFFFFF; }</style>
          <g>
            <polygon class="st0" points="125,30 125,30 125,30 31.9,63.2 46.1,186.3 125,230 125,230 125,230 203.9,186.3 218.1,63.2  "
            />
          </g>
        </svg>
      </a>
     </div>  
  `,
  style: [`
    .logo {
      top: 7%;
      left: 2%;
      width: 20%;
      position: absolute;
    }

    @media (max-width: 780px) { 
      .logo {
        right: 10%;
        width: 20%;
      }
    }
  `]
})
export class AngularLogoComponent { }