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

feat(module): dynamic rounded-* utilities (#3906)

Browse Source
This commit is contained in:
Benjamin Canac
2025-04-16 15:57:32 +02:00
committed by GitHub
parent 4e39cc59f8
commit f9737c8f40
109 changed files with 6247 additions and 6245 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/theme/navigation-menu.ts
View File

@@ -6,7 +6,7 @@ export default (options: Required<ModuleOptions>) => ({
list: 'isolate min-w-0',
label: 'w-full flex items-center gap-1.5 font-semibold text-xs/5 text-(--ui-text-highlighted) px-2.5 py-1.5',
item: 'min-w-0',
link: 'group relative w-full flex items-center gap-1.5 font-medium text-sm before:absolute before:z-[-1] before:rounded-[calc(var(--ui-radius)*1.5)] focus:outline-none focus-visible:outline-none dark:focus-visible:outline-none focus-visible:before:ring-inset focus-visible:before:ring-2',
link: 'group relative w-full flex items-center gap-1.5 font-medium text-sm before:absolute before:z-[-1] before:rounded-md focus:outline-none focus-visible:outline-none dark:focus-visible:outline-none focus-visible:before:ring-inset focus-visible:before:ring-2',
linkLeadingIcon: 'shrink-0 size-5',
linkLeadingAvatar: 'shrink-0',
linkLeadingAvatarSize: '2xs',
@@ -18,7 +18,7 @@ export default (options: Required<ModuleOptions>) => ({
linkLabelExternalIcon: 'inline-block size-3 align-top text-(--ui-text-dimmed)',
childList: '',
childItem: '',
childLink: 'group size-full px-3 py-2 rounded-[calc(var(--ui-radius)*1.5)] flex items-start gap-2 text-start',
childLink: 'group size-full px-3 py-2 rounded-md flex items-start gap-2 text-start',
childLinkWrapper: 'flex flex-col items-start',
childLinkIcon: 'size-5 shrink-0',
childLinkLabel: 'font-semibold text-sm relative inline-flex',
@@ -26,10 +26,10 @@ export default (options: Required<ModuleOptions>) => ({
childLinkDescription: 'text-sm text-(--ui-text-muted)',
separator: 'px-2 h-px bg-(--ui-border)',
viewportWrapper: 'absolute top-full left-0 flex w-full',
viewport: 'relative overflow-hidden bg-(--ui-bg) shadow-lg rounded-[calc(var(--ui-radius)*1.5)] ring ring-(--ui-border) h-(--reka-navigation-menu-viewport-height) w-full transition-[width,height,left] duration-200 origin-[top_center] data-[state=open]:animate-[scale-in_100ms_ease-out] data-[state=closed]:animate-[scale-out_100ms_ease-in] z-[1]',
viewport: 'relative overflow-hidden bg-(--ui-bg) shadow-lg rounded-md ring ring-(--ui-border) h-(--reka-navigation-menu-viewport-height) w-full transition-[width,height,left] duration-200 origin-[top_center] data-[state=open]:animate-[scale-in_100ms_ease-out] data-[state=closed]:animate-[scale-out_100ms_ease-in] z-[1]',
content: 'absolute top-0 left-0 w-full sm:w-auto',
indicator: 'absolute data-[state=visible]:animate-[fade-in_100ms_ease-out] data-[state=hidden]:animate-[fade-out_100ms_ease-in] data-[state=hidden]:opacity-0 bottom-0 z-[2] w-(--reka-navigation-menu-indicator-size) translate-x-(--reka-navigation-menu-indicator-position) flex h-2.5 items-end justify-center overflow-hidden transition-[translate,width] duration-200',
arrow: 'relative top-[50%] size-2.5 rotate-45 border border-(--ui-border) bg-(--ui-bg) z-[1] rounded-[calc(var(--ui-radius)/2)]'
arrow: 'relative top-[50%] size-2.5 rotate-45 border border-(--ui-border) bg-(--ui-bg) z-[1] rounded-xs'
},
variants: {
color: {