Module:Documentation/styles.css: Difference between revisions

Browse history interactively

← Older edit Newer edit →

@@ Line 1: / Line 1: @@
 /* {{PP-template}} */
-.documentation,
+.ts-doc-sandbox .mbox-image {
-.documentation-metadata {
+	padding:.75em 0 .75em .75em;
-	border: 1px solid var( --border-color-base, #a2a9b1 );
+}
-	background-color: #ecfcf4; color:inherit;
+.ts-doc-doc {
 	clear: both;
+	background-color: #ecfcf4;
+	border: 1px solid #a2a9b1;
+	margin-top: 1em;
+	padding: 5px;
+}
+.ts-doc-header {
+	padding-bottom: 3px;
+	border-bottom: 1px solid #a2a9b1;
+	margin-bottom: 1ex;
 }
-.documentation {
+.ts-doc-header .ts-tlinks-tlinks {
-	margin: 1em 0 0 0;
+	display: inline-block;
-	padding: 1em;
+	line-height: 24px;
+	margin-left: 1em;
 }
-.documentation-metadata {
+.ts-doc-header .ts-tlinks-tlinks a.external {
-	margin: 0.2em 0; /* same margin left-right as .documentation */
+	color: #0645ad;
-    font-style: italic;
-    padding: 0.4em 1em; /* same padding left-right as .documentation */
 }
-.documentation-startbox {
+.ts-doc-header .ts-tlinks-tlinks a.external:visited {
-	padding-bottom: 3px;
+	color: #0b0080;
-	border-bottom: 1px solid var( --border-color-base, #a2a9b1 );
-	margin-bottom: 1ex;
 }
-.documentation-heading {
+.ts-doc-header .ts-tlinks-tlinks a.external:active {
-	font-weight: bold;
+	color: #faa700;
-	font-size: 125%;
 }
-.documentation-clear { /* Don't want things to stick out where they shouldn't. */
+.ts-doc-content:after {
+	content: '';
 	clear: both;
+	display: block;
+}
+.ts-doc-heading {
+	display: inline-block;
+	padding-left: 55px;
+	background: center left/50px no-repeat;
+	background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/4/43/Test_Template_Info-Icon_-_Version_%282%29.svg/50px-Test_Template_Info-Icon_-_Version_%282%29.svg.png);
+	background-image: url(https://upload.wikimedia.org/wikipedia/commons/4/43/Test_Template_Info-Icon_-_Version_%282%29.svg);
+	font-size: 1.5em;
 }
-.documentation-toolbar {
+.ts-doc-content > *:first-child,
+.ts-doc-footer > *:first-child {
+	margin-top: .5em;
+}
+.ts-doc-content > *:last-child,
+.ts-doc-footer > *:last-child {
+	margin-bottom: .5em;
+}
+.ts-doc-footer {
+	background-color: #ecfcf4;
+	border: 1px solid #a2a9b1;
+	padding: .25em 1em;
+	margin-top: .2em;
+	font-style: italic;
+}
+.ts-doc-footer small {
 	font-style: normal;
-	font-size: 85%;
 }
+.ts-doc-sandbox {
+	clear: both;
+}
 @media screen {
-    html.skin-theme-clientpref-night .documentation,
+	html.skin-theme-clientpref-night .ts-doc-footer,
-	html.skin-theme-clientpref-night .documentation-metadata {
+	html.skin-theme-clientpref-night .ts-doc-doc {
-	    background-color: #0b1e1c; color:inherit;
+	background-color: #0b1e1c;
 	}
 }
+@media screen and (prefers-color-scheme: dark) {
+     html.skin-theme-clientpref-os .ts-doc-footer,
-@media screen and ( prefers-color-scheme: dark ) {
+     html.skin-theme-clientpref-os .ts-doc-doc {
-     html.skin-theme-clientpref-os .documentation,
+      background-color: #0b1e1c;
-     html.skin-theme-clientpref-os .documentation-metadata {
-        background-color: #0b1e1c; color:inherit;
      }
+}
+/* fix headers in dark mode */
+.ts-doc-content .mw-headline {
+	color:inherit;
+}
+.mw-templatedata-caption,
+.mw-templatedata-format {
+	color:inherit;
+}
+/* fix icon for templatedata params (inline/block) in dark mode */
+.mw-templatedata-doc-params .oo-ui-widget {
+	filter: unset !important;
 }