More attractive homepage numbers

dphfox · Aug 28, 2024 · 4ef4f31 · 4ef4f31
1 parent c93f718
commit 4ef4f31
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 6 deletions.
diff --git a/docs/assets/home/fusion-clip-shape.svg b/docs/assets/home/fusion-clip-shape.svg
diff --git a/docs/assets/theme/home.css b/docs/assets/theme/home.css
@@ -170,19 +170,41 @@
 	margin-top: 1rem;
 }
 
-#fusiondoc-home-belowfold > h2.first::before {
-	content: "➀";
+#fusiondoc-home-belowfold > h2.first::before,
+#fusiondoc-home-belowfold > h2.second::before,
+#fusiondoc-home-belowfold > h2.third::before {
+	content: "1";
+	display: inline flex;
+	align-items: center;
+	justify-content: center;
+	width: 2.2em;
+	height: 2em;
+	mask: url(../home/fusion-clip-shape.svg);
+	mask-size: contain;
+	mask-position: center;
+	mask-repeat: no-repeat;
+	background-color: var(--fusiondoc-grey-5);
+	color: var(--fusiondoc-bg-1);
 	margin-right: 0.75rem;
+	vertical-align: middle;
+}
+
+@media screen and (min-width: 80em) {
+	#fusiondoc-home-belowfold > h2.first::before,
+	#fusiondoc-home-belowfold > h2.second::before,
+	#fusiondoc-home-belowfold > h2.third::before {
+		margin-left: -3.5rem;
+		margin-top: -1rem;
+		margin-bottom: -1rem;
+	}
 }
 
 #fusiondoc-home-belowfold > h2.second::before {
-	content: "➁";
-	margin-right: 0.75rem;
+	content: "2";
 }
 
 #fusiondoc-home-belowfold > h2.third::before {
-	content: "➂";
-	margin-right: 0.75rem;
+	content: "3";
 }
 
 #fusiondoc-home {