doc: improve navigation links

HerringtonDarkholme · HerringtonDarkholme · commit 7c4a14ebec3e · 2024-11-29T00:57:45.000-05:00
diff --git a/website/.vitepress/config.ts b/website/.vitepress/config.ts
@@ -34,8 +34,24 @@ export default defineConfig({
     logo: 'logo.svg',
     nav: [
       { text: 'Guide', link: '/guide/introduction.html' },
-      { text: 'Reference', link: '/reference/cli.html' },
-      { text: 'Examples', link: '/catalog/' },
+      {
+        text: 'Reference',
+        items: [
+          { text: 'Command Line Interface', link: '/reference/cli.html' },
+          { text: 'Rule Config', link: '/reference/yaml.html' },
+          { text: 'Rule Object', link: '/reference/rule.html' },
+          { text: 'Playground Manual', link: '/reference/playground.html' },
+        ]
+      },
+      {
+        text: 'Resources',
+        items: [
+          { text: 'FAQ', link: '/advanced/faq.html' },
+          { text: 'Rule Examples', link: '/catalog/' },
+          { text: 'Custom Language', link: '/advanced/custom-language.html' },
+          { text: 'Contributing', link: '/contributing/how-to.html' },
+        ],
+      },
       { text: 'Playground', link: '/playground.html' },
     ],
     socialLinks: [
diff --git a/website/src/style.css b/website/src/style.css
@@ -130,7 +130,7 @@ h1 {
   line-height: 1.1;
 }
 
-button {
+.root button {
   border-radius: 8px;
   border: 1px solid transparent;
   padding: 0.6em 1.2em;
@@ -141,13 +141,13 @@ button {
   cursor: pointer;
   transition: border-color 0.25s;
 }
-button:hover {
+.root button:hover {
   border-color: var(--vp-button-alt-hover-border);
   color: var(--vp-button-alt-hover-text);
   background-color: var(--vp-button-alt-hover-bg);
 }
-button:focus,
-button:focus-visible {
+.root button:focus,
+.root button:focus-visible {
   outline: 4px auto -webkit-focus-ring-color;
 }
 

Original file line number	Diff line number	Diff line change
`@@ -130,7 +130,7 @@ h1 {`
`130`	`130`	`line-height: 1.1;`
`131`	`131`	`}`
`132`	`132`
`133`		`-button {`
	`133`	`+.root button {`
`134`	`134`	`border-radius: 8px;`
`135`	`135`	`border: 1px solid transparent;`
`136`	`136`	`padding: 0.6em 1.2em;`
`@@ -141,13 +141,13 @@ button {`
`141`	`141`	`cursor: pointer;`
`142`	`142`	`transition: border-color 0.25s;`
`143`	`143`	`}`
`144`		`-button:hover {`
	`144`	`+.root button:hover {`
`145`	`145`	`border-color: var(--vp-button-alt-hover-border);`
`146`	`146`	`color: var(--vp-button-alt-hover-text);`
`147`	`147`	`background-color: var(--vp-button-alt-hover-bg);`
`148`	`148`	`}`
`149`		`-button:focus,`
`150`		`-button:focus-visible {`
	`149`	`+.root button:focus,`
	`150`	`+.root button:focus-visible {`
`151`	`151`	`outline: 4px auto -webkit-focus-ring-color;`
`152`	`152`	`}`
`153`	`153`