Style: Standardize icon use Part 1 (#5947)

## Summary

Remove the mix of class based and component style icons in favor of just
[classes](https://iconify.design/docs/usage/css/tailwind/tailwind4/#basic-usage).

## Changes

- **What**: Migrate existing lucide icons

## Review Focus

What differs between the icons before and now?

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5947-Style-Standardize-icon-use-Part-1-2846d73d365081bfa66ceb6bdaa9ff02)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
This commit is contained in:
Alexander Brown
2025-10-07 17:53:38 -07:00
committed by GitHub
parent 0616c049e4
commit 99b3a59679
60 changed files with 124 additions and 119 deletions

View File

@@ -19,7 +19,7 @@
v-if="videoError"
class="w-full h-[352px] flex flex-col items-center justify-center text-white text-center bg-gray-800/50"
>
<i-lucide:video-off class="w-12 h-12 mb-2 text-gray-400" />
<i class="icon-[lucide--video-off] w-12 h-12 mb-2 text-gray-400" />
<p class="text-sm text-gray-300">{{ $t('g.videoFailedToLoad') }}</p>
<p class="text-xs text-gray-400 mt-1">
{{ getVideoFilename(currentVideoUrl) }}
@@ -54,7 +54,7 @@
:aria-label="$t('g.downloadVideo')"
@click="handleDownload"
>
<i-lucide:download class="w-4 h-4" />
<i class="icon-[lucide--download] w-4 h-4" />
</button>
<!-- Close Button -->
@@ -64,7 +64,7 @@
:aria-label="$t('g.removeVideo')"
@click="handleRemove"
>
<i-lucide:x class="w-4 h-4" />
<i class="icon-[lucide--x] w-4 h-4" />
</button>
</div>