Template:License/styles.css: Difference between revisions

Browse history interactively

@@ Line 1: / Line 1: @@
 .mw-license-box {
-      display: inline-table;
+    display: inline-table;
-      border: 1px solid #aaa;
+    border: 1px solid var(--border-color-base, #a2a9b1);
-      font-size: 88%;
+    font-size: 88%;
-      margin: 0.2em 0;
+    margin: 0.2em 0;
-      clear: right;
+    clear: right;
-      float: right;
+    float: right;
-  }
+}
-  .mw-license-box td {
+.mw-license-box td {
-      vertical-align: middle;
+    vertical-align: middle;
-      padding: 3px 6px;
+    padding: 3px 6px;
-  }
+}
-  .mw-license-badge {
+.mw-license-badge {
-      font-weight: bold;
+    font-weight: bold;
-      font-size: 115%;
+    font-size: 115%;
-      text-align: center;
+    text-align: center;
-      min-width: 52px;
+    min-width: 52px;
-      border-right: 1px solid #aaa;
+    border-right: 1px solid var(--border-color-base, #a2a9b1);
-      white-space: nowrap;
+    white-space: nowrap;
-  }
+    color: #202122;
-  .mw-license-desc {
+}
-      max-width: 220px;
+.mw-license-desc {
-  }
+    max-width: 220px;
-  .mw-license-desc a { font-weight: bold; }
+    color: var(--color-base, #202122);
+}
+.mw-license-desc a {
+    font-weight: bold;
+}
-  .mw-license-cc-by       .mw-license-badge { background: #b3e0b3; }
+/* Light mode badge backgrounds */
-  .mw-license-cc-by-sa    .mw-license-badge { background: #99d699; }
+.mw-license-cc-by .mw-license-badge {
-  .mw-license-cc-by-nc    .mw-license-badge { background: #fde68a; }
+    background: #b3e0b3;
-  .mw-license-cc-by-nc-sa .mw-license-badge { background: #fcd34d; }
+}
-  .mw-license-cc-by-nd    .mw-license-badge { background: #a5d8f3; }
+.mw-license-cc-by-sa .mw-license-badge {
-  .mw-license-cc-by-nc-nd .mw-license-badge { background: #f3a5d8; }
+    background: #99d699;
-  .mw-license-cc0         .mw-license-badge { background: #c4b5fd; }
+}
-  .mw-license-arr         .mw-license-badge { background: #e8e8e8; }
+.mw-license-cc-by-nc .mw-license-badge {
+    background: #fde68a;
+}
+.mw-license-cc-by-nc-sa .mw-license-badge {
+    background: #fcd34d;
+}
+.mw-license-cc-by-nd .mw-license-badge {
+    background: #a5d8f3;
+}
+.mw-license-cc-by-nc-nd .mw-license-badge {
+    background: #f3a5d8;
+}
+.mw-license-cc0 .mw-license-badge {
+    background: #c4b5fd;
+}
+.mw-license-arr .mw-license-badge {
+    background: var(--background-color-neutral, #eaecf0);
+    color: var(--color-base, #202122);
+}
+/* Dark badge backgrounds + text — manual Night toggle */
+@media screen {
+    html.skin-theme-clientpref-night .mw-license-cc-by .mw-license-badge {
+         background: #1a4d1a;
+        color: #c8f0c8;
+    }
+    html.skin-theme-clientpref-night .mw-license-cc-by-sa .mw-license-badge {
+        background: #144014;
+        color: #a8e0a8;
+    }
+    html.skin-theme-clientpref-night .mw-license-cc-by-nc .mw-license-badge {
+        background: #4d3d00;
+        color: #ffe99a;
+    }
+    html.skin-theme-clientpref-night .mw-license-cc-by-nc-sa .mw-license-badge {
+        background: #4d3200;
+        color: #ffd97a;
+    }
+    html.skin-theme-clientpref-night .mw-license-cc-by-nd .mw-license-badge {
+        background: #0d3a52;
+        color: #a8d8f0;
+    }
+    html.skin-theme-clientpref-night .mw-license-cc-by-nc-nd .mw-license-badge {
+        background: #52112e;
+        color: #f0a8cc;
+    }
+    html.skin-theme-clientpref-night .mw-license-cc0 .mw-license-badge {
+        background: #2d1a5e;
+        color: #d4bbff;
+    }
+}
+/* Dark badge backgrounds + text — OS dark preference */
+@media screen and (prefers-color-scheme: dark) {
+    html.skin-theme-clientpref-os .mw-license-cc-by .mw-license-badge {
+        background: #1a4d1a;
+        color: #c8f0c8;
+    }
+    html.skin-theme-clientpref-os .mw-license-cc-by-sa .mw-license-badge {
+        background: #144014;
+        color: #a8e0a8;
+    }
+    html.skin-theme-clientpref-os .mw-license-cc-by-nc .mw-license-badge {
+        background: #4d3d00;
+        color: #ffe99a;
+    }
+    html.skin-theme-clientpref-os .mw-license-cc-by-nc-sa .mw-license-badge {
+        background: #4d3200;
+        color: #ffd97a;
+    }
+    html.skin-theme-clientpref-os .mw-license-cc-by-nd .mw-license-badge {
+        background: #0d3a52;
+        color: #a8d8f0;
+    }
+    html.skin-theme-clientpref-os .mw-license-cc-by-nc-nd .mw-license-badge {
+        background: #52112e;
+        color: #f0a8cc;
+    }
+    html.skin-theme-clientpref-os .mw-license-cc0 .mw-license-badge {
+        background: #2d1a5e;
+        color: #d4bbff;
+    }
+}