js/webawesome
1
0
Fork 0
mirror of https://github.com/shoelace-style/webawesome.git synced 2026-01-12 04:09:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

minor style touch up

Browse Source
This commit is contained in:
lindsaym-fa
2025-06-24 17:46:57 -04:00
parent 9bffa8f6e4
commit 622eb738e4
2 changed files with 32 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
packages/webawesome/docs/docs/themes.njk
View File

@@ -23,9 +23,11 @@ isPro: true
<div id="theme-preview">
<header>
<h2 data-theme-name="name">Theme</h2>
<wa-badge data-free-badge appearance="outlined" variant="neutral" hidden>FREE</wa-badge>
<wa-badge data-pro-badge appearance="accent" hidden>PRO</wa-badge>
<div class="wa-cluster">
<h2 data-theme-name="name">Theme</h2>
<wa-badge data-free-badge appearance="outlined" variant="neutral" hidden>FREE</wa-badge>
<wa-badge data-pro-badge appearance="accent" hidden>PRO</wa-badge>
</div>
<p data-theme-description>Description</p>
</header>
<wa-comparison position="80">
@@ -152,7 +154,7 @@ isPro: true
}
wa-zoomable-frame {
aspect-ratio: 8 / 4;
aspect-ratio: 5 / 3;
}
#theme-viewer {

52
packages/webawesome/docs/examples/themes/showcase.njk
View File

@@ -224,6 +224,32 @@ layout: false
</div>
</div>
</wa-card>
<wa-card>
<div class="wa-stack">
<h3 class="wa-heading-m">Chalmun's Spaceport Cantina</h3>
<div class="wa-cluster wa-gap-xs">
<wa-rating value="4.6" readonly tabindex="-1"></wa-rating>
<strong>4.6</strong>
<span>(419 reviews)</span>
</div>
<div class="wa-cluster wa-gap-xs">
<div class="wa-cluster wa-gap-3xs">
<wa-icon name="dollar" style="color: var(--wa-color-green-60)"></wa-icon>
<wa-icon name="dollar" style="color: var(--wa-color-green-60)"></wa-icon>
<wa-icon name="dollar" style="color: var(--wa-color-green-60)"></wa-icon>
</div>
<span class="wa-caption-m">&bull;</span>
<wa-tag size="small">Cocktail Bar</wa-tag>
<wa-tag size="small">Gastropub</wa-tag>
<wa-tag size="small">Local Fare</wa-tag>
<wa-tag size="small">Gluten Free</wa-tag>
</div>
<div class="wa-flank wa-gap-xs">
<wa-icon name="location-dot"></wa-icon>
<a href="#" class="wa-caption-m" tabindex="-1">Mos Eisley, Tatooine</a>
</div>
</div>
</wa-card>
<wa-callout variant="success">
<wa-icon slot="icon" name="user-bounty-hunter"></wa-icon>
<div class="wa-split">
@@ -251,32 +277,6 @@ layout: false
</wa-button>
</div>
</wa-callout>
<wa-card>
<div class="wa-stack">
<h3 class="wa-heading-m">Chalmun's Spaceport Cantina</h3>
<div class="wa-cluster wa-gap-xs">
<wa-rating value="4.6" readonly tabindex="-1"></wa-rating>
<strong>4.6</strong>
<span>(419 reviews)</span>
</div>
<div class="wa-cluster wa-gap-xs">
<div class="wa-cluster wa-gap-3xs">
<wa-icon name="dollar" style="color: var(--wa-color-green-60)"></wa-icon>
<wa-icon name="dollar" style="color: var(--wa-color-green-60)"></wa-icon>
<wa-icon name="dollar" style="color: var(--wa-color-green-60)"></wa-icon>
</div>
<span class="wa-caption-m">&bull;</span>
<wa-tag size="small">Cocktail Bar</wa-tag>
<wa-tag size="small">Gastropub</wa-tag>
<wa-tag size="small">Local Fare</wa-tag>
<wa-tag size="small">Gluten Free</wa-tag>
</div>
<div class="wa-flank wa-gap-xs">
<wa-icon name="location-dot"></wa-icon>
<a href="#" class="wa-caption-m" tabindex="-1">Mos Eisley, Tatooine</a>
</div>
</div>
</wa-card>
<wa-card>
<div class="wa-stack">
<div class="wa-flank:end">