MediaWiki:Common.css

/* import font */ @import url('https://fonts.googleapis.com/css2?family=Crimson+Pro:ital@0');

.page-header { margin-bottom: 5px; }

.page-header__title { font-family:'Crimson Pro'; font-size: 30pt; }

.page-content h2, .pi-header { font-family:'Crimson Pro'; font-size: 22pt; }

.page-header__categories-links { padding-bottom:0px !important; vertical-align:baseline; }

/* article page transparency */ /** dark mode **/ .theme-fandomdesktop-dark .page__main { background-color: rgba(var(--theme-page-background-color--rgb),0.9); }

/** light mode **/ .theme-fandomdesktop-light .page__main { background-color: rgba(var(--theme-page-background-color--rgb),0.8); }

/** header gradient **/ .resizable-container::before { background-image: linear-gradient(to bottom, rgba(var(--theme-body-background-color--rgb), 0.3) 50%, rgba(var(--theme-body-background-color--rgb), 0) 100% ); content: ""; display: block; height: 300px; position: absolute; top: 0; left: 0; width: 100%; z-index: -1; }

/* main page templates */

/* Removing title on main page */ .mainpage .page-header__title, .mainpage .page-header__separator { display: none; }

.mainpage-box, .mainpage-box-about { padding:20px; }

.floralborder img { height: auto; width: 75%; text-align:center; } .theme-fandomdesktop-light .floralborder img { content:url('https://static.wikia.nocookie.net/eldenring/images/b/bc/ER_border_leaf.png/revision/20220223194242'); }

/* add spacing between each box except the about one */ .mainpage-box +.mainpage-box { padding-top: 25px; }

.mainpage-box-about { background-color:rgba(54, 77, 75, 0.5); }

/* fix link color for light mode in about box on mainpage */ .theme-fandomdesktop-light .mainpage-box-about a { color:#f4d8a0; }

.mainpage-box .description { width:99%; text-align:left; padding:10px; line-height:150%; margin: 0 auto; font-size:14px; }

/** add a blur behind the logo for light mode readability **/ .theme-fandomdesktop-light .mp-logo { -webkit-filter: drop-shadow(0px 0px 10px #555); filter: drop-shadow(0px 0px 3.5px #555) drop-shadow(1px 1px 1px #555); }

/** Headers, in general **/ .mainpage-header { text-align:left; font-size:36px; text-transform:uppercase; font-family: 'Crimson Pro'; letter-spacing:1px; margin:0 auto 20px auto; line-height:100%; } /* Right column headers should typically be   smaller than right */ .right .mainpage-header { font-size:22px; } .vid1 { margin:0 auto; width:670px; color:#e9d8a5; font-weight:bold; } .theme-fandomdesktop-dark .mainpage-header { color:#e9d8a5; /* light color taken from ER logo itself; #EAC072 was old value */ }

.theme-fandomdesktop-light .mainpage-header { color:#516f4d; }

.mainpage-box-about .about-header { font-weight:bold; text-transform:none; font-size:22px; text-align:left; font-family:"Crimson Pro"; letter-spacing:1px; text-transform:uppercase; color:#e9d8a5; }

/* gallery center description text */ .wikia-gallery-item { text-align: center; }

/*** infoboxes ***/ .portable-infobox { border: 2px solid #4d4535; background-color: #14130e; font-family: 'Crimson Pro'; /* to set headers and title font */ }

/* light mode bg color */ .theme-fandomdesktop-light .portable-infobox { background-color: #efeadf; }

.pi-data-label, .pi-data-value { font-family: rubik !important; /* to set smaller label and value text to a readable font */ color: #e6e6e6; }

/* light mode text color */ .theme-fandomdesktop-light .pi-data-label, .theme-fandomdesktop-light .pi-data-value { color: #333; }

.portable-infobox h2 { background-color: #4d4535; }

.pi-title { font-size: 16pt !important; }

/* set headers and panel headers font size */ .pi-header, .portable-infobox .wds-tabs__tab-label { font-size: 14pt !important; }

/* removes the border between data values */ .pi-data { border: none; }

/* remove smart group borders */ .pi-smart-data-label, .pi-smart-data-value, .pi-border-color section { border-style: none !important; }

/*** end of infobox code ***/

/* banner code for notices */ div.banner { background-color: var(--theme-sticky-nav-background-color); border: 1px solid #4d4535; padding: 10px; margin-bottom: 10px; text-align: center; }

/* light mode color for banner */ .theme-fandomdesktop-light div.banner { background-color: var(--theme-border-color); }

/* fixing margins so not so many large gaps */ .page-content p { margin-bottom: 6px; }

.page-content ul { margin-bottom: 6px; }

.page-content ol { margin-bottom:6px; }

/*** Table code ***/ .wikitable { background-color: rgba(255, 255, 255, 0.05) !important; }

.wikitable td, .wikitable th { border: 1px solid #111 !important; }

.theme-fandomdesktop-light .wikitable td, theme-fandomdesktop-light .wikitable th { border: 1px solid #555 !important; }

/* for smaller column headers */ .smaller-headers thead th { font-size: smaller; }

/* for left aligning the first column when it is marked as a th. 'l' for left */ .l1 tbody tr th:first-child { text-align: left; }

/* for center aligning particular table columns. 'c' for center */ .c1 tbody tr td:nth-child(1), .c2 tbody tr td:nth-child(2), .c3 tbody tr td:nth-child(3), .c4 tbody tr td:nth-child(4), .c5 tbody tr td:nth-child(5), .c6 tbody tr td:nth-child(6), .c7 tbody tr td:nth-child(7), .c8 tbody tr td:nth-child(8), .c9 tbody tr td:nth-child(9), .c10 tbody tr td:nth-child(10) { text-align: center; }

/* removes the invisible tfoot html off tables so no extra space at bottom of tables */ .wikitable tfoot, .article-table tfoot { display:none; }

/* in case a table footer needs to be displayed */ .tfoot tfoot { display: table-footer-group; }

.wikitable { margin:auto; border:1px #333 solid !important; border-collapse:separate; border-spacing:1px; color:#e5e5e5; }

/* header */ .wikitable th { background: var(--theme-sticky-nav-background-color) !important; }

/* set th link color so readable in both dark and light mode */ .wikitable th a:not(a.new) { color:#ccba72; }

/* alternating rows */ .wikitable tr:nth-child(odd) { background-color: rgba(255, 255, 255, 0.15); }

.wikitable tr:nth-child(even) { background-color: rgba(255, 255, 255, 0.05); } /* FandomDesktop light mode alternating rows */ .theme-fandomdesktop-light .wikitable tr:nth-child(odd) { background-color:rgba(0,0,0,0.25); }

.theme-fandomdesktop-light .wikitable tr:nth-child(even) { background-color:rgba(0,0,0,0.10); }

/* light mode fix for headers text color */ .theme-fandomdesktop-light .wikitable th { color: #e6e6e6; }

/******************* * Navboxes *******************/ /* .navbox { --navbox-bg-color:var(--theme-page-background-color); --navbox-text-color:var(--theme-page-text-color); --navbox-title-color:var(--theme-sticky-nav-background-color); --navbox-header-color:rgba(100, 100, 100 ,.5); --navbox-alt-color:rgba(85,85,85,0.2); --navbox-border-color:var(--theme-border-color); } .navbox { width: 100%; background: var(--navbox-bg-color); color: var(--navbox-text-color); margin: 1em auto; font-size: 84%; clear: both; padding: 2px; border-spacing: 0; border: 1px solid var(--navbox-border-color); }
 * CSS Vars
 * Note: The linter will throw an error. See this page for more info.

/* Merges navboxes that are directly under eachother */ .navbox + .navbox { margin-top: -11px; }

.navbox .navbox-title { background: var(--navbox-title-color); color:var(--theme-sticky-nav-text-color); font-weight: bold; }

/* light mode link change to still be readable */ .theme-fandomdesktop-light .navbox-title a { color: #ccba72; }

.navbox .navbox-vde { float:left; width:65px; }

.navbox .navbox-title-padright { padding-right: 65px; }

.navbox .navbox-title-padleft { padding-left: 65px; }

.navbox .navbox-subgroup { border-spacing: 0; width: 100%; }

.navbox .navbox-gutter { height: 2px; }

.navbox .navbox-subgroup .navbox-gutter { background: var(--navbox-bg-color); }

.navbox .navbox-section-row > td { padding: 0; height: 100%; }

.navbox .navbox-section { width: 100%; border-spacing: 0; }

.navbox .navbox-above, .navbox .navbox-below { background: var(--navbox-header-color); text-align: center; }

.navbox .navbox-image { background: var(--navbox-bg-color); text-align: center; }

.navbox .navbox-group, .navbox .navbox-header { background: var(--navbox-header-color); color: var(--navbox-text-color); font-weight: bold; height: 100%; padding: 2px 4px; }

.navbox .navbox-header-collapsible { padding-left: 65px; }

.navbox .navbox-group { text-align: right; padding-right: 1em; min-width: 150px; }

.navbox .navbox-group, .navbox .navbox-image-left { border-right: 2px solid var(--navbox-bg-color); }

.navbox-image-right { border-left: 2px solid var(--navbox-bg-color); }

.navbox .navbox-list { background: var(--navbox-bg-color); color: var(--navbox-text-color); width: 100%; height: 100%; padding: 0; }

.navbox .alt > .navbox-list { background: var(--navbox-alt-color); }

.navbox .navbox-list div { padding: 0px 4px; }

.navbox .navbox-list.no-group { text-align: center; padding-top: 2px; padding-bottom: 2px; }

.navbox .mw-collapsible-toggle { width: 65px; }

/* hlist */ .hlist ul { margin: 0; list-style: none; }

.hlist li, .hlist ul ul { display: inline; }

.hlist li a { white-space: nowrap; }

.hlist ul ul:before { content: "(" }

.hlist ul ul:after { content: ")" }

.hlist li:after { content: " • "; }

.hlist ul ul li:after { content: "/"; }

.hlist li:last-child:after, .hlist ul ul li:last-child:after { content: none; }

/* fixing indentation breaks so html code isn't messy */ .page-content dd { margin-bottom: 12px !important; }