ccims documentation
  1. Components
  2. IssueCategoryComponent

File

src/app/components/issue-category/issue-category.component.ts

Metadata

selector app-issue-category
styleUrls ./issue-category.component.scss
templateUrl ./issue-category.component.html

Index

Inputs

Inputs

category
Type : IssueCategory
Defined in src/app/components/issue-category/issue-category.component.ts:10
 
import {Component, Input} from '@angular/core';
import {IssueCategory} from '../../../generated/graphql-dgql';

@Component({
  selector: 'app-issue-category',
  templateUrl: './issue-category.component.html',
  styleUrls: ['./issue-category.component.scss']
})
export class IssueCategoryComponent {
  @Input() category: IssueCategory;
}

<ng-container [ngSwitch]="category">
  <span *ngSwitchCase="'UNCLASSIFIED'" class="category-box">
    <mat-icon [svgIcon]="'issue-uncategorized'" class="category-icon"></mat-icon>
    Uncategorized
  </span>

  <span *ngSwitchCase="'BUG'" class="category-box">
    <mat-icon [svgIcon]="'issue-bug'" class="category-icon"></mat-icon>
    Bug
  </span>

  <span *ngSwitchCase="'FEATURE_REQUEST'" class="category-box">
    <mat-icon [svgIcon]="'issue-feature'" class="category-icon"></mat-icon>
    Feature Request
  </span>
</ng-container>

./issue-category.component.scss 

.category-icon {
  vertical-align: middle;
  margin-bottom: 3px;
}

.category-box {
  background: rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  align-items: center;
  padding: 5px;
}
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""