chore: use new syntax for css variables (#3258)

Co-authored-by: Benjamin Canac <canacb1@gmail.com>
This commit is contained in:
Sandro Circi
2025-02-07 11:24:14 +01:00
committed by GitHub
parent 8e7c52e1fb
commit 104852a55c
230 changed files with 12934 additions and 12958 deletions

View File

@@ -15,7 +15,7 @@ const domain = ref(domains[0])
}"
>
<template #leading>
<p class="text-sm text-[var(--ui-text-muted)]">
<p class="text-sm text-(--ui-text-muted)">
https://
</p>
</template>

View File

@@ -13,7 +13,7 @@ const maxLength = 15
<template #trailing>
<div
id="character-count"
class="text-xs text-[var(--ui-text-muted)] tabular-nums"
class="text-xs text-(--ui-text-muted) tabular-nums"
aria-live="polite"
role="status"
>

View File

@@ -4,8 +4,8 @@ const value = ref('')
<template>
<UInput v-model="value" placeholder="" :ui="{ base: 'peer' }">
<label class="pointer-events-none absolute left-0 -top-2.5 text-[var(--ui-text-highlighted)] text-xs font-medium px-1.5 transition-all peer-focus:-top-2.5 peer-focus:text-[var(--ui-text-highlighted)] peer-focus:text-xs peer-focus:font-medium peer-placeholder-shown:text-sm peer-placeholder-shown:text-[var(--ui-text-dimmed)] peer-placeholder-shown:top-1.5 peer-placeholder-shown:font-normal">
<span class="inline-flex bg-[var(--ui-bg)] px-1">Email address</span>
<label class="pointer-events-none absolute left-0 -top-2.5 text-(--ui-text-highlighted) text-xs font-medium px-1.5 transition-all peer-focus:-top-2.5 peer-focus:text-(--ui-text-highlighted) peer-focus:text-xs peer-focus:font-medium peer-placeholder-shown:text-sm peer-placeholder-shown:text-(--ui-text-dimmed) peer-placeholder-shown:top-1.5 peer-placeholder-shown:font-normal">
<span class="inline-flex bg-(--ui-bg) px-1">Email address</span>
</label>
</UInput>
</template>

View File

@@ -77,7 +77,7 @@ const text = computed(() => {
v-for="(req, index) in strength"
:key="index"
class="flex items-center gap-0.5"
:class="req.met ? 'text-[var(--ui-success)]' : 'text-[var(--ui-text-muted)]'"
:class="req.met ? 'text-(--ui-success)' : 'text-(--ui-text-muted)'"
>
<UIcon :name="req.met ? 'i-lucide-circle-check' : 'i-lucide-circle-x'" class="size-4 shrink-0" />