MediaWiki:Common.css

@import "/load.php?mode=articles&articles=u:wingsoffire:MediaWiki:ModStuff.css&only=styles";

@import "https://fonts.googleapis.com/css?family=Anton|Vollkorn|Lato|Quicksand|Josefin+Sans|Oswald|Raleway|Ubuntu|Parisienne|Poiret One|Rock Salt:100,200,400,700,800,900|Droid+Serif|Droid+Sans|Merriweather:400,400italic,700,700italic,900,300,300italic|Gentium+Basic|Roboto+Slab:400,100,300,700&subset=latin,latin-ext"; /* Mikadan Font */ @font-face { font-family:"Mikadan"; src:url("http://dragonagerp.b1.jcink.com/uploads/dragonagerp/Fonts/mikadan.eot") format("eot"),url("http://dragonagerp.b1.jcink.com/uploads/dragonagerp/Fonts/mikadan.woff") format("woff"),url("http://dragonagerp.b1.jcink.com/uploads/dragonagerp/Fonts/mikadan.ttf") format("truetype"),url("http://dragonagerp.b1.jcink.com/uploads/dragonagerp/Fonts/mikadan.svg") format("svg");font-weight:normal;font-style:normal;}

/* Albertus Font */ @font-face{ font-family:"Albertus"; src:url("https://files.jcink.net/uploads/wingoffirewiki/Albertus_Medium_Regular_font.ttf") format("truetype");font-weight:normal;font-style:normal;}

/* Apollo Font */ @font-face{ font-family:"Apollo"; src:url("http://cssforwof.b1.jcink.com/uploads/cssforwof/ApolloMTStd.otf") format("truetype");font-weight:normal;font-style:normal;}

/* SF Wonder Comic Font */ @font-face { font-family:"Wondercomic"; src:url("http://cssforwof.b1.jcink.com/uploads/cssforwof/SF_Wonder_Comic.ttf") format("truetype");font-weight:normal;font-style:normal;}

/** TABLE OF CONTENTS * CSS & Font Imports (+Colored Usernames, Custom Modicons) * Hidden Pfps * Background Changes * Custom User Tags * Font Changes * Rail Changes / Module Styles "Module Mastery" * MyTools Toolbar and Configuration * Infoboxes * Other / Miscellanous **/ /* CSS & FONT IMPORTS ===================  import and font-face should stay at the top of the page username colors and modicons can be edited at MediaWiki:ModStuff.css =================== */

/*-- Background Changes --*/ /*making fullscreen bg image fit all screens*/ .fandom-community-header__background.fullScreen { background: var(--theme-body-background-image) top center; background-attachment: fixed; background-size: cover; }

/* Header shadows */ .fandom-community-header__image, .fandom-community-header__community-name-wrapper, .fandom-community-header__local-navigation .wds-tabs__tab-label, .page-counter, .fandom-community-header .wds-icon-small, .wiki-tools .wds-button.wds-is-secondary { filter: drop-shadow(0 0 6px var(--theme-body-background-color)); } /*sticky logo*/ .fandom-sticky-header__logo img { content: url(https://static.wikia.nocookie.net/wof-experimental/images/5/5d/Site-favicon/revision/latest); }

/* Page Border */ .page, border-style: solid; border-width: .8px; border-radius: 3px 3px 3px 3px; } /* light */ .theme-fandomdesktop-light .page, .theme-fandomdesktop-light #mixed-content-footer { border-color: rgb(var(--theme-accent-color--rgb),0.55); box-shadow: 0 0 20px rgb(var(--theme-accent-color--rgb),0.8); } /* dark */ .theme-fandomdesktop-dark .page, .theme-fandomdesktop-dark #mixed-content-footer { border-color: rgb(var(--theme-accent-color--rgb),0.55); box-shadow: 0 0 20px rgb(var(--theme-accent-color--rgb),0.8); }
 * 1) mixed-content-footer {

/* Page transparency */ .page { opacity: 0.98; }

/*-- Custom User Tags --*/ .user-identity-header__tag { color: inherit; } .user-identity-header__tag { box-shadow: inset 0 1px rgba(255,255,255,0.2), inset 0 10px rgba(255,255,255,0.1), inset 0 10px 20px rgba(255,255,255,0.13), inset 0 -15px 30px rgba(0,0,0,0.2); color: #FFF !important; text-shadow: 1px 1px 3px #666; font-family: Helvetica Neue,Helvetica,Arial,sans-serif; letter-spacing: 0.6px; }  background: linear-gradient(67deg,#cc3333,#cc9733,#cccc33,#33cc34,#3334cc,#8d33cc); }
 * 1) userProfileApp .user-identity-header__tag--founder,
 * 2) userProfileApp .user-identity-header__tag--cofounder {

background: #ff9721 !important; }  background: #ff5751; }  background: #7d77ee; }  background: #b87bf2; }  background: #d849c6; }  background: #2b94ff; }  background: hsl(30,0%,55%); }  background: hsl(0,0%,15%); }   background: hsl(0,0%,30%); }
 * 1) userProfileApp .user-identity-header__tag--bureaucrat {
 * 1) userProfileApp .user-identity-header__tag--sysop {
 * 1) userProfileApp .user-identity-header__tag--chat-moderator {
 * 1) userProfileApp .user-identity-header__tag--thread-moderator {
 * 1) userProfileApp .user-identity-header__tag--content-moderator {
 * 1) userProfileApp .user-identity-header__tag--rollback {
 * 1) userProfileApp .user-identity-header__tag--inactive {
 * 1) userProfileApp .user-identity-header__tag--blocked {
 * 1) userProfileApp .user-identity-header__tag--bannedfromchat-user {

/*-- Font Changes --*/

/*-- Rail Changes --*/ /*light*/ .theme-fandomdesktop-light .page__right-rail { background: linear-gradient(180deg, var(--theme-page-background-color--secondary),var(--theme-page-background-color)), var(--theme-page-background-color); } /*dark*/ .theme-fandomdesktop-dark .page__right-rail { background: linear-gradient(180deg, var(--theme-page-background-color--secondary),var(--theme-page-background-color)), var(--theme-page-background-color); } /*inner rail borders*/ .rail-module, border-bottom: 1px solid rgb(var(--theme-page-text-color--rgb),0.35); } /*makes ugly squares transparent*/ .rail-module, .admin-dashboard__module { background-color: transparent; }
 * 1) FounderProgressWidget>h2, #WikiFeaturesWidget>h2 {

/* Colors the Discord button a blurple-ish color (blurple: #7289DA) */ .DiscordChat .wds-button { visibility: hidden; } .WikiaRail .rail-module .wds-button.wds-is-secondary::before { filter: drop-shadow(0 0 3px var(--theme-page-background-color)); } /* Replace Discord Chat text title */ .rail-module.DiscordChat > h2 { font-size: 0; } .rail-module.DiscordChat > h2::after { content: 'Discord'; font-size: 16px; } /* Build our own DiscordModule "Join" button */ .WikiaRail .rail-module .wds-button.wds-is-secondary::before { content: 'Join the Discord!';

visibility: visible; position: absolute; display: flex; justify-content: center; padding: 7px 18px; border: 1px solid rgba(var(--theme-page-text-color--rgb),0.2); background-color: #7289DA; width: 125px; border-radius: 3px; transition-duration: .3s; } .WikiaRail .rail-module .wds-button.wds-is-secondary:hover::before { background-color: #7289DA99; border: 1px solid rgba(var(--theme-page-text-color--rgb),0.05); } /* Hide the icons of online users */ .DiscordChat .avatars { display: none; } .DiscordChat .chat-details { display: flex; justify-content: center; } /* Make the rail into a flex container */ display: flex; flex-direction: column; } /* Set a default order all rail modules */ /* Put the chat and discord modules above other rail modules */ /* and, well, really this makes discord stay under LiveChat while keeping everything in order */
 * 1) WikiaRail .DiscordChat .chat-details .avatars,
 * 1) WikiaRail {
 * 1) WikiaRail > * { order: 2; }
 * 1) WikiaRail .content-review-module { order: 0; }
 * 2) WikiaRail .activity-module { order: 0; }
 * 3) WikiaRail .DiscordChat { order: 1; }

/*-- MyTools Toolbar and Configuration --*/ .WikiaBarWrapper, .theme-fandomdesktop-dark .WikiaBarWrapper, .theme-fandomdesktop-light .WikiaBarWrapper { background-image: url(https://static.wikia.nocookie.net/wings-of-fire-experimental/images/e/e0/DragonBorder_white_flow-right_15-opacity.png/revision/latest?cb=20210712164927), linear-gradient(90deg,#FFFFFF40,#00000000,#FFFFFF40); background-size: auto 100%; } /*.WikiaBarWrapper .toolbar,.WikiaBarWrapper .toolbar .tools > li > a { color: white; }*/

/*-- Infoboxes --*/ .portable-infobox { margin: 5px; padding: 4px; border: 1px solid var(--theme-border-color); border-radius: 5px; }

.pi-europa .pi-title { border-radius: 5px 5px 0 0; }

.pi-europa .pi-image { margin: 3px 0; }

.pi-europa .pi-image-thumbnail { width: 95%; height: auto; }

.pi-europa .pi-group .pi-data { margin: 0 3px 3px; width: unset; }

.pi-europa .pi-collapse { margin: 3px 0; }

.pi-europa .pi-collapse .pi-header { line-height: 1; font-size: 0.8rem; }

.pi-europa .pi-collapse.pi-collapse-closed .pi-header:first-child::after { margin-top: -7px; }

.pi-europa .pi-tab-link, .pi-europa .pi-data.pi-item-spacing { padding: 6px 14px; }

.pi-europa .pi-data { background-color: var(--theme-article-background-color--secondary); }

/* The last collapsed header and the last infobox row inside the last header */ .pi-europa .pi-collapse-closed:last-of-type .pi-header, .pi-europa .pi-collapse:last-of-type .pi-data:last-of-type { border-radius: 0 0 5px 5px; }

.pi-europa .pi-section-tab { margin: 0; }

/*-- Galleries --*/ ul.mw-gallery-traditional li.gallerybox .thumb { border: 0; background-color: transparent; }

ul.mw-gallery-gn .li.gallerybox .thumb{ border: 5px solid red; }

/*-- Other / Miscellanous --*/

/* every instance of our avatar  */ .page .avatar, .page .wds-avatar__image { border: 1px solid !important; /*box-shadow: 1px 1px 7px #111;*/ }

/* Special:Community header */ .community-page-header { background-color: var(--theme-sticky-nav-background-color); } .community-page-header .community-page-header-welcome-message, .community-page-header .community-page-subheader-welcome-message { color: var(--theme-sticky-nav-text-color); } .community-page-header:before { background-image: -webkit-gradient(linear,left top,left bottom,color-stop(25%,transparent),color-stop(rgba(0,0,0,0)),to(rgba(var(--theme-page-background-color--rgb),.6))); background-image: linear-gradient(180deg,transparent 25%,rgba(0,0,0,0),rgba(var(--theme-page-background-color--rgb),.6)); }

/* Custom Scrollbar */ /* * Created by Anonminati (https: //wikisource.wikia.com);*/ .theme-fandomdesktop-light::-webkit-scrollbar-track, .theme-fandomdesktop-dark::-webkit-scrollbar-track,
 * -webkit-scrollbar-track {

-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); background-color: var(--theme-page-background-color--secondary); background-size: cover; border-radius: 10px; } .theme-fandomdesktop-light::-webkit-scrollbar, .theme-fandomdesktop-dark::-webkit-scrollbar,
 * -webkit-scrollbar {

background-color: var(--theme-body-background-color); width: 15px; } .theme-fandomdesktop-light::-webkit-scrollbar-thumb, .theme-fandomdesktop-dark::-webkit-scrollbar-thumb,
 * -webkit-scrollbar-thumb {

background-color: #fff; background: linear-gradient(155deg,var(--theme-accent-color),rgb(var(--theme-accent-color--rgb),.5)); border-radius: 10px; background-size: cover; }

/* Frontpage Discussions Widget */ display: none; }   display: flex; flex-direction: column; border: 1px solid var(--theme-border-color); border-radius: 3px; height: 300px; text-align: center; }   margin: 0; }   background-color: var(--theme-page-background-color--secondary) }   justify-content: center; }
 * 1) discussions-activity-embed .mcf-card-discussions__header,
 * 2) discussions-activity-embed .mcf-card-discussions__in {
 * 1) discussions-activity-embed {
 * 1) discussions-activity-embed .mcf-card-discussions__list {
 * 1) discussions-activity-embed .mcf-card-discussions__list,
 * 2) discussions-activity-embed .mcf-card-discussions__list:after,
 * 3) discussions-activity-embed .mcf-card-discussions__list:before{
 * 1) discussions-activity-embed .mcf-card-discussions__user-info,
 * 2) discussions-activity-embed .mcf-card-discussions__meta {

/* Message Walls, Article Comments, and Blog Posts */ /*formatted code in MWs and comments*/ .entity-content pre code { background-color: var(--theme-sticky-nav-background-color) !important; color: var(--theme-sticky-nav-text-color); } /*border color*/ .article-comments-app, .blog-listing__post { --themed-border-color-50: rgba(var(--theme-page-text-color--rgb),0.15); /*borders*/ } /*bg gradient*/ div[class^="Comment_wrapper"], .blog-listing__post { background: var(--theme-page-background-color--secondary); border-color: var(--themed-border-color-50); }   border-color: var(--themed-border-color-50); }   border-left-color: var(--themed-border-color-50); }   border-bottom-color: var(--themed-border-color-50); border-top-color: var(--themed-border-color-50); } span[class^="ReplyList_top-border"] { background-color: var(--themed-border-color-50); } /*making sure the load more button text is readable*/ button[class^="LoadMoreButton_load-more"] { color: var(--themed-text-color); }
 * 1) MessageWall, .EditorModal,
 * 1) MessageWall .Message__wrapper,
 * 1) MessageWall .Message__break {
 * 1) MessageWall .Reply {
 * 1) MessageWall .ViewMoreReplies {

/* making nested lists like Help:Rules readable for screenreaders */ .nested-list ol { list-style: none; counter-reset: nested; } .nested-list ol li { counter-increment: nested; } .nested-list ol li::before { content: counters(nested, ".") ". "; }

/*front page image grayscale & hover*/ .grayscale-linkbox { position: absolute; top: 0; left: 0; display: block; width: 138px; height: 339px; backdrop-filter: grayscale(1); transition: backdrop-filter 0.2s ease-in-out; } .grayscale-linkbox:hover { backdrop-filter: grayscale(0); }

/*-- Theme-matching Template Recolors --*/ /* MainHeading */ p.mainhead { background: var(--theme-sticky-nav-background-color) !important; color: var(--theme-sticky-nav-text-color) !important; } /* Simple Template */ .template-simple { background: var(--theme-page-background-color--secondary) !important; border: 2px solid var(--theme-sticky-nav-background-color) !important; } /* Dropdown/Navbox Template */ .template-dropdown { background-color: var(--theme-sticky-nav-background-color) !important; } .template-dropdown-sub { color: var(--theme-page-text-color) !important; background-color: var(--theme-page-background-color--secondary) !important; } /* References Template */ .template-references { background: var(--theme-page-background-color--secondary) !important; border: 1px solid var(--theme-border-color) !important; } /* Header Template */ .template-header { border: 1px solid var(--theme-border-color) !important; }

.family-tree { border-collapse: separate; }


 * root .theme-fandomdesktop-dark {

--theme-female-color: #E9837E; --theme-male-color: #6A8FBB; } .theme-fandomdesktop-dark .female { background: var(--theme-female-color); border: 2px solid var(--theme-border-color); border-radius: 5px; } .theme-fandomdesktop-dark .male { background: var(--theme-male-color); border: 2px solid var(--theme-border-color); border-radius: 5px; }

.theme-fandomdesktop-dark .lines { border-color: var(--theme-border-color); }