Template:Spec.css: Difference between revisions

← Older edit

@@ Line 1: / Line 1: @@
+:root {
+	--inner-width: 56rem;
+}
 #content {
 	font-family: 'Besley', serif !important;
+	counter-reset: section;
 }
 #firstHeading {
-	font-weight: 400;
+	font-weight: 800;
-	text-align: center;
+	font-size: 2.5rem;
-	font-stretch: 75%;
-	font-style: italic;
-	font-size: clamp(2rem, 12vw, 12rem);
 	font-family: 'Besley', serif !important;
-	color: var(--colour-grey-800);
+	color: var(--colour-grey-950);
+	margin: auto;
+	margin-top: 4rem;
 	margin-bottom: .25em;
 	border: none;
+	max-width: var(--inner-width);
+	width: 100%;
      &:has(+ #bodyContent .lede) {
@@ Line 19: / Line 25: @@
 	&::after {
-		display: block;
-		font-size: 0.8rem;
-		text-transform: uppercase;
-		font-stretch: 100%;
-		font-style: normal;
 		font-weight: 500;
-		margin-top: .5rem;
+		color: var(--colour-grey-400);
-		letter-spacing: 9%;
-		color: var(--colour-grey-600);
 	}
 }
@@ Line 38: / Line 37: @@
 #mw-content-text {
 	font-family: 'Besley', serif !important;
-	max-width: 56rem;
+	max-width: var(--inner-width);
 	margin: auto;
 	color: var(--colour-grey-800);
+	margin-bottom: 4rem;
 }
@@ Line 87: / Line 87: @@
 	display: block;
 	max-width: 24rem;
-	margin: auto;
 	background: transparent;
 	border: none;
 	color: var(--colour-grey-500);
+	float: right;
+	margin-left: 1rem;
 }
 .toctitle {
 	margin-bottom: .5rem;
-	display: grid;
+	display: flex;
-	grid-template-columns: 1fr 2fr 1fr;
+	justify-content: space-between;
-	justify-content: center;
 	align-items: baseline;
 }
@@ Line 119: / Line 119: @@
 	letter-spacing: 7%;
 	font-size: .85rem;
-	grid-column: 2;
+	margin-top: 0;
+	margin-right: 0.5rem;
 }
@@ Line 127: / Line 128: @@
 #content h2 {
+	position: relative;
 	border-bottom: 0;
 	font-size: 1.75em;
 	font-weight: 500;
+}
+h2 .mw-headline::before {
+	position: absolute;
+	right: 100%;
+	top: 0.175rem;
+	display: grid;
+	align-content: center;
+	justify-content: center;
+	aspect-ratio: 1 / 1;
+	width: auto;
+	height: 100%;
+	white-space: nowrap;
+	counter-increment: section;
+	content: counter(section);
+	font-size: 1rem;
+	color: var(--colour-grey-700);
+	background-color: var(--colour-grey-100);
+	font-weight: 600;
+	margin-right: .5rem;
 }
@@ Line 149: / Line 175: @@
 	font-size: 1.1rem;
 	color: var(--colour-grey-700);
-	text-align: center !important;
+	text-align: left !important;
 	max-width: 36rem;
-	margin-left: auto !important;
 	margin-right: auto !important;
 	margin-top: 0;
@@ Line 157: / Line 182: @@
 }
-del {
+s, .todo {
-	color: var(--colour-grey-500)
+	color: var(--colour-grey-500);
 }
-<noinclude>
+.todo::before {
-[[Category:Templates]]
+	content: "❊ todo: ";
-</noinclude>
+}
+.mw-highlight .nt {
+	color: var(--colour-ectoplasm-700);
+}
+.mw-highlight .na {
+	color: var(--colour-olive-700);
+}
+.mw-highlight .s {
+	color: var(--colour-red-700);
+}
+.mw-highlight .cm {
+	color: var(--colour-weezer-700);
+}
+pre, code, .mw-code {
+    color: var(--colour-grey-800);
+    background-color: var(--colour-grey-50);
+    border: 1px solid var(--colour-grey-200);
+}
+code {
+    white-space: nowrap;
+}
+.wikitable {
+	color: var(--colour-grey-800);
+	background-color: var(--colour-grey-50);
+	& > tr > th, > * > tr > th {
+		color: var(--colour-grey-800);
+		background-color: var(--colour-grey-100);
+	}
+	& > tr > th, > tr > td, > * > tr > th, > * > tr > td {
+			border: 1px solid var(--colour-grey-300);
+			& > code, > * > code {
+				background-color: white;
+			}
+	}
+}
+.tocnumber, .toctext {
+    font-variant-numeric: oldstyle-nums;
+}