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

chore(VerticalNavigation)!: split preset

Browse Source
This commit is contained in:
Benjamin Canac
2023-05-23 15:26:47 +02:00
parent 1210e99ec1
commit 19923cbf1e
3 changed files with 11 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
docs/components/docs/DocsAsideLinks.vue
View File

@@ -10,8 +10,11 @@
class="mt-1" class="mt-1"
:ui="{ :ui="{
wrapper: 'border-l border-gray-200 dark:border-gray-800 space-y-2', wrapper: 'border-l border-gray-200 dark:border-gray-800 space-y-2',
base: 'group block border-l -ml-px lg:leading-6',
padding: 'pl-4', padding: 'pl-4',
base: 'group text-sm block border-l -ml-px lg:leading-6', rounded: '',
font: '',
ring: '',
active: 'text-primary-500 dark:text-primary-400 border-current font-semibold', active: 'text-primary-500 dark:text-primary-400 border-current font-semibold',
inactive: 'border-transparent hover:border-gray-400 dark:hover:border-gray-500 text-gray-700 hover:text-gray-900 dark:text-gray-400 dark:hover:text-gray-300' inactive: 'border-transparent hover:border-gray-400 dark:hover:border-gray-500 text-gray-700 hover:text-gray-900 dark:text-gray-400 dark:hover:text-gray-300'
}" }"

7
src/runtime/app.config.ts
View File

@@ -468,8 +468,13 @@ const skeleton = {
const verticalNavigation = { const verticalNavigation = {
wrapper: 'relative', wrapper: 'relative',
base: 'group flex items-center gap-2 text-sm font-medium rounded-md w-full relative focus:outline-none focus-visible:outline-none dark:focus-visible:outline-none focus-visible:ring-inset focus-visible:ring-2 focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400 focus-visible:before:ring-inset focus-visible:before:ring-1 focus-visible:before:ring-primary-500 dark:focus-visible:before:ring-primary-400 before:absolute before:inset-px before:rounded-md disabled:cursor-not-allowed disabled:opacity-75', base: 'group relative flex items-center gap-2 focus:outline-none focus-visible:outline-none dark:focus-visible:outline-none focus-visible:before:ring-inset focus-visible:before:ring-1 focus-visible:before:ring-primary-500 dark:focus-visible:before:ring-primary-400 before:absolute before:inset-px before:rounded-md disabled:cursor-not-allowed disabled:opacity-75',
ring: 'focus-visible:ring-inset focus-visible:ring-2 focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400',
padding: 'px-3 py-1.5', padding: 'px-3 py-1.5',
width: 'w-full',
rounded: 'rounded-md',
font: 'font-medium',
size: 'text-sm',
active: 'text-gray-900 dark:text-white before:bg-gray-100 dark:before:bg-gray-800', active: 'text-gray-900 dark:text-white before:bg-gray-100 dark:before:bg-gray-800',
inactive: 'text-gray-500 dark:text-gray-400 hover:text-gray-900 dark:hover:text-white hover:before:bg-gray-50 dark:hover:before:bg-gray-800/50', inactive: 'text-gray-500 dark:text-gray-400 hover:text-gray-900 dark:hover:text-white hover:before:bg-gray-50 dark:hover:before:bg-gray-800/50',
label: 'truncate relative', label: 'truncate relative',

2
src/runtime/components/navigation/VerticalNavigation.vue
View File

@@ -5,7 +5,7 @@
v-slot="{ isActive }" v-slot="{ isActive }"
:key="index" :key="index"
v-bind="omit(link, ['label', 'icon', 'iconClass', 'avatar', 'badge', 'click'])" v-bind="omit(link, ['label', 'icon', 'iconClass', 'avatar', 'badge', 'click'])"
:class="[ui.base, ui.padding]" :class="[ui.base, ui.padding, ui.width, ui.ring, ui.rounded, ui.font, ui.size]"
:active-class="ui.active" :active-class="ui.active"
:inactive-class="ui.inactive" :inactive-class="ui.inactive"
@click="link.click" @click="link.click"