MediaWiki: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.

/* GoodToKnow logo header: blue lines above and below */
.mw-page-container {
    position: relative;
}

.mw-page-container .mw-page-container-inner > .mw-header-container {
    border-top: 24px solid #1E90FF;
    border-bottom: 24px solid #1E90FF;
}

/* Vector 2022 header fallback */
.mw-header {
    border-top: 24px solid #1E90FF;
    border-bottom: 24px solid #1E90FF;
}
/* GoodToKnow restored navigation colors */
.vector-pinnable-element .vector-menu-heading,
.vector-column-start .vector-menu-heading {
    background: #FFC107;
    color: #fff;
    padding: 8px 12px;
    border-radius: 5px 5px 0 0;
}

.vector-pinnable-element .vector-menu-content,
.vector-column-start .vector-menu-content {
    background: #FEF5E7;
    padding: 8px;
    border-radius: 0 0 5px 5px;
}

/* Center the original GoodToKnow logo */
@media screen and (min-width: 1000px) {
    .mw-header {
        position: relative;
        min-height: 175px;
        align-items: start;
    }

    .mw-logo {
        position: absolute;
        left: 50%;
        top: 30px;
        transform: translateX(-50%);
        z-index: 2;
    }

    .mw-logo-wordmark {
        max-width: 300px;
        height: auto;
    }
}/* GoodToKnow restored right-hand sidebar */
@media screen and (min-width: 1100px) {
    body.action-view .mw-body.gtk-sidebar-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 250px;
        column-gap: 24px;
        align-items: start;
    }

    body.action-view .mw-body.gtk-sidebar-layout > :not(#gtk-restored-sidebar) {
        grid-column: 1;
        min-width: 0;
    }

    body.action-view #gtk-restored-sidebar {
        grid-column: 2;
        grid-row: 1 / span 10;
        width: 250px;
    }

    body.action-view .gtk-hide-appearance {
        display: none;
    }
}

#gtk-restored-sidebar {
    box-sizing: border-box;
    font-size: 14px;
}

.gtk-history-panel {
    background: #D5D8DC;
    color: #222;
    min-height: 165px;
    padding: 12px;
    margin-bottom: 16px;
    box-sizing: border-box;
}

.gtk-history-panel h3 {
    font-size: 16px;
    font-weight: bold;
    margin: 0 0 12px;
}

.gtk-history-panel p {
    margin: 0;
    line-height: 1.5;
}

.gtk-navigation-panel {
    background: #FEF5E7;
    border-radius: 5px;
    overflow: hidden;
}

.gtk-navigation-panel h3 {
    background: #FFC107;
    color: #fff;
    padding: 12px;
    margin: 0;
    font-size: 16px;
    font-weight: bold;
}

.gtk-navigation-panel ul {
    list-style: none;
    padding: 12px;
    margin: 0;
}

.gtk-navigation-panel li {
    margin: 0 0 10px;
}

.gtk-navigation-panel a {
    color: #0645AD;
    text-decoration: none;
}

.gtk-navigation-panel a:hover {
    text-decoration: underline;
}

@media screen and (max-width: 1099px) {
    #gtk-restored-sidebar {
        width: 100%;
        max-width: 350px;
        margin: 24px 0;
    }
}
/* GoodToKnow logo spacing adjustment */
@media screen and (min-width: 1000px) {
    .mw-header {
        min-height: 195px;
    }

    .mw-logo {
        top: 15px;
    }

    .mw-logo-wordmark {
        max-width: 260px;
        max-height: 120px;
        object-fit: contain;
    }
}