MediaWiki:Common.css

    From Gallowpedia, the MediEvil Wiki. You'll be dying to read!
    Revision as of 00:47, 28 March 2025 by DansFriend (talk | contribs)

    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)
    • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
    • Opera: Press Ctrl-F5.
    /* CSS placed here will be applied to all skins */

.page-Main_Page #bottom-notice-ns {
    display: none;
}

.sitedir-ltr .mw-dismissable-notice-body {
    margin: 0 !important;
}

.sitedir-ltr .mw-dismissable-notice-close {
    font-size: larger;
    position: relative;
    z-index: 6;
}

/* Interwiki table */
table.mw-interwikitable.body td.mw-interwikitable-local-yes {
    color: black;
}

dl {
    margin: 0.2em auto !important;
}

.chronology .real, .chronology .res, .chronology .ghosthunter {
    opacity: 0.9;
}

.cdx-thumbnail__image {
    background-position: top !important;
}

.note a img {
    width: 100%;
    width: -moz-available;          /* WebKit-based browsers will ignore this. */
    width: -webkit-fill-available;  /* Mozilla-based browsers will ignore this. */
    height: auto;
}

/**************************
 * Comments extension mods *
 **************************/
.c-avatar img {
    background-color: transparent;
}

.c-order {
    padding-top: 0px;
    padding-bottom: 40px;
}

.c-form-title {
    color: inherit;
}

textarea#comment {
    resize: none;
}

/**********************************
 * Related Articles modifications *
 **********************************/

.ra-read-more h2 {
    font-family: Tico;
}

/* Dark mode specific */

.client-dark-mode .ra-read-more h2, .client-dark-mode .ext-related-articles-card-list .ext-related-articles-card-extract {
    color: white;
}
.client-dark-mode .ext-related-articles-card-list h3 a {
    color: #efbf04;
}
.client-dark-mode .ext-related-articles-card-list h3:after {
    background-image: linear-gradient(to right,rgba(255,255,255,0),#222222 50%);
}
.client-dark-mode .ext-related-articles-card-list .ext-related-articles-card {
    background: #222222;
}
.client-dark-mode .ext-related-articles-card-list .ext-related-articles-card-thumb {
    background-color: gray;
}
.client-dark-mode ul.ext-related-articles-card-list {
    list-style-image: none;
}
.client-dark-mode .ext-related-articles-card-list .ext-related-articles-card-thumb-placeholder {
    filter: invert(1);
}
.client-dark-mode .ext-related-articles-card-list .ext-related-articles-card-thumb {
    filter: invert(0);
}

/**********************************************************
 * PageNotice Extension Footer Fixes for Packed Galleries * 
 **********************************************************/
#bottom-notice-ns ul.mw-gallery-packed, 
#bottom-notice-ns ul.mw-gallery-packed-overlay, 
#bottom-notice-ns ul.mw-gallery-packed-hover {
    text-align: center;
}

#bottom-notice-ns ul.gallery {
    margin: 2px;
    padding: 2px;
    display: block;
}

#bottom-notice-ns li.gallerybox {
    vertical-align: top;
    display: inline-block;
}

#bottom-notice-ns li.gallerybox div.thumb {
    text-align: center;
    margin: 2px;
}

#bottom-notice-ns ul.mw-gallery-packed li.gallerybox div.thumb, 
#bottom-notice-ns ul.mw-gallery-packed-overlay li.gallerybox div.thumb, 
#bottom-notice-ns ul.mw-gallery-packed-hover li.gallerybox div.thumb {
    background-color: transparent;
    border: 0;
}

/* 
 *  Dark Theme Fixes
 */
.client-dark-mode .oo-ui-windowManager-modal > .oo-ui-dialog {
    background-color: rgba(0,0,0,0.5);
}

.client-dark-mode .oo-ui-windowManager-modal.oo-ui-windowManager-floating > .oo-ui-dialog > .oo-ui-window-frame {
  border: 1px solid #222222;
}

.client-dark-mode .oo-ui-windowManager-modal > .oo-ui-dialog > .oo-ui-window-frame {
  background-color: #202122;
}

.client-dark-mode .oo-ui-processDialog-content .oo-ui-window-head, .client-dark-mode .oo-ui-processDialog-content .oo-ui-window-foot {
  outline: 1px solid #222222;
}

.client-dark-mode .ui-autocomplete .ui-menu-item .ui-corner-all {
  color: black;
}

.leaflet-container {
  background: black !important;
}

@font-face {
  font-family: Tico;
  src: url('fonts/Tico/font.woff') format('woff'),
       url('fonts/Tico/font.woff2') format('woff2');
}

.client-dark-mode .mw-message-box-success {
  background-color: seagreen;
}

ul.gallery.mw-gallery-slideshow {
    display: block;
    margin: 0;
}

.client-dark-mode .CategoryTreeToggle, .client-dark-mode .vector-toc-collapse-button, .client-dark-mode .vector-toc-uncollapse-button {
  color: #efbf04;
}

.client-dark-mode .mw-article-toolbar-container {
  border-bottom: 1px solid #222;
}

@supports (clip-path:polygon(1px 1px)) .client-dark-mode .mwe-popups .mwe-popups-container {
    background: #222;
}

.client-dark-mode .mwe-popups {
    background: #222;
}

.client-dark-mode .editOptions {
    background-color: #222222f7;
    border: 2px solid #222;
    border-bottom: 2px solid #222;
}

.client-dark-mode #mw-page-base, 
.client-dark-mode .cdx-menu-item--enabled:hover, 
.client-dark-mode .cdx-menu-item--enabled .cdx-menu-item--hightlighted {
  background-color: #121212;
  background-image: none;
}

.client-dark-mode .mw-message-box-warning, 
.client-dark-mode .mw-message-box-error {
  background-color: darkred;
}

.client-dark-mode .mw-content-ltr .redirectText li:first-child {
    background-image: linear-gradient(transparent,transparent),url(https://medievil.wiki/images/redirect-ltr-white.svg?ff441);
}

.client-dark-mode .sidebar-toc, .client-dark-mode #mw-searchoptions {
  background-color: #121212;
  border: 1px solid #222;
}

.client-dark-mode .qc-cmp2-persistent-link,
.client-dark-mode .oo-ui-menuOptionWidget.oo-ui-optionWidget-selected.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted, 
.client-dark-mode .oo-ui-menuOptionWidget.oo-ui-optionWidget-pressed.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted,
.client-dark-mode .sidebar-toc .sidebar-toc-title, 
.client-dark-mode .oo-ui-menuOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget,
.client-dark-mode .cdx-menu-item--enabled, 
.client-dark-mode .cdx-menu-item--enabled .cdx-menu-item__content {
  color: white;
}

.client-dark-mode .oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted, 
.client-dark-mode .oo-ui-menuOptionWidget.oo-ui-optionWidget-selected {
  background-color: #663399;
}

.client-dark-mode .leaflet-popup-content,
.client-dark-mode .leaflet-popup-content .mw-parser-output p,
.client-dark-mode .oo-ui-checkboxMultioptionWidget .oo-ui-checkboxInputWidget,
.client-dark-mode .oo-ui-checkboxMultioptionWidget.oo-ui-labelElement > .oo-ui-labelElement-label {
  color: black;
}

.client-dark-mode .cdx-text-input__input:enabled {
  background-color: black;
  color: white;
}

.client-dark-mode .cdx-menu {
  background-color: black;
  filter: invert(1);
  border: 1px solid #222;
}

.client-dark-mode .cdx-thumbnail__placeholder, .client-dark-mode .cdx-thumbnail__image {
  border: 1px solid #222;
}

.client-dark-mode .cdx-typeahead-search__search-footer {
  border: 2px solid #222;
}

@media screen and (min-width: 1000px) {
    .client-dark-mode .vector-toc-not-collapsed .sidebar-toc:after {
       background: linear-gradient(rgba(255,255,255,0),#121212);
    }
}

.embedvideo.ev_right, embedvideo.ev_left {
  padding: 5px;
}

.client-dark-mode .embedvideo-loader:hover .embedvideo-loader__fakeButton, 
.client-dark-mode .embedvideo-privacyNotice__continue {
  background-color: #4a1d78;
}

.client-dark-mode .embedvideo-privacyNotice__continue:hover {
  background-color: #663399;
}

.mw-footer-container {
  padding-top: 0px !important;
}

.mwe-popups .mwe-popups-settings-icon, .references .reference-text .refpreviewonly {
  display: none;
}

.mwe-popups.mwe-popups-is-not-tall .mwe-popups-extract {
  margin-bottom: 20px !important;
}

.mwe-popups.mwe-popups-is-tall .mwe-popups-discreet .mwe-popups-thumbnail {
  height: 220px !important;
}

.mwe-popups.flipped-x.mwe-popups-is-tall, .mwe-popups.flipped-x-y.mwe-popups-is-tall {
    min-height: 210px !important;
}

cite {
  font-style: normal;
}

@media screen and (max-width: 910px) {
    .main-page-box {
        width: -webkit-fill-available;
    }
}

.client-dark-mode .main-page-box {
    border: 1px solid #222222;
    background-color: #121212;
}

.gallowmere-bg {
  position: relative;
  z-index: 1;
  background-position: inherit;
}

.gallowmere-bg::before {
  content: "";
  position: absolute;
  top: 0; 
  left: 0;
  width: 100%; 
  height: 100%;  
  opacity: .2; 
  z-index: -1;
  background-color: black;
  background-image: url("https://medievil.wiki/images/e/ea/MediEvil1998-MapOfGallowmere.png");
  background-repeat: no-repeat;
  background-position: inherit;
}

.graveyard-bg {
  background-image: url("/images/b/b0/MediEvilRollingDemo-GraveyardDansCrypt.png");
}

.church-bg {
  background-image: url("images/3/3f/MediEvilRollingDemo-ChurchDemonRoom.png");
}

.scarecrow-bg {
  background-image: url("/images/c/c2/MediEvilRollingDemo-ScarecrowFieldsHouse.png");
}

.ant-bg {
  background-image: url("/images/a/a2/MediEvilRollingDemo-AntCavesTunnel.png");
}

.pumpkin-bg {
  background-image: url("/images/d/dd/MediEvilRollingDemo-PumpkinGorgeStart.png");
}

.village-bg {
  background-image: url("/images/c/cd/MediEvilRollingDemo-SleepingVillageStart.png");
}

.pools-bg {
  background-image: url("/images/0/07/MediEvilRollingDemo-PoolsBattlefield.png");
}

.resurrection {
    padding: 10px 0;
    font-size: 90%;
    color: orangered !important;
    border-top: 1px dashed orangered;
    border-bottom: 1px dashed orangered;
}

.mw-logo {
  color: black;
  font-family: Tico;
  text-transform: uppercase;
}

.mw-logo a:visited {
  color: black;
}

.mw-logo-container:after {
  content: "Gallowpedia";
  font-weight: normal;
}

.client-dark-mode .mw-logo-container {
  color: white;
}

.mobileonly {
  display: none;
}

.mw-sidebar-action-link {
  display: none;
}

pre {
    width: fit-content;
}

/* Default skin for navigation boxes */

.plainlinks.hlist.navbar.mini {
    float: left;
}


@media screen and (max-width: 910px) {
    .smart-clear {
        clear: both;
    }
}

@media screen and (max-width: 580px) {
    .locationcontainer {
        display: flex;
        justify-content: center;
        clear: both;
    }
    
    .location {
        float: none !important;
        width: 350px !important;
    }

    .wikipediainfo {
        float: none !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 4px 0 !important;
    }

    .infobox, .fright {
        margin-left: 0px !important;
        float: none !important;
        width: 100%;
    }

    .embedvideo.ev_right, embedvideo.ev_left {
        float: none !important;
    }
}

.filelisting {
    border: none !important; 
    background: none !important; 
    white-space: pre; 
    width: auto; 
    overflow: auto;
}

.pagination td:not(:has(.mw-selflink)) {
    display: inline-block;
    float: left;
    margin-bottom: 4px;
}

.pagination td {
    -webkit-transition: all 0.1s linear 0s;
    -moz-transition: all 0.1s linear 0s;
    -ms-transition: all 0.1s linear 0s;
    -o-transition: all 0.1s linear 0s;
}

.pagination td:has(.mw-selflink) {
    border-radius: 3px 3px 0 0;
    float: left;
}

.pagination a.mw-selflink {
    color: #fff;
}

.pagination a.mw-selflink:hover {
    text-decoration: none;
}

.pagination a {
    text-wrap: nowrap;
}

.client-dark-mode .pagination table {
    border-bottom: 4px solid #663399;
}

.client-dark-mode .pagination td {
    background-color: #3b3b3b;
}

.client-dark-mode .pagination td:has(.mw-selflink) {
    background-color: #663399;
    border-bottom: 4px solid #663399;
}

.client-dark-mode .pagination a.mw-selflink {
    color: #fff;
}

.client-dark-mode .pagination a {
    color: #fff;
}

.client-dark-mode .invert, .client-dark-mode .mw-checkbox-toggle-controls, .client-dark-mode .cdx-icon .cdx-text-input__icon .cdx-text-input__start-icon {
    filter: invert(1);
}

.navbox-subgroup .navbox-title {
    background: #ddddff;     /* Level 2 color */
}
.navbox-subgroup .navbox-group, .navbox-subgroup .navbox-abovebelow {
    background: #e6e6ff;     /* Level 3 color */
}
.navbox-even {
    background: #f7f7f7;     /* Even row striping */
}

.client-dark-mode .navbox-title,
.client-dark-mode .table.navbox th,
.client-dark-mode .navbox-abovebelow,
.client-dark-mode .navbox-group,
.client-dark-mode .navbox-subgroup .navbox-title {
    background: #663399;
}

.client-dark-mode .navbox-group a,
.client-dark-mode .navbox-group a:visited,
.client-dark-mode .navbox-abovebelow a,
.client-dark-mode .navbox-abovebelow a:visited,
.client-dark-mode .navbox-title a,
.client-dark-mode .navbox-title a:visited {
    color: white;
}

.client-dark-mode .navbox-group a.new,
.client-dark-mode .navbox-abovebelow a.new,
.client-dark-mode .navbox-title a.new {
    color: #ff6e6e;
}

.client-dark-mode .navbox-subgroup .navbox-group, 
.client-dark-mode .navbox-subgroup .navbox-abovebelow {
    background: #4a1d78;     /* Level 3 color */
}
.client-dark-mode .navbox-even {
    background: #222;     /* Even row striping */
}
    Retrieved from "https://medievil.wiki/index.php?title=MediaWiki:Common.css&oldid=38406"