Jump to content

MediaWiki:Common.css

From Grigoripedia

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.
/* =========================================================
   Grigoripedia logo adjustments
   ========================================================= */

/* Hide the square icon/logo */
.mw-logo-icon {
    display: none !important;
}

/* Hide any text fallback */
.mw-logo-container__text,
.mw-logo-tagline {
    display: none !important;
}

/* Remove the empty space where the icon was */
.mw-logo {
    gap: 0 !important;
    min-width: 0 !important;
}

/* Let the wordmark size itself naturally */
.mw-logo-wordmark img {
    max-height: 40px;
    width: auto !important;
}

/* =========================================================
   Grigoripedia template boxes

   Smooth Wikipedia-like boxes for:
   - maintenance templates
   - priority templates
   - notice templates
   - content warning templates

   Replaces the older ultra-compact gp-maint-box CSS.
   ========================================================= */


/* =========================================================
   Base maintenance / notice box
   ========================================================= */

.gp-maint-box {
    box-sizing: border-box !important;

    display: flex !important;
    align-items: center !important;
    gap: 0.65em !important;

    width: 100% !important;
    max-width: none !important;

    /* More breathing room above/below */
    margin: 0.9em 0 0.85em 0 !important;

    /* Bigger, smoother box */
    padding: 0.7em 0.9em !important;

    border: 1px solid var(--border-color-base, #a2a9b1) !important;
    border-left: 7px solid var(--color-subtle, #a2a9b1) !important;

    background: var(--background-color-neutral-subtle, #f8f9fa) !important;
    color: inherit !important;

    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 95% !important;
    font-style: normal !important;
    font-weight: normal !important;
    line-height: 1.35 !important;

    clear: both !important;
    min-height: 0 !important;
}

/* Keep all text inside template boxes smooth and non-codey */
.gp-maint-box *,
.gp-maint-box div,
.gp-maint-box span,
.gp-maint-box p {
    font-family: Arial, Helvetica, sans-serif !important;
    font-style: normal !important;
    line-height: 1.35 !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Remove paragraph bloat inside boxes */
.gp-maint-box p {
    margin: 0 !important;
    padding: 0 !important;
}

/* Icon column */
.gp-maint-icon {
    flex: 0 0 auto !important;

    width: 1.45em !important;
    text-align: center !important;

    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 1.15em !important;
    font-style: normal !important;
    font-weight: normal !important;
    line-height: 1 !important;

    color: inherit !important;
}

/* Text column */
.gp-maint-text {
    flex: 1 1 auto !important;

    margin: 0 !important;
    padding: 0 !important;

    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 100% !important;
    font-style: normal !important;
    font-weight: normal !important;
    line-height: 1.35 !important;
}

/* Bold labels should stay bold, not huge */
.gp-maint-text b,
.gp-maint-text strong {
    font-family: Arial, Helvetica, sans-serif !important;
    font-weight: bold !important;
}

/* Links should look normal */
.gp-maint-box a {
    font-family: Arial, Helvetica, sans-serif !important;
    font-weight: inherit;
}


/* =========================================================
   Maintenance box color modifiers
   ========================================================= */

/* Stub articles: orange */
.gp-maint-stub {
    border-left-color: #d97706 !important;
}

/* General "Needs X" maintenance: blue */
.gp-maint-needed {
    border-left-color: #3366cc !important;
}

/* Page element maintenance: pink */
.gp-maint-page-elements {
    border-left-color: #cc6699 !important;
}

/* Serious maintenance: red */
.gp-maint-serious {
    border-left-color: #a33 !important;
}

/* Priority maintenance: purple */
.gp-maint-priority {
    border-left-color: #7b3fc6 !important;
}

/* Other/unsorted maintenance: gray */
.gp-maint-other {
    border-left-color: var(--color-subtle, #a2a9b1) !important;
}


/* =========================================================
   General notice boxes

   Reader-facing informational notices.
   Slightly quieter than maintenance boxes.
   ========================================================= */

.gp-maint-box.gp-notice-box {
    margin: 0.45em 0 0.65em 0 !important;
    padding: 0.45em 0.75em !important;

    border-left-width: 6px !important;

    background: var(--background-color-neutral-subtle, #f8f9fa) !important;

    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 86% !important;
    line-height: 1.32 !important;
}

.gp-maint-box.gp-notice-box .gp-maint-icon {
    font-size: 1em !important;
    width: 1.3em !important;
}

.gp-maint-box.gp-notice-box .gp-maint-text {
    line-height: 1.32 !important;
}

/* Blue border for general informational notices */
.gp-notice-info {
    border-left-color: #3366cc !important;
}


/* =========================================================
   Content warning boxes

   Reader-facing warning boxes.
   Distinct, but still smooth and not alarmist.
   ========================================================= */

.gp-maint-box.gp-content-warning-box {
    margin: 0.45em 0 0.65em 0 !important;
    padding: 0.5em 0.8em !important;

    border-width: 1px !important;
    border-left-width: 7px !important;
    border-left-color: #a33 !important;

    background: rgba(170, 51, 51, 0.055) !important;

    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 86% !important;
    line-height: 1.32 !important;
}

.gp-maint-box.gp-content-warning-box .gp-maint-icon {
    font-size: 1.05em !important;
    width: 1.35em !important;
    line-height: 1 !important;
}

.gp-maint-box.gp-content-warning-box .gp-maint-text {
    margin: 0 !important;
    padding: 0 !important;

    font-family: Arial, Helvetica, sans-serif !important;
    line-height: 1.32 !important;
}

.gp-maint-box.gp-content-warning-box .gp-warning-label {
    font-family: Arial, Helvetica, sans-serif !important;
    font-weight: bold !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}


/* =========================================================
   Spacing near surrounding article content
   ========================================================= */

/* Box followed by normal text */
.gp-maint-box + p,
.gp-content-warning-box + p,
.gp-notice-box + p {
    margin-top: 0.35em !important;
}

/* Normal text followed by box */
p + .gp-maint-box,
p + .gp-content-warning-box,
p + .gp-notice-box {
    margin-top: 0.65em !important;
}

/* Consecutive boxes */
.gp-maint-box + .gp-maint-box {
    margin-top: 0.35em !important;
}

/* =========================================================
   Spacing between templates and following section headings
   ========================================================= */

/*
 * Modern MediaWiki wraps headings in .mw-heading elements,
 * so rules targeting h2/h3/h4 directly may not apply.
 */

.mw-parser-output > .gp-maint-box + .mw-heading,
.mw-parser-output > .gp-navnote + .mw-heading,
.mw-parser-output > .gp-hatnote + .mw-heading {
    margin-top: 0.9em !important;
}

/* Prevent an additional top margin on the heading itself. */
.mw-parser-output > .gp-maint-box + .mw-heading > h2,
.mw-parser-output > .gp-maint-box + .mw-heading > h3,
.mw-parser-output > .gp-maint-box + .mw-heading > h4,
.mw-parser-output > .gp-navnote + .mw-heading > h2,
.mw-parser-output > .gp-navnote + .mw-heading > h3,
.mw-parser-output > .gp-navnote + .mw-heading > h4,
.mw-parser-output > .gp-hatnote + .mw-heading > h2,
.mw-parser-output > .gp-hatnote + .mw-heading > h3,
.mw-parser-output > .gp-hatnote + .mw-heading > h4 {
    margin-top: 0 !important;
}

/* Box after heading */
h2 + .gp-maint-box,
h3 + .gp-maint-box,
h4 + .gp-maint-box {
    margin-top: 0.35em !important;
}


/* =========================================================
   Mobile adjustments
   ========================================================= */

@media screen and (max-width: 720px) {
    .gp-maint-box {
        gap: 0.6em !important;

        margin: 0.85em 0 0.8em 0 !important;
        padding: 0.65em 0.8em !important;

        border-left-width: 6px !important;

        font-size: 92% !important;
        line-height: 1.32 !important;
    }

    .gp-maint-box *,
    .gp-maint-box div,
    .gp-maint-box span,
    .gp-maint-box p,
    .gp-maint-text {
        line-height: 1.32 !important;
    }

    .gp-maint-icon {
        width: 1.35em !important;
        font-size: 1.05em !important;
    }

    .gp-maint-box.gp-notice-box,
    .gp-maint-box.gp-content-warning-box {
        font-size: 92% !important;
        line-height: 1.32 !important;
    }
}

/* =========================================================
   Grigoripedia navigation / hatnote templates

   For templates such as:
   - Main
   - See also
   - Distinguish

   These are reader navigation aids, not maintenance boxes.
   ========================================================= */

.gp-navnote {
    margin: 0.35em 0 0.65em 0;
    padding: 0.35em 0.7em;
    background: var(--background-color-neutral-subtle, #f8f9fa);
    color: inherit;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 88%;
    font-style: italic;
    line-height: 1.35;
}

.gp-navnote p {
    margin: 0;
    padding: 0;
}

.gp-navnote a {
    font-style: normal;
}

/* Ultra-compact form for top-of-article hatnotes */
.gp-hatnote {
    margin: 0.25em 0 0.55em 0;
    padding: 0.3em 0.7em;
    background: var(--background-color-neutral-subtle, #f8f9fa);
    font-family: Arial, Helvetica, sans-serif;
    font-size: 86%;
    font-style: italic;
    line-height: 1.3;
}

.gp-hatnote p {
    margin: 0;
    padding: 0;
}

.gp-hatnote a {
    font-style: normal;
}
Retrieved from "https://satanael.org/wiki/index.php?title=MediaWiki:Common.css&oldid=716"