PixelHeadsLtd

<fieldset>
    <legend>Radio button</legend>
    <div class="field multi">
        <label [ngClass]="{selected: myRadios==='yes'}">
            <input type="radio" value="yes" name="radiosmulti" [(ngModel)]="myRadios">
            <span>Yes</span>
        </label>
    </div>

    <div class="field multi">

PixelHeadsLtd

<fieldset>
    <legend>Radio button</legend>
    <div class="field multi">
        <label [ngClass]="{selected: myRadios==='yes'}">
            <input type="radio" value="yes" name="radiosmulti" [(ngModel)]="myRadios">
            <span>Yes</span>
        </label>
    </div>

    <div class="field multi">

PixelHeadsLtd

<aa-tab-navigation>
  <aa-tab-navigation-item [tabName]="'Primary tab 1'"></aa-tab-navigation-item>
</aa-tab-navigation>
<router-outlet>
  Page content here...
</router-outlet>

PixelHeadsLtd

<-- Template -->
<div 
    (click)="onClick($event)" 
    class="avatar-wrapper flex-group flex-align-center flex-start bg-transparent"
>
    <div class="avatar cursor-pointer width-1-75 height-1-75">
        <div>
            <img onerror="this.style.display='none'" src="./assets/images/samples/obi-wan.png" />
        </div>
    </div>

PixelHeadsLtd

<ph-info-panel 
    panelWidth="30rem" 
    panelHeight="20rem"
    panelStatus="info"
    [roundedCorners]="false"
    [removeHeaderBorder]="false"
    [hideFooter]="false"
>
    <ng-container custom-header>
      <section class="flex-group space-between">

PixelHeadsLtd

<ph-tab-navigation [tabInfoRouterOutlet]="true">
    <li tabs *ngFor="let item of tabDataItems; let i">
      <a routerLinkActive="active" 
      [routerLink]="your.route" 
      class="cursor-none {{item.tabColor}}"
      >
        <ph-progress-circle 
          [panelView]="true" 
          [name]="item.tabName" 
          [percent]="item.percentage"

PixelHeadsLtd

import { CustomCardComponent } from './custom-card.component';
import { AvatarComponent } from "./avatar.component";

private columnDefs = [
  {
    headerName: 'Hover for card tooltip',
    field: "athlete",
    width: 180,
    suppressSizeToFit: false,
    headerCheckboxSelection: true,

PixelHeadsLtd

<div class="flex-group flex-start">
  <div class="field">
      <label>Place</label>
      <input type="text" />
  </div>
  <div class="field">
      <label>Time</label>
      <ngb-timepicker [(ngModel)]="time" [seconds]="seconds" />
  </div>
</div>

PixelHeadsLtd

<nav class="margin-top-1 margin-bottom-1">
  <ph-tab-navigation 
    class="secondary-tabs" // ADD THIS CLASS TO DISPLAY SECONDARY TABS
    [routerOutlet]="true"
  >
    <ng-container list-items>
        <li 
          *ngFor="let tab of tabsSecondaryRouterOutlet" 
          [ngClass]="{'tab-disabled' : tab.tabDisabled}"
        >

PixelHeadsLtd

<ph-blade 
  [toggleBlade]="toggleBlade"
  (bladeOpen)="bladeIsOpen($event)"
  topPosition="3.5rem"
  zIndex="30"
  bladeSize="{{theBladeSize}}"
  bladeHeading="{{bladeHeading}}"
  [enableIcon]="showIcon"
  iconName="{{bladeIcon}}"
>