chore(VerticalNavigation): add icon spacing class in preset

This commit is contained in:
Benjamin Canac
2022-01-28 11:37:15 +01:00
parent 79d8e086f0
commit 9292a63844
2 changed files with 7 additions and 2 deletions

View File

@@ -15,7 +15,7 @@
<Icon <Icon
v-if="link.icon" v-if="link.icon"
:name="link.icon" :name="link.icon"
:class="[iconBaseClass, isActive ? iconActiveClass : iconInactiveClass]" :class="[iconBaseClass, link.label && iconSpacingClass, isActive ? iconActiveClass : iconInactiveClass]"
/> />
</slot> </slot>
<slot :link="link"> <slot :link="link">
@@ -61,6 +61,10 @@ export default {
type: String, type: String,
default: () => $ui.verticalNavigation.icon.base default: () => $ui.verticalNavigation.icon.base
}, },
iconSpacingClass: {
type: String,
default: () => $ui.verticalNavigation.icon.spacing
},
iconActiveClass: { iconActiveClass: {
type: String, type: String,
default: () => $ui.verticalNavigation.icon.active default: () => $ui.verticalNavigation.icon.active

View File

@@ -255,7 +255,8 @@ const verticalNavigation = {
active: 'u-text-gray-900 u-bg-gray-100', active: 'u-text-gray-900 u-bg-gray-100',
inactive: 'u-text-gray-600 hover:u-text-gray-900 hover:u-bg-gray-50 focus:u-bg-gray-50', inactive: 'u-text-gray-600 hover:u-text-gray-900 hover:u-bg-gray-50 focus:u-bg-gray-50',
icon: { icon: {
base: 'flex-shrink-0 -ml-1 mr-3 h-6 w-6', base: 'flex-shrink-0 h-6 w-6',
spacing: '-ml-1 mr-3',
active: 'u-text-gray-500', active: 'u-text-gray-500',
inactive: 'u-text-gray-400 group-hover:u-text-gray-500' inactive: 'u-text-gray-400 group-hover:u-text-gray-500'
}, },