Module:Documentation/styles.css: Difference between revisions

Revision as of 01:13, 18 March 2025

.documentation {
    margin-top: var( --space-md );
    padding-top: var( --space-md );
    border-top: 1px solid;
    border-color: var( --border-color-base );
    font-size: var( --font-size-small );
}

.documentation-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.documentation-title {
    color: var( --color-emphasized );
    font-size: var( --font-size-x-large );
    font-weight: var( --font-weight-semi-bold );
    line-height: var( --line-height-xxx-small );
}

.documentation-links {
    font-family: var( --font-family-monospace );
}

.documentation-subheader {
    color: var( --color-subtle );
    font-size: var( --font-size-x-small );
    line-height: var( --line-height-xx-small );
}

.documentation-content {
    margin-top: var( --space-xl );
}

.documentation-modulestats {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.documentation-modulestats > * {
    margin: 0 !important;
}

@@ Line 1: / Line 1: @@
-/* {{pp|small=yes}} */
-.documentation,
-.documentation-metadata {
-	border: 1px solid var( --border-color-base, #a2a9b1 );
-	background-color: #ecfcf4;
-	clear: both;
-}
 .documentation {
-	margin: 1em 0 0 0;
+    margin-top: var( --space-md );
-	padding: 1em;
+    padding-top: var( --space-md );
+    border-top: 1px solid;
+    border-color: var( --border-color-base );
+    font-size: var( --font-size-small );
 }
-.documentation-metadata {
+.documentation-header {
-	margin: 0.2em 0; /* same margin left-right as .documentation */
+    display: flex;
-     font-style: italic;
+    align-items: center;
-     padding: 0.4em 1em; /* same padding left-right as .documentation */
+     justify-content: space-between;
+     flex-wrap: wrap;
 }
-.documentation-startbox {
+.documentation-title {
-	padding-bottom: 3px;
+    color: var( --color-emphasized );
-	border-bottom: 1px solid var( --border-color-base, #a2a9b1 );
+    font-size: var( --font-size-x-large );
-	margin-bottom: 1ex;
+    font-weight: var( --font-weight-semi-bold );
+    line-height: var( --line-height-xxx-small );
 }
-.documentation-heading {
+.documentation-links {
-	font-weight: bold;
+    font-family: var( --font-family-monospace );
-	font-size: 125%;
 }
-.documentation-clear { /* Don't want things to stick out where they shouldn't. */
+.documentation-subheader {
-	clear: both;
+    color: var( --color-subtle );
+    font-size: var( --font-size-x-small );
+    line-height: var( --line-height-xx-small );
 }
-.documentation-toolbar {
+.documentation-content {
-	font-style: normal;
+    margin-top: var( --space-xl );
-	font-size: 85%;
 }
+.documentation-modulestats {
-@media screen {
+     display: flex;
-     html.skin-theme-clientpref-night .documentation,
+    align-items: center;
-	html.skin-theme-clientpref-night .documentation-metadata {
+    justify-content: space-between;
-	    background-color: #0b1e1c;
-	}
 }
+.documentation-modulestats > * {
-@media screen and ( prefers-color-scheme: dark ) {
+    margin: 0 !important;
-    html.skin-theme-clientpref-os .documentation,
-    html.skin-theme-clientpref-os .documentation-metadata {
-        background-color: #0b1e1c;
-    }
 }