update showcase, effect

This commit is contained in:
letieu
2025-12-09 01:22:07 +07:00
parent 49d4ffc1ba
commit ca6a6d6621
3 changed files with 84 additions and 45 deletions

View File

@@ -74,8 +74,8 @@
<button class="button is-danger">Danger</button>
<button class="button is-success">Success</button>
<button class="button is-warning">Warning</button>
<button class="button is-outlined">Outlined</button>
<button class="button is-ghost">Ghost</button>
<button class="button is-info">Info</button>
<button class="button is-info is-loading">Loading</button>
</div>
</div>
@@ -85,9 +85,11 @@
<div class="flex flex-wrap gap-2">
<span class="tag is-primary">v0.0.1</span>
<span class="tag is-success">Active</span>
<span class="tag is-danger is-active">Error</span>
<span class="tag is-warning is-active">Beta</span>
<span class="tag is-info">New</span>
<span class="tag is-danger">Error</span>
<span class="tag is-warning">Beta</span>
<span class="tag is-info">New</span>
</div>
</div>
@@ -132,15 +134,19 @@
<div class="showcase-section">
<h3 class="title is-5 mb-4 has-text-primary">Progress</h3>
<div class="space-y-3">
<progress class="progress is-primary" value="75" max="100">
75%
</progress>
<div class="flex justify-between mb-2">
<span class="has-text-muted text-sm">Disk Usage</span>
<span class="has-text-danger text-sm font-bold">30%</span>
</div>
<progress class="progress is-success" value="100" max="100">
100%
</progress>
<progress class="progress is-danger" value="30" max="100">
30%
</progress>
<progress class="progress is-primary" value="75" max="100">
75%
</progress>
</div>
</div>