MediaWiki:Common.css

/* Imports */ /** dev.fandom.com extensions **/ @import url('/load.php?mode=articles&only=styles&articles=u:dev:MediaWiki:ContribsButtons.css|dev:MediaWiki:BalancedUCX.css'); /** Fonts **/ @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap'); @font-face { font-family: 'Montserrat', sans-serif; } /* End Imports */

/* Article Space & UI */ /** Applying font **/ .WikiaArticle, .WikiaArticleInterlang, .categoriesLink, .name > a, .license-description, .wikia-slideshow-image-caption, .WikiaArticle h1, h2, .thumbnails > li > a, #CategorySelectAdd, .description > p, .CommentList_empty-state__1pct4 > p, .FormEntryPoint_text__7JAhS, font, .activity-item > .page-title, .activity-item > .edit-info, .entity-content > p, .more, .EntityHeader_entity-header__3gtUI, .data-details, .badge-text > p, .tabbernav, figcaption, wikia-slideshow-image-caption { font-family: Montserrat !important; font-weight: 500; } /** End Applying Fonts **/ /** DiscordIntegrator customization copied and modified from wackidol wiki 2020-12-31 **/ .mediawiki .discord-widget .widget-header { background-color: #001225 !important; } .mediawiki .discord-widget .widget-member .widget-member-name { background-color: #e15467; color: #fff; } .mediawiki .discord-widget .widget-member-avatar img { border: 2px solid #e15467; /* There's sometimes a little space between the avatar and the border, so this property fills the gap */ background-color: #e15467; } .mediawiki .discord-widget .widget-body.body-loading::before { background-color: #001225; } .mediawiki .discord-widget .widget-body.body-loading::after { background-color: #001225; } /** End DiscordIntegrator **/ /** Portable Infobox - centering image caption **/ .portable-infobox .pi-caption { text-align: center; } /** End Portable Infobox **/ /** Tabber copied from Hello! Project Wiki **/ ul.tabbernav { font-weight:bold !important; padding:5px 0px !important; border: none !important; } ul.tabbernav li a { padding:5px 5px !important; margin-left:0px !important; border:0 !important; background: transparent !important; } ul.tabbernav li a:link { color: #000000  !important; border-bottom: 2px solid #037ec4 !important; margin-right: 2px !important; } ul.tabbernav li a:visited { color: #000000 !important; border-bottom: 2px solid #037ec4  !important; margin-right: 2px !important; } ul.tabbernav li a:hover { color: #037ec4 !important; text-decoration: none !important; background-color: transparent !important; border-bottom: 2px solid #000000 !important; margin-right: 2px !important; transition-duration: 1s !important; transition-timing-function: ease-out !important; } ul.tabbernav li.tabberactive a { color:#000000 !important; font-weight:bold !important; border-bottom: 2px solid #000000 !important; background-color: transparent !important; margin-right: 2px !important; } ul.tabbernav li.tabberactive a:hover { text-decoration: none !important; border-bottom: 2px solid #000000 !important; border-bottom: 2px solid #000000 !important; margin-right: 2px !important; } .tabberlive .tabbertab { border:0px solid transparent !important; border-top:0 !important; } /** Admin colors **/ /*** Text colors ***/ a[href$=":ElpisGalaxy"], a[href$="/ElpisGalaxy"] { color: #9370DB !important; font-weight: 600 !important;} a[href$=":Loa_Maria"], a[href$="/Loa_Maria"], a[href$=":Loa%20Maria"], a[href$="/Loa%20Maria"] { color: #f36196 !important; font-weight: 600 !important;} a[href$=":SeifukuGirls"], a[href$="/SeifukuGirls"] { color: #f36196 !important; font-weight: 600 !important;} a[href$=":Alexmingtung"], a[href$="/Alexmingtung"] { color: #f36196 !important; font-weight: 600 !important;} a[href$=":D4rkWzd"], a[href$="/D4rkWzd"] { color: #f36196 !important; font-weight: 600 !important;} /*** End Text colors ***/ /*** Profile frame colors ***/ .page-User_ElpisGalaxy div.user-identity-avatar img.user-identity-avatar__image, .page-Message_Wall_ElpisGalaxy div.user-identity-avatar img.user-identity-avatar__image, .page-User_blog_ElpisGalaxy div.user-identity-avatar img.user-identity-avatar__image, .page-Special_Contributions_ElpisGalaxy div.user-identity-avatar img.user-identity-avatar__image, .page-Special_UserProfileActivity_ElpisGalaxy div.user-identity-avatar img.user-identity-avatar__image, img.wds-avatar__image[alt='ElpisGalaxy'], div.EntityHeader_avatar__2TDnq[alt='ElpisGalaxy'] { border-color: #9370DB !important; } .page-User_Loa_Maria div.user-identity-avatar img.user-identity-avatar__image, .page-Message_Wall_Loa_Maria div.user-identity-avatar img.user-identity-avatar__image, .page-User_blog_Loa_Maria div.user-identity-avatar img.user-identity-avatar__image, .page-Special_Contributions_Loa_Maria div.user-identity-avatar img.user-identity-avatar__image, .page-Special_UserProfileActivity_Loa_Maria div.user-identity-avatar img.user-identity-avatar__image, img.wds-avatar__image[alt='Loa Maria'], div.EntityHeader_avatar__2TDnq[alt='Loa Maria'] { border-color: #f36196 !important; } .page-User_SeifukuGirls div.user-identity-avatar img.user-identity-avatar__image, .page-Message_Wall_SeifukuGirls div.user-identity-avatar img.user-identity-avatar__image, .page-User_blog_SeifukuGirls div.user-identity-avatar img.user-identity-avatar__image, .page-Special_Contributions_SeifukuGirls div.user-identity-avatar img.user-identity-avatar__image, .page-Special_UserProfileActivity_SeifukuGirls div.user-identity-avatar img.user-identity-avatar__image, img.wds-avatar__image[alt='SeifukuGirls'], div.EntityHeader_avatar__2TDnq[alt='SeifukuGirls'] { border-color: #f36196 !important; } .page-User_Alexmingtung div.user-identity-avatar img.user-identity-avatar__image, .page-Message_Wall_Alexmingtung div.user-identity-avatar img.user-identity-avatar__image, .page-User_blog_Alexmingtung div.user-identity-avatar img.user-identity-avatar__image, .page-Special_Contributions_Alexmingtung div.user-identity-avatar img.user-identity-avatar__image, .page-Special_UserProfileActivity_Alexmingtung div.user-identity-avatar img.user-identity-avatar__image, img.wds-avatar__image[alt='Alexmingtung'], div.EntityHeader_avatar__2TDnq[alt='Alexmingtung'] { border-color: #f36196 !important; } .page-User_D4rkWzd div.user-identity-avatar img.user-identity-avatar__image, .page-Message_Wall_D4rkWzd div.user-identity-avatar img.user-identity-avatar__image, .page-User_blog_D4rkWzd div.user-identity-avatar img.user-identity-avatar__image, .page-Special_Contributions_D4rkWzd div.user-identity-avatar img.user-identity-avatar__image, .page-Special_UserProfileActivity_D4rkWzd div.user-identity-avatar img.user-identity-avatar__image, img.wds-avatar__image[alt='D4rkWzd'], div.EntityHeader_avatar__2TDnq[alt='D4rkWzd'] { border-color: #f36196 !important; } /*** End Profile frame colors ***/ /** End Admin colors **/ /** Wiki Wordmark hover animations **/ .fandom-community-header__image img { opacity: 1; filter: alpha(opacity=100); transition: all 1.5s ease; } .fandom-community-header__image img:hover { opacity: 0.5; filter: alpha(opacity=50); -webkit-transform: rotateY(360deg); -moz-transform: rotateY(360deg); -o-transform: rotateY(360deg); -ms-transform: rotateY(360deg); transform: rotateY(360deg); } /** End Wiki Wordmark **/ /** Expand-Collapse button appearance **/ .mw-collapsible-toggle a { color: inherit !important; } .mw-collapsible-toggle { float:none !important; padding: 4px 6px; color: #037ec4; font-weight: bold; } /** End Expand-Collapse **/ /** Table Bug Fixes **/ .article-table tr td, .article-table tr th, .wikitable tr td, .wikitable tr th { text-align: inherit; padding: 0.2em 0.4em; } /** End Table Bug Fixes **/ /** Removing subpage navigation from all pages in the main namespace **/ /**this is to avoid wrong subpage links in double A-side single pages **/ .ns-0 .page-header__page-subtitle{ display:none; } /** End Subpage navigation **/ /** Maps background color **/ .interactive-maps__map { background-color: #b4dcfc !important; } /** End Maps **/ /** Deleted page warning red instead of orange **/ .warningbox { background-color: rgba(225,84,103,0.35); border-color: #e15467; } /** End Deleted warning **/ /* End Article Space & UI */

/* Front Page */ /** Better border for music footer **/ .main-page-tag-lcs > .lcs-container > .hidden > .mw-parser-output > div { margin: 0px !important; border-radius: 0px !important; box-shadow: none !important; border: 2px outset #e15467 !important; } /** End music footer **/ /** Enabling multiline caption in sliders **/ .fandom-slider__nav { height: 80px; bottom: -80px; } .fandom-slider__nav__caption > div { white-space: normal; } /** End Multiline slider **/ /** Headings **/ .heading-a { text-align: center; overflow: auto !important; padding: 10px !important; margin: 10px 0 10px 0 !important; border-width: 1px !important; font-family: Montserrat !important; font-weight: 500 !important; border-radius: 0px !important; } .heading-b { text-align: center; overflow: auto !important; padding: 1px !important; margin: 10px 0 5px 0 !important; border-width: 0.5px !important; font-family: Montserrat !important; font-weight: 500 !important; border-radius: 0px !important; } /** End Headings **/ /** Flexbox Grid **/ .flexGrid { display: flex; flex-wrap: wrap; justify-content: center; } .flexGrid > div { margin: 1px; } /** End Flexbox Grid **/ /** CSS Improvements for Template:Infocard **/ .infocard-image > a > img { position: absolute; transform: translate(-50%, -50%); height: 100%; object-fit: scale-down; } /** End Template:Infocard **/ /** Template:Birthdays **/ .main-page-birthdays dl { margin: 0 !important; } /** End Template:Birthdays **/ /** Recent Music Videos **/ .recent-videos-grid { justify-content: space-evenly; } /** End Recent Music Videos **/ /* End Front Page */

/* Utils */ /** Image Hover animations **/ .increase img { opacity: 1; filter: alpha(opacity=100); transition: all 0.6s ease; } .increase img:hover { opacity: 0.8; filter: alpha(opacity=80); transform:scaleX(1.05) scaleY(1.05); } .hoverimage img { -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; opacity: 1; filter: alpha(opacity=100); } .hoverimage img:hover { opacity: 0.5; filter: alpha(opacity=50); } .grayscalehover { -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; } .grayscalehover:hover { -webkit-filter: invert(100%); } .hoverspin img { opacity: 1; filter: alpha(opacity=100); transition: all 0.6s ease; } .hoverspin img:hover { opacity: 0.5; filter: alpha(opacity=50); -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } /** End Hover animations **/ /** Colors that change automatically based on dark/light theme **/ .dynamic-color-1 { color: var(--theme-body-dynamic-color-1); } .dynamic-color-2 { color: var(--theme-body-dynamic-color-2); } .dynamic-border-1 { border-color: var(--theme-body-dynamic-color-1) !important; } .dynamic-border-2 { border-color: var(--theme-body-dynamic-color-2) !important; } .accent-color { color: var(--theme-accent-color); } .accent-color-bg { background-color: var(--theme-accent-color); } .accent-color-border { border-color: var(--theme-accent-color); } /** End Auto Colors **/ /** Utility classes **/ .text-center { text-align: center; } .text-white { color: white; } .text-justify { padding: 0 20px; text-align:justify; text-align-last: center; text-justify: inter-character; } .text-padding { padding-left: 20px; padding-right: 20px; } /** End Utility classes **/ /* End Utils */