MediaWiki:Mobile.css: Difference between revisions
From Tardis Wiki, the free Doctor Who reference
No edit summary Tags: Mobile edit Mobile web edit |
No edit summary Tags: Mobile edit Mobile web edit |
||
Line 66: | Line 66: | ||
.citizen-page-container #localNotice { | .citizen-page-container #localNotice { | ||
margin-top: 38px; | |||
transition: var(--transition-menu); | transition: var(--transition-menu); | ||
transition-property: transform; | transition-property: transform; |
Revision as of 07:12, 21 February 2024
/* All CSS here will be loaded for users of the mobile site */
/* Imports: */
@import url("https://tardis.wiki/w/load.php?modules=ext.gadget.infoboxes&only=styles"); /* import infoboxes stylesheet */
@import url("https://tardis.wiki/w/load.php?modules=ext.gadget.modularStyles&only=styles"); /* import all other split-out stylesheet */
/* Variable definitions - used by imported stylsheets, taken from desktop */
:root.skin-citizen-dark {
--text-color: #ffffff;
--primary-1: #0e2348;
--primary-2: #0f2651;
--primary-3: #1a2e53;
--primary-4: #0a1b3c;
--primary-5: #2f4065;
--primary-6: #2c406b;
--accent-1: #c7b286;
--accent-2: #d5ac59;
--accent-3: #bfa773;
--accent-4: #e5c076;
--alt-text-color: #000000;
--contrast-color-1: #e6e6e6;
--contrast-color-1--rgb: 230,230,230;
}
:root.skin-citizen-light {
--text-color: #0e191a;
--primary-1: #fff4ef;
--primary-2: #90a2bf;
--primary-3: #4f6087;
--primary-4: #bec9da;
--accent-1: #556375;
--accent-2: #47639E;
--accent-3: #46619b;
--accent-4: #334671;
--alt-text-color: #ffffff;
--contrast-color-1: #e6e6e6;
--contrast-color-1--rgb: 230,230,230;
}
/* All CSS here will be loaded for users of the Citizen Mobile skin */
.skin-citizen-dark > body {
background: var(--primary-2);
color: var(--text-color);
}
.skin-citizen-light > body {
background: var(--primary-1);
color: var(--text-color);
}
.mw-parser-output p {
font-size: 15.7px;
}
.citizen-header {
/* background: var(--background-color-primary--active); */
background: var(--primary-3);
top: 0;
bottom: auto;
}
.skin-citizen-light .citizen-header {
background: var(--accent-2);
}
.citizen-scroll--down .citizen-header {
transform: translateY(-100%);
}
.citizen-page-container #localNotice {
margin-top: 38px;
transition: var(--transition-menu);
transition-property: transform;
transform: translateY(-100%);
}
.citizen-header__logo .mw-logo-icon {
width: 60px;
height: 50px;
position: relative;
top: -5px;
left: -1px;
}
.citizen-header__button {
width: 50px;
contain: layout;
}
.citizen-body-header--sticky .mw-body-header {
top: 33px;
max-height: 20px;
transform: translateY(66%);
}
.skin-citizen-dark .citizen-body-header--sticky .mw-body-header::before {
/* background: var(--background-color-primary--hover); */
background: var(--primary-6);
}
.skin-citizen-light .citizen-body-header--sticky .mw-body-header::before {
background: var(--accent-3);
}
.citizen-body-header--sticky .mw-body-header .mw-first-heading {
color: white!important;
}
.citizen-body-container .pullout-wrapper {
display: none;
}
.citizen-body-container .subpage-tabs-main {
border-collapse: collapse;
border: none;
background: none;
}
.citizen-body-container .subpage-tabs-main tr {
display: flex;
flex-wrap: wrap;
}
.citizen-body-container .subpage-tabs-tab {
font-size: .97em;
width: 32.6%!important;
border: 3px solid white !important;
margin-right: 2.6px;
margin-bottom: 3px;
padding: 9px 0px !important;
}
mobile-no-display {
display: none;
}
div#article-type {
border: 1px solid var(--accent-2);
padding: 5px;
letter-spacing: .5px;
text-align: left;
min-height: 55px;
min-width: 528.5px;
margin: 0px 0px 10px 0px;
}
div#article-type p {
margin-left: 205px;
line-height: 11px;
font-size: 11px;
text-align: left;
font-weight: normal;
font-style: normal;
}
/* +++++++++++++++++++
Various article types
+++++++++++++++++++ */
div#type-title {
margin-left: 205px;
font-size: 18pt;
line-height: 16pt;
}
/* div.type-spoiler {
background: rgba(var(--theme-page-text-color--rgb),.04) url(https://images.wikia.nocookie.net/tardis/images/7/7f/Spoiler200px.jpg) no-repeat;
z-index: 5;
} */
.mainpage .gallerybox img {
width: auto;
margin: 0!important;
}
.mainpage-box-characters {
width: 458px;
margin-left: -5px;
}
.citizen-body-container .mainpage-box-characters .gallerytext {
left: -55px;
top: -15px;
}