MediaWiki:Common.css: Difference between revisions

← Older edit

@@ Line 516: / Line 516: @@
      border-top: none;
    }
+}
+/* ============================================================
+   Light mode tuning (keeps your dark-mode look intact)
+   - 1) Lighter top band panels (Level Select + Type)
+   - 2) Stronger borders in top band + type grid
+   - 3) More apparent zebra striping
+   ========================================================== */
+/* Prefer MW theme classes, with a safe fallback to prefers-color-scheme */
+.mw-theme-light table.spiritvale-skill-infobox .sv-topband-cell,
+@media (prefers-color-scheme: light) {
+  table.spiritvale-skill-infobox .sv-topband-cell {
+    background: linear-gradient(
+deg,
+      rgba(255, 255, 255, 0.92),
+      rgba(226, 232, 240, 0.92)
+    ) !important;
+  }
+}
+/* Text + contrast tweaks inside the top band for light mode */
+.mw-theme-light table.spiritvale-skill-infobox .sv-level-title,
+.mw-theme-light table.spiritvale-skill-infobox .sv-level-label,
+.mw-theme-light table.spiritvale-skill-infobox .sv-type-value,
+.mw-theme-light table.spiritvale-skill-infobox .sv-type-label {
+  color: #111827;
+}
+/* Stronger divider between Level + Type panes (light mode) */
+.mw-theme-light table.spiritvale-skill-infobox .sv-topband-table > tbody > tr > td:first-child {
+  border-right: 1px solid rgba(55, 43, 84, 0.28);
+}
+/* Stronger type-grid cell borders (light mode) */
+.mw-theme-light table.spiritvale-skill-infobox .sv-type-chunk {
+  border-top: 1px solid rgba(55, 43, 84, 0.20);
+  border-left: 1px solid rgba(55, 43, 84, 0.20);
+}
+/* Slightly lighter label pill background in light mode (so it reads cleaner) */
+.mw-theme-light table.spiritvale-skill-infobox .sv-type-label {
+  background: linear-gradient(
+deg,
+    rgba(122, 111, 176, 0.22),
+    rgba(90, 78, 124, 0.12)
+  );
+}
+/* Mobile separator between stacked panes (light mode) */
+@media (max-width: 560px) {
+  .mw-theme-light table.spiritvale-skill-infobox .sv-topband-table > tbody > tr > td:first-child {
+    border-bottom: 1px solid rgba(55, 43, 84, 0.28);
+  }
+}
+/* More apparent zebra striping in light mode */
+.mw-theme-light table.spiritvale-skill-infobox > tbody > tr:nth-child(odd) > td,
+.mw-theme-light table.spiritvale-skill-infobox > tbody > tr:nth-child(odd) > th:not(.spiritvale-infobox-section-header),
+.mw-theme-light table.spiritvale-passive-infobox > tbody > tr:nth-child(odd) > td,
+.mw-theme-light table.spiritvale-passive-infobox > tbody > tr:nth-child(odd) > th:not(.spiritvale-infobox-section-header) {
+  background-color: rgba(148, 163, 184, 0.12);
+}
+/* Optional: slightly stronger row separators in light mode (keeps structure crisp) */
+.mw-theme-light table.spiritvale-skill-infobox > tbody > tr,
+.mw-theme-light table.spiritvale-passive-infobox > tbody > tr {
+  border-bottom: 1px solid rgba(55, 43, 84, 0.18);
 }