[Docs Site] Overhaul aside styling

cloudflare · Sep 23, 2024 · baa824d · baa824d
1 parent 82b6e09
commit baa824d
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 0 deletions.
diff --git a/astro.config.mjs b/astro.config.mjs
@@ -146,6 +146,7 @@ export default defineConfig({
 			},
 			sidebar: await autogenSections(),
 			customCss: [
+				"./src/asides.css",
 				"./src/headings.css",
 				"./src/input.css",
 				"./src/kbd.css",

diff --git a/src/asides.css b/src/asides.css
@@ -0,0 +1,36 @@
+.starlight-aside {
+	border: unset;
+	border-radius: 4px;
+
+	&.starlight-aside--note {
+		background-color: rgb(236, 244, 255);
+	}
+
+	&.starlight-aside--caution {
+		background-color: rgb(255, 248, 228);
+
+	}
+
+	.starlight-aside__title {
+		margin-left: 30px;
+
+		svg {
+			margin-left: -30px;
+		}
+	}
+
+	.starlight-aside__content {
+		margin-top: unset;
+		margin-left: 30px;
+	}
+}
+
+:root[data-theme="dark"] {
+	.starlight-aside--note {
+		background-color: rgb(0, 28, 67);
+	}
+
+	.starlight-aside--caution {
+		background-color: rgb(98, 73, 10);
+	}
+}