Skip to content

Files

This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.

Latest commit

6fd63a9 · Dec 27, 2024

History

History
41 lines (40 loc) · 1.05 KB
·

example_component_html.md

File metadata and controls

41 lines (40 loc) · 1.05 KB
·
@if (loaded) {
<ion-list>
  <ion-list-header>Albums</ion-list-header>
  <ion-item>
    <ion-thumbnail slot="start">
      <ion-icon style="width: 100%; height: 100%" name="musical-notes"></ion-icon>
    </ion-thumbnail>
    <ion-label>
      <h3>Abbey Road</h3>
      <p>The Beatles</p>
      <p>1969</p>
    </ion-label>
  </ion-item>
</ion-list>
} @else {
<ion-list>
  <ion-list-header>
    <ion-skeleton-text [animated]="true" style="width: 80px"></ion-skeleton-text>
  </ion-list-header>
  <ion-item>
    <ion-thumbnail slot="start">
      <ion-skeleton-text [animated]="true"></ion-skeleton-text>
    </ion-thumbnail>
    <ion-label>
      <h3>
        <ion-skeleton-text [animated]="true" style="width: 80%;"></ion-skeleton-text>
      </h3>
      <p>
        <ion-skeleton-text [animated]="true" style="width: 60%;"></ion-skeleton-text>
      </p>
      <p>
        <ion-skeleton-text [animated]="true" style="width: 30%;"></ion-skeleton-text>
      </p>
    </ion-label>
  </ion-item>
</ion-list>
}

<ion-button (click)="loaded = !loaded">Toggle</ion-button>