mirror/api
1
0
Fork 0
mirror of https://github.com/unraid/api.git synced 2026-02-07 00:18:53 -06:00
Code Issues Packages Projects Releases Wiki Activity

refactor(notification): use "size" for square css widths and height

Browse Source
This commit is contained in:
Ajit Mehrotra
2025-12-15 16:08:37 -05:00
parent 7969e44211
commit e61657c05b
4 changed files with 9 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/components/Docker/DockerContainerManagement.vue
View File

@@ -535,7 +535,7 @@ const [transitionContainerRef] = useAutoAnimate({
</div>
<DockerOverview v-else :item="detailsItem" :details="details" />
<div v-if="isDetailsLoading" class="absolute inset-0 grid place-items-center">
<USkeleton class="h-6 w-6" />
<USkeleton class="size-6" />
</div>
</div>
</UCard>

8
web/src/components/Notifications/CriticalNotifications.standalone.vue
View File

@@ -194,7 +194,7 @@ onNotificationAdded(({ data }) => {
<section class="flex flex-col gap-4 rounded-lg border border-amber-200 bg-white p-4 shadow-sm">
<header class="flex items-center justify-between gap-3">
<div class="flex items-center gap-2">
<UIcon name="i-lucide-alert-triangle" class="h-5 w-5 text-amber-600" aria-hidden="true" />
<UIcon name="i-lucide-alert-triangle" class="size-5 text-amber-600" aria-hidden="true" />
<h2 class="text-base font-semibold text-gray-900">Warnings & Alerts</h2>
</div>
<span v-if="!loading" class="rounded-full bg-amber-100 px-2 py-0.5 text-xs font-medium text-amber-700">
@@ -207,7 +207,7 @@ onNotificationAdded(({ data }) => {
</div>
<div v-else-if="loading" class="flex items-center gap-2 text-sm text-gray-500">
<span class="h-2 w-2 animate-pulse rounded-full bg-amber-400" aria-hidden="true" />
<span class="size-2 animate-pulse rounded-full bg-amber-400" aria-hidden="true" />
Loading latest notifications…
</div>
@@ -215,7 +215,7 @@ onNotificationAdded(({ data }) => {
<li v-for="{ notification, displayTimestamp, meta } in enrichedNotifications" :key="notification.id"
class="grid gap-2 rounded-md border border-gray-200 p-3 transition hover:border-amber-300">
<div class="flex items-start gap-3">
<UIcon :name="meta.icon" class="mt-0.5 h-5 w-5 flex-none" :class="meta.accent" aria-hidden="true" />
<UIcon :name="meta.icon" class="mt-0.5 size-5 flex-none" :class="meta.accent" aria-hidden="true" />
<div class="flex flex-1 flex-col gap-1">
<div class="flex flex-wrap items-center gap-2">
<span class="rounded-full px-2 py-0.5 text-xs font-medium" :class="meta.badge">
@@ -253,7 +253,7 @@ onNotificationAdded(({ data }) => {
<div v-else class="flex flex-col items-start gap-2 rounded-md border border-gray-200 p-3">
<div class="flex items-center gap-2 text-sm font-medium text-gray-700">
<span class="h-2 w-2 rounded-full bg-emerald-400" aria-hidden="true" />
<span class="size-2 rounded-full bg-emerald-400" aria-hidden="true" />
All clear. No active warnings or alerts.
</div>
<p class="text-sm text-gray-500">

2
web/src/components/Notifications/Indicator.vue
View File

@@ -44,7 +44,7 @@ const icon = computed<{ name: string; color: string } | null>(() => {
<template>
<div class="relative flex items-center justify-center">
<UIcon name="i-heroicons-bell-20-solid" class="h-6 w-6" />
<UIcon name="i-heroicons-bell-20-solid" class="size-6" />
<div
v-if="!seen && indicatorLevel === 'UNREAD'"
class="border-muted bg-unraid-green absolute top-0 right-0 size-2.5 rounded-full border"

6
web/src/components/Notifications/List.vue
View File

@@ -300,7 +300,7 @@ const displayErrorMessage = computed(() => {
<div v-if="loading" class="space-y-4 py-3">
<div v-for="n in 3" :key="n" class="py-3">
<div class="flex items-center gap-2">
<USkeleton class="h-5 w-5 rounded-full" />
<USkeleton class="size-5 rounded-full" />
<USkeleton class="h-4 w-40" />
<div class="ml-auto">
<USkeleton class="h-3 w-24" />
@@ -322,7 +322,7 @@ const displayErrorMessage = computed(() => {
<div v-if="loading" class="w-full max-w-md space-y-4">
<div v-for="n in 3" :key="n" class="py-1.5">
<div class="flex items-center gap-2">
<USkeleton class="h-5 w-5 rounded-full" />
<USkeleton class="size-5 rounded-full" />
<USkeleton class="h-4 w-40" />
</div>
<div class="mt-2">
@@ -346,7 +346,7 @@ const displayErrorMessage = computed(() => {
<!-- Default (empty state) -->
<div v-else class="contents">
<UIcon name="i-heroicons-check-20-solid" class="text-unraid-green h-10 w-10 translate-y-3" />
<UIcon name="i-heroicons-check-20-solid" class="text-unraid-green size-10 translate-y-3" />
{{ noNotificationsMessage }}
</div>
</div>