User:Krishj4/common.css

Note: After publishing, you may have to bypass your browser's cache to see the changes.

Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

@import url('https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&family=Geist+Mono:wght@400;500&display=swap');

:root {
      --rpi-red: #d6001c;
      --rpi-font: "Geist", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-
      --rpi-mono: "Geist Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}

/* Geist across the Vector 2022 surface */
.skin-vector-2022,
.skin-vector-2022 .mw-body,
.skin-vector-2022 .mw-body-content,
.skin-vector-2022 .vector-menu,
.skin-vector-2022 .vector-header-container,
.skin-vector-2022 .mw-footer {
      font-family: var(--rpi-font);
}

/* Override Vector's serif heading
.skin-vector-2022 .mw-body h1,
.skin-vector-2022 .mw-body h2,
.skin-vector-2022 .mw-body h3,
.skin-vector-2022 .mw-body h4,
.skin-vector-2022 .mw-body h5,
.skin-vector-2022 .mw-body h6,
.skin-vector-2022 .mw-first-heading {
      font-family: var(--rpi-font)
}

/* Geist Mono: code + infobox detail values */
.skin-vector-2022 code,
.skin-vector-2022 pre,
.skin-vector-2022 kbd,
.skin-vector-2022 samp,
.skin-vector-2022 tt,
.skin-vector-2022 .mw-code,
.skin-vector-2022 .infobox td {
      font-family: var(--rpi-mono);
}

/* Red wordmark */
.skin-vector-2022 .mw-logo-wordmark {
      color: var(--rpi-red);
}

/* Thin red rule under page title + section headings */
.skin-vector-2022 .mw-body h1.firs
.skin-vector-2022 .mw-body .mw-first-heading,
.skin-vector-2022 .mw-body h2 {
      border-bottom: 1px solid var(--rpi-red);
      padding-bottom: 0.25em;
}

/* Infobox accent */
.skin-vector-2022 .infobox {
      border-top: 3px solid var(--rpi-red);
}
.skin-vector-2022 .infobox-title,
.skin-vector-2022 .infobox > tbodyan] {
      color: var(--rpi-red);
}