chore(docs): more style and readability update

This commit is contained in:
Neko Ayaka
2026-05-02 21:17:03 +08:00
parent 3d848c9914
commit b4a35e4ac0
5 changed files with 34 additions and 21 deletions
+4 -4
View File
@@ -86,10 +86,10 @@ const showFooter = computed(
:class="[
'shadow-md shadow-transparent dark:shadow-none hover:shadow-black/5',
'border-2 border-solid border-neutral-100 hover:border-primary/10 dark:border-neutral-800/40',
'bg-white/30 dark:bg-neutral-800/30 hover:bg-primary/10 dark:hover:bg-neutral-800/50',
'bg-white/30 dark:bg-neutral-800/30 hover:bg-primary/10 dark:hover:bg-primary/10',
'active:scale-98',
'transition-all duration-200 ease-in-out',
'[&_span,_&_p]:transition-all [&_span,_&_p]:duration-200 [&_span,_&_p]:ease-in-out [&_span,_&_p]:hover:text-primary',
'[&_span,_&_p]:transition-all [&_span,_&_p]:duration-200 [&_span,_&_p]:ease-in-out [&_span,_&_p]:hover:text-primary-600 dark:[&_span,_&_p]:hover:text-primary-400',
]"
:href="control.prev.link"
>
@@ -113,10 +113,10 @@ const showFooter = computed(
:class="[
'shadow-md shadow-transparent dark:shadow-none hover:shadow-black/5',
'border-2 border-solid border-neutral-100 hover:border-primary/10 dark:border-neutral-800/40',
'bg-white/30 dark:bg-neutral-800/30 hover:bg-primary/10 dark:hover:bg-neutral-800/50',
'bg-white/30 dark:bg-neutral-800/30 hover:bg-primary/10 dark:hover:bg-primary/10',
'active:scale-98',
'transition-all duration-200 ease-in-out',
'[&_span,_&_p]:transition-all [&_span,_&_p]:duration-200 [&_span,_&_p]:ease-in-out [&_span,_&_p]:hover:text-primary',
'[&_span,_&_p]:transition-all [&_span,_&_p]:duration-200 [&_span,_&_p]:ease-in-out [&_span,_&_p]:hover:text-primary-600 dark:[&_span,_&_p]:hover:text-primary-400',
]"
:href="control.next.link"
>
@@ -45,7 +45,7 @@ watch(isActiveLink, () => {
>
<CollapsibleTrigger
:class="[
'group w-full inline-flex items-center justify-between rounded-lg py-1 pr-3 text-sm transition-colors duration-150 ease-in-out mb-0.5',
'group w-full inline-flex items-center justify-between rounded-lg py-1 pr-3 text-sm transition-colors duration-100 ease-out mb-0.5',
hasActiveLink ? 'text-foreground' : 'text-muted-foreground',
'hover:bg-primary/10 hover:text-primary',
]"
@@ -78,7 +78,7 @@ watch(isActiveLink, () => {
<div
v-else
:class="[
'flex w-full items-center rounded-lg text-sm transition-colors duration-150 ease-in-out hover:bg-card',
'flex w-full items-center rounded-lg text-sm transition-colors duration-100 ease-out hover:bg-card',
isActiveLink ? 'is-active !bg-primary/10 !text-primary font-semibold' : '',
'hover:bg-primary/10 hover:text-primary',
]"
+2 -2
View File
@@ -4,8 +4,8 @@
.prose kbd,
.custom-block kbd {
color: inherit;
padding: 4px 8px;
font-size: 0.8rem;
padding: 3px 6px;
font-size: 0.75rem;
cursor: pointer;
user-select: none;
position: relative;
+25 -12
View File
@@ -88,46 +88,54 @@
}
.custom-block.info {
@apply bg-slate-200/20 dark:bg-slate-900/80 border-none;
@apply bg-slate-200/20 dark:bg-slate-900/80 border-none text-sm;
&::before {
@apply bg-slate-500/20 dark:bg-slate-400/20;
}
& .custom-block-title {
@apply text-slate-800 dark:text-slate-300 font-semibold;
@apply text-slate-800 dark:text-slate-300 font-semibold text-base;
}
& ul ::marker {
@apply text-slate-700;
}
&> :not(p:nth-child(1)) {
@apply dark:text-slate-50;
@apply text-slate-950 dark:text-slate-50 leading-snug;
}
}
.custom-block.tip {
@apply bg-violet-50 dark:bg-violet-900/20 border-none;
@apply bg-violet-50 dark:bg-violet-900/20 border-none text-sm;
&::before {
@apply bg-violet-500/20 dark:bg-violet-400/20;
}
& .custom-block-title {
@apply text-violet-800 dark:text-violet-300 font-semibold;
@apply text-violet-800 dark:text-violet-300 font-semibold text-base;
}
& ul ::marker {
@apply text-violet-700;
}
&> :not(p:nth-child(1)) {
@apply dark:text-violet-50;
@apply text-violet-950 dark:text-violet-50 leading-snug;
}
}
.custom-block.warning {
@apply bg-yellow-50 dark:bg-yellow-900/20 border-none;
@apply bg-yellow-50 dark:bg-yellow-900/20 border-none text-sm;
&::before {
@apply bg-yellow-500/20 dark:bg-yellow-400/20;
}
& .custom-block-title {
@apply text-yellow-700 dark:text-yellow-300 font-semibold;
@apply text-yellow-700 dark:text-yellow-300 font-semibold text-base;
}
& ul ::marker {
@@ -135,19 +143,19 @@
}
&> :not(p:nth-child(1)) {
@apply text-yellow-950 dark:text-yellow-50 leading-tight;
@apply text-yellow-950 dark:text-yellow-50 leading-snug;
}
}
.custom-block.danger {
@apply bg-red-100 dark:bg-red-900/20 border-none;
@apply bg-red-100 dark:bg-red-900/20 border-none text-sm;
&::before {
@apply bg-red-500/20 dark:bg-red-400/20;
}
& .custom-block-title {
@apply text-red-800 dark:text-red-300 font-semibold;
@apply text-red-800 dark:text-red-300 font-semibold text-base;
}
& ul ::marker {
@@ -155,10 +163,15 @@
}
&> :not(p:nth-child(1)) {
@apply dark:text-red-50;
@apply text-red-950 dark:text-red-50 leading-snug;
}
}
article.docs-article .custom-block {
margin-top: 0.75rem;
margin-bottom: 0.75rem;
}
pre.shiki.shiki-themes.catppuccin-latte.catppuccin-mocha {
background-color: #f6f9ff;
}
+1 -1
View File
@@ -39,7 +39,7 @@ export default defineConfig({
'details': {
'margin-top': '0.5rem',
'margin-bottom': '0.5rem',
'padding': '1rem 1.5rem',
'padding': '0.5rem 1rem',
'background-color': '#a6ceef1a',
},
'.dark details': {