arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-24 17:00:36 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix(module): stop using tailwind's shorthand arbitrary variable syntax (#2366)

Browse Source 
Co-authored-by: Benjamin Canac <canacb1@gmail.com>
This commit is contained in:
Sandro Circi
2024-10-14 10:42:26 +02:00
committed by GitHub
parent ea07dffdd5
commit dcce571cda
131 changed files with 3724 additions and 3724 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
playground/app/app.vue
View File

@@ -66,8 +66,8 @@ defineShortcuts({
<template>
<UApp :toaster="appConfig.toaster">
<div class="h-screen w-screen overflow-hidden flex min-h-0 bg-[--ui-bg]" vaul-drawer-wrapper>
<UNavigationMenu :items="items" orientation="vertical" class="border-r border-[--ui-border] overflow-y-auto w-48 p-4" />
<div class="h-screen w-screen overflow-hidden flex min-h-0 bg-[var(--ui-bg)]" vaul-drawer-wrapper>
<UNavigationMenu :items="items" orientation="vertical" class="border-r border-[var(--ui-border)] overflow-y-auto w-48 p-4" />
<div class="flex-1 flex flex-col items-center justify-around overflow-y-auto w-full py-12 px-4">
<NuxtPage />

4
playground/app/components/Placeholder.vue
View File

@@ -1,6 +1,6 @@
<template>
<div class="relative overflow-hidden rounded-[--ui-radius] border border-dashed border-[--ui-border-accented] opacity-75 px-4 flex items-center justify-center">
<svg class="absolute inset-0 h-full w-full stroke-[--ui-border-inverted]/10" fill="none">
<div class="relative overflow-hidden rounded-[var(--ui-radius)] border border-dashed border-[var(--ui-border-accented)] opacity-75 px-4 flex items-center justify-center">
<svg class="absolute inset-0 h-full w-full stroke-[var(--ui-border-inverted)]/10" fill="none">
<defs>
<pattern
id="pattern-5c1e4f0e-62d5-498b-8ff0-cf77bb448c8e"

4
playground/app/pages/components/accordion.vue
View File

@@ -32,13 +32,13 @@ const items = [{
<UCard :ui="{ body: 'p-0 sm:p-0' }">
<UAccordion :items="items" class="w-96" :ui="{ trigger: 'px-3.5', body: 'px-3.5' }">
<template #body="{ item }">
<p class="text-[--ui-text-muted]">
<p class="text-[var(--ui-text-muted)]">
{{ item.content }}
</p>
</template>
<template #custom-body="{ item }">
<p class="text-[--ui-text-muted]">
<p class="text-[var(--ui-text-muted)]">
Custom: {{ item.content }}
</p>
</template>

2
playground/app/pages/components/command-palette.vue
View File

@@ -125,7 +125,7 @@ defineShortcuts({
<UButton label="Open drawer" color="neutral" variant="outline" />
<template #content>
<ReuseTemplate class="border-t border-[--ui-border]" />
<ReuseTemplate class="border-t border-[var(--ui-border)]" />
</template>
</UDrawer>

2
playground/app/pages/components/context-menu.vue
View File

@@ -88,7 +88,7 @@ defineShortcuts(extractShortcuts(items))
</div>
<UContextMenu :items="items" class="min-w-48" :size="size">
<div class="flex items-center justify-center rounded-md border border-dashed border-[--ui-border-accented] text-sm aspect-video w-72">
<div class="flex items-center justify-center rounded-md border border-dashed border-[var(--ui-border-accented)] text-sm aspect-video w-72">
Right click here
</div>
</UContextMenu>

2
playground/app/pages/components/dropdown-menu.vue
View File

@@ -130,7 +130,7 @@ defineShortcuts(extractShortcuts(items))
<UButton label="Open" color="neutral" variant="outline" icon="i-heroicons-bars-3" />
<template #custom-trailing>
<UIcon name="i-heroicons-check-badge" class="shrink-0 size-5 text-[--ui-primary]" />
<UIcon name="i-heroicons-check-badge" class="shrink-0 size-5 text-[var(--ui-primary)]" />
</template>
</UDropdownMenu>
</div>

8
playground/app/pages/components/link.vue
View File

@@ -8,7 +8,7 @@
<ULink active>
Button active
</ULink>
<ULink active class="font-medium" active-class="text-[--ui-text-highlighted]">
<ULink active class="font-medium" active-class="text-[var(--ui-text-highlighted)]">
Button active with class
</ULink>
<ULink active disabled>
@@ -18,7 +18,7 @@
<ULink>
Button inactive
</ULink>
<ULink class="font-medium" inactive-class="hover:text-[--ui-primary]">
<ULink class="font-medium" inactive-class="hover:text-[var(--ui-primary)]">
Button inactive with class
</ULink>
<ULink disabled>
@@ -34,7 +34,7 @@
<ULink to="/components/link">
Link active
</ULink>
<ULink to="/components/link" class="font-medium" active-class="text-[--ui-text-highlighted]">
<ULink to="/components/link" class="font-medium" active-class="text-[var(--ui-text-highlighted)]">
Link active with class
</ULink>
<ULink to="/components/link" disabled>
@@ -44,7 +44,7 @@
<ULink to="/components/button">
Link inactive
</ULink>
<ULink to="/components/button" class="font-medium" inactive-class="hover:text-[--ui-primary]">
<ULink to="/components/button" class="font-medium" inactive-class="hover:text-[var(--ui-primary)]">
Link inactive with class
</ULink>
<ULink to="/components/button" disabled>

2
playground/app/pages/components/navigation-menu.vue
View File

@@ -99,7 +99,7 @@ const items = [
:orientation="orientation"
:highlight="highlight"
:highlight-color="highlightColor"
:class="highlight && 'data-[orientation=horizontal]:border-b data-[orientation=vertical]:border-l border-[--ui-border]'"
:class="highlight && 'data-[orientation=horizontal]:border-b data-[orientation=vertical]:border-l border-[var(--ui-border)]'"
/>
</div>
</template>

2
playground/app/pages/components/separator.vue
View File

@@ -1,7 +1,7 @@
<template>
<div class="flex flex-col gap-4">
<div>
<p class="font-semibold text-[--ui-text-highlighted]">
<p class="font-semibold text-[var(--ui-text-highlighted)]">
Nuxt UI
</p>
<p>An open-source UI component library.</p>

2
playground/app/pages/components/tabs.vue
View File

@@ -57,7 +57,7 @@ const items = [{
class="w-96"
>
<template #custom="{ item }">
<span class="text-[--ui-text-muted]">Custom: {{ item.content }}</span>
<span class="text-[var(--ui-text-muted)]">Custom: {{ item.content }}</span>
</template>
</UTabs>
</div>