Configuration & Styilng updates

Author: moonclavedev

astro.config.mjs

@@ -11,7 +11,23 @@ export default defineConfig({
   site: "https://aptos.dev",
   integrations: [
     starlight({
-      title: "Aptos Docs",
+      title: "Aptos Developer Docs",
+      logo: {
+        light: "~/assets/aptos-logomark-light.svg",
+        dark: "~/assets/aptos-logomark-dark.svg",
+        replacesTitle: true,
+      },
+      expressiveCode: {
+        shiki: {
+          // Define langs for shiki syntax highlighting
+          langAlias: {
+            Move: "move",
+            move: "move",
+            PowerShell: "powershell",
+            terraform: "terraform",
+          },
+        },
+      },
       defaultLocale: "root", // optional
       locales: {
         root: {
@@ -36,8 +52,8 @@ export default defineConfig({
         starlightOpenAPI(
           [
             {
-              base: "api",
-              label: "API",
+              base: "api-reference",
+              label: "API Reference",
               schema: "./aptos-spec.json",
               sidebarMethodBadges: true,
             },
@@ -48,17 +64,28 @@ export default defineConfig({
         ),
       ],
       sidebar: [
+        // {
+        //   label: "Guides",
+        //   items: [
+        //     // Each item here is one entry in the navigation menu.
+        //     { label: "Example Guide", slug: "guides/example" },
+        //   ],
+        // },
+        // {
+        //   label: "Reference",
+        //   autogenerate: { directory: "reference" },
+        // },
         {
-          label: "Guides",
-          items: [
-            // Each item here is one entry in the navigation menu.
-            { label: "Example Guide", slug: "guides/example" },
-          ],
+          label: "Build",
+          collapsed: true,
+          autogenerate: { directory: "build" },
         },
         {
-          label: "Reference",
-          autogenerate: { directory: "reference" },
+          label: "Network",
+          collapsed: true,
+          autogenerate: { directory: "network" },
         },
+
         ...openAPISidebarGroups,
       ],
       customCss: ["./src/globals.css"],

src/globals.css

@@ -6,7 +6,7 @@ Add additional Tailwind styles to this file, for example with @layer:
 https://tailwindcss.com/docs/adding-custom-styles#using-css-and-layer
 */
 :root {
-  --sl-content-width: 75rem;
+  --sl-content-width: 65rem;
   --sl-text-5xl: 3.5rem;
   --sl-color-bg-sidebar: transparent;
 
@@ -18,7 +18,22 @@ https://tailwindcss.com/docs/adding-custom-styles#using-css-and-layer
 }
 
 .sidebar-content ul li {
-  border-inline-start: 0;
+  border-inline-start: 1;
+}
+
+.sidebar-content ul li a {
+  padding: 0.5em calc(var(--sl-sidebar-item-padding-inline) + 0.25em);
+}
+
+.sidebar-content ul li a[aria-current="page"] { 
+  background-color: var(--sl-color-text-invert);
+  color: var(--sl-color-text-accent);
+}
+
+.sidebar-content .large {
+  font-size: var(--sl-text-base);
+  font-weight:500;
+  color: var(--sl-color-gray-1);
 }
 
 header {
@@ -46,3 +61,23 @@ header {
 header site-search button {
   border-radius: 0 !important;
 }
+
+/* Temporarily hide the first h1 in the markdown content as these are defined in frontmatter */
+.sl-markdown-content h1:first-of-type {
+  display:none;
+}
+
+.sl-link-card {
+  border-radius: 0;
+}
+
+.group-label {
+  text-transform:capitalize;
+}
+
+
+.sl-link-button.primary {
+  border-radius: 0;
+  background:white;
+  border:none;
+}