mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-01-20 17:22:51 -05:00
48 lines
2.5 KiB
HTML
48 lines
2.5 KiB
HTML
<div role="radiogroup" *ngIf="cards" [ngStyle]="CSSStyles" [class]="orientation + ' card-group'" class="card-group" [attr.aria-label]="ariaLabel" (keydown)="onKeyDown($event)">
|
|
<div #cardDiv role="radio" *ngFor="let card of cards" class="model-card" (click)="selectCard(card.id)"
|
|
[attr.aria-checked]="isCardSelected(card.id)" [tabIndex]="getTabIndex(card.id)" [style.width]="cardWidth"
|
|
[style.height]="cardHeight" (focus)="onCardFocus(card.id)" (blur)="onCardBlur(card.id)" style="flex:0 0 auto;">
|
|
|
|
<ng-container *ngIf="isIconPositionTop()">
|
|
<div class="selection-indicator-container">
|
|
<div *ngIf="isCardSelected(card.id)" class="selection-indicator"></div>
|
|
</div>
|
|
<div *ngIf="card.icon" class="icon-container">
|
|
<div [class]="getIconClass(card.id)" [style.width]="iconWidth" [style.height]="iconHeight"> </div>
|
|
</div>
|
|
<div class="text-container" [style.height]="textHeight">
|
|
<div *ngFor="let description of card.descriptions" class="inner-text-content">
|
|
<span class="text-value" [ngStyle]="description.textStyles">{{description.textValue}}</span>
|
|
<a *ngIf="description.linkDisplayValue" class="link-value" href="#"
|
|
(click)="onLinkClick($event, card.id, description)" [ngStyle]="description.linkStyles">
|
|
{{description.linkDisplayValue}}
|
|
<span *ngIf="description.displayLinkCodicon && description.linkDisplayValue"
|
|
class="codicon codicon-link-external" [ngStyle]="description.linkCodiconStyles"></span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</ng-container>
|
|
|
|
<div *ngIf="isIconPositionLeft()" class="model-left-icon-card">
|
|
<span class="selection-indicator-container">
|
|
<div *ngIf="isCardSelected(card.id)" class="selection-indicator"></div>
|
|
</span>
|
|
<div *ngIf="card.icon" class="left-icon-container">
|
|
<div [class]="getIconClass(card.id)" [style.width]="iconWidth" [style.height]="iconHeight"></div>
|
|
</div>
|
|
<div class="detail-container">
|
|
<div *ngFor="let description of card.descriptions" style="margin-bottom:14px;">
|
|
<span class="text-value" [ngStyle]="description.textStyles">{{description.textValue}}</span>
|
|
<a *ngIf="description.linkDisplayValue" class="link-value" href="#"
|
|
(click)="onLinkClick($event, card.id, description)" [ngStyle]="description.linkStyles">
|
|
{{description.linkDisplayValue}}
|
|
<span *ngIf="description.displayLinkCodicon && description.linkDisplayValue"
|
|
class="codicon codicon-link-external" [ngStyle]="description.linkCodiconStyles"></span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|