chore: update docs styling
This commit is contained in:
parent
7fb4bc20b0
commit
4a748fe14a
|
|
@ -12,7 +12,7 @@ const { frontmatter } = useData()
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div class="container flex-1 items-start md:grid md:grid-cols-[220px_minmax(0,1fr)] md:gap-6 lg:grid-cols-[240px_minmax(0,1fr)] lg:gap-10">
|
||||
<div class="flex-1 items-start md:grid md:grid-cols-[220px_minmax(0,1fr)] md:gap-6 lg:grid-cols-[240px_minmax(0,1fr)] lg:gap-10">
|
||||
<aside
|
||||
class="fixed top-14 z-30 -ml-2 hidden h-[calc(100vh-3.5rem)] w-full shrink-0 md:sticky md:block overflow-y-auto"
|
||||
>
|
||||
|
|
|
|||
|
|
@ -18,30 +18,6 @@ const isDark = useDark()
|
|||
|
||||
const toggleDark = useToggle(isDark)
|
||||
|
||||
const routes = [
|
||||
{
|
||||
name: 'Documentation',
|
||||
path: '/docs',
|
||||
},
|
||||
{
|
||||
name: 'Components',
|
||||
path: '/docs/components/accordion',
|
||||
},
|
||||
{
|
||||
name: 'Themes',
|
||||
path: '/themes',
|
||||
},
|
||||
{
|
||||
name: 'Examples',
|
||||
path: '/examples/dashboard',
|
||||
},
|
||||
{
|
||||
name: 'GitHub',
|
||||
path: 'https://github.com/radix-vue/shadcn-vue',
|
||||
target: '_blank',
|
||||
},
|
||||
]
|
||||
|
||||
const links = [
|
||||
{
|
||||
name: 'GitHub',
|
||||
|
|
@ -60,7 +36,7 @@ const links = [
|
|||
<div class="flex min-h-screen flex-col bg-background">
|
||||
<header class="sticky z-40 top-0 bg-background/80 backdrop-blur-lg border-b border-border">
|
||||
<div
|
||||
class="max-w-8xl flex h-[58px] items-center justify-between p-4 mx-auto"
|
||||
class="container flex h-[58px] items-center justify-between p-4 mx-auto"
|
||||
>
|
||||
<div class="flex gap-6 md:gap-8">
|
||||
<a href="/" class="text-md font-bold"> shadcn-vue </a>
|
||||
|
|
@ -129,7 +105,7 @@ const links = [
|
|||
</div>
|
||||
</header>
|
||||
|
||||
<div class="flex-1 bg-background">
|
||||
<div class="container flex-1 bg-background">
|
||||
<component :is="'docs'" v-if="$route.path.includes('docs')">
|
||||
<Content />
|
||||
</component>
|
||||
|
|
@ -142,7 +118,7 @@ const links = [
|
|||
</div>
|
||||
|
||||
<footer class="bg-background z-40 border-t border-border text-foreground">
|
||||
<div class="max-w-8xl h-20 flex items-center justify-between p-4 mx-auto">
|
||||
<div class="container h-20 flex items-center justify-between p-4 mx-auto">
|
||||
<div class="flex justify-center items-center">
|
||||
<span class="text-sm">
|
||||
Built and designed by {{ " " }}
|
||||
|
|
|
|||
|
|
@ -106,17 +106,6 @@
|
|||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
pre {
|
||||
@apply mb-4 mt-6 max-h-[650px] overflow-x-auto rounded-lg border !bg-zinc-950 py-4 dark:!bg-zinc-900
|
||||
|
||||
}
|
||||
pre code {
|
||||
@apply relative rounded font-mono text-sm ;
|
||||
}
|
||||
|
||||
pre code .line {
|
||||
@apply px-4 min-h-[1.5rem] !py-0.5 w-full inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -138,5 +127,15 @@
|
|||
}
|
||||
}
|
||||
|
||||
pre {
|
||||
@apply mb-4 mt-6 max-h-[650px] overflow-x-auto rounded-lg border !bg-zinc-950 py-4 dark:!bg-zinc-900
|
||||
|
||||
}
|
||||
pre code {
|
||||
@apply relative rounded font-mono text-sm ;
|
||||
}
|
||||
|
||||
pre code .line {
|
||||
@apply px-4 min-h-[1.5rem] !py-0.5 w-full inline-block;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,11 +0,0 @@
|
|||
import { cva } from 'class-variance-authority'
|
||||
|
||||
export const buttonClass = cva(
|
||||
'flex px-2 py-2',
|
||||
{
|
||||
variants: {
|
||||
primary: 'bg-blue-200',
|
||||
secondary: 'bg-red-400',
|
||||
},
|
||||
},
|
||||
)
|
||||
Loading…
Reference in New Issue
Block a user