Difference between revisions of "User:Yaycupcake/readermode.css"
From A3! Wiki
m (Updated for Timeless skin) |
Yaycupcake (talk | contribs) |
||
(14 intermediate revisions by 2 users not shown) | |||
Line 5: | Line 5: | ||
#mw-page-header-links > :not(#p-pagetools), | #mw-page-header-links > :not(#p-pagetools), | ||
#mw-page-header-links li#ca-view, #mw-page-header-links li#ca-history, | #mw-page-header-links li#ca-view, #mw-page-header-links li#ca-history, | ||
− | #headertabs #edittab { | + | #headertabs #edittab, |
+ | #contentSub { | ||
display: none; | display: none; | ||
} | } | ||
− | #mw-content-block > :not(#mw-content) { | + | #mw-content-block > #mw-content-wrapper > :not(#mw-content), |
+ | #mw-site-navigation, | ||
+ | #mw-related-navigation { | ||
display: none; | display: none; | ||
} | } | ||
Line 15: | Line 18: | ||
margin: auto; | margin: auto; | ||
} | } | ||
− | @media screen and ( | + | |
− | #mw-content { margin: auto; } | + | @media screen and (max-width: 851px) { |
+ | #mw-content { | ||
+ | padding: 0.5em; | ||
+ | } | ||
+ | |||
+ | table.storytable { | ||
+ | width: 100%!important; | ||
+ | margin: auto; | ||
+ | } | ||
+ | table.storybodytable { | ||
+ | width: 100%!important; | ||
+ | } | ||
+ | .storybodytable tr td:not(.storychoice):not(.storyimage):not(.LIME) { | ||
+ | font-size: 1em; | ||
+ | } | ||
} | } | ||
Line 44: | Line 61: | ||
background: antiquewhite; | background: antiquewhite; | ||
font-family: Arvo!important; | font-family: Arvo!important; | ||
− | font-size: | + | font-size: 24px; |
border: none; | border: none; | ||
box-shadow: none; | box-shadow: none; | ||
+ | } | ||
+ | |||
+ | @media screen and (max-width: 850px) { | ||
+ | body, #mw-content-container, #mw-content-block, #mw-content, | ||
+ | table, table.storytable, | ||
+ | table.storytable > tr > th, table.storytable > tr > td, table.storytable > * > tr > th, | ||
+ | table.storytable > * > tr > td { | ||
+ | font-size: 18px; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .storyborder { | ||
+ | border-width: 0 4px 0 0; | ||
+ | } | ||
+ | |||
+ | @media screen and (max-width: 650px) { | ||
+ | .storyborder { | ||
+ | border-width: 0 0 4px 0!important; | ||
+ | } | ||
+ | .line { | ||
+ | display: flex; | ||
+ | flex-direction: column; | ||
+ | } | ||
+ | .label:not(.charname) { | ||
+ | display: none; | ||
+ | } | ||
+ | .label.charname { | ||
+ | width: auto!important; | ||
+ | text-align: left!important; | ||
+ | } | ||
} | } | ||
Line 73: | Line 120: | ||
padding-left: 20%!important; | padding-left: 20%!important; | ||
padding-right: 20%!important; | padding-right: 20%!important; | ||
+ | } | ||
+ | |||
+ | @media screen and (max-width: 650px) { | ||
+ | ol.references li { | ||
+ | padding-left: 10%!important; | ||
+ | padding-right: 10%!important; | ||
+ | } | ||
} | } | ||
Line 78: | Line 132: | ||
#headertabs.bare .ui-widget-content a, #headertabs.bare .ui-widget-content a:visited, a, a:visited { color: #333; } | #headertabs.bare .ui-widget-content a, #headertabs.bare .ui-widget-content a:visited, a, a:visited { color: #333; } | ||
#headertabs.bare .ui-widget-content a:hover, a:hover { color: var(--mankai); } | #headertabs.bare .ui-widget-content a:hover, a:hover { color: var(--mankai); } | ||
− |
Latest revision as of 01:11, 13 February 2022
/* Clean Screen */ #mw-content h1.firstHeading, #catlinks, #mw-footer-container, #mw-header-container, #mw-header-hack, #mw-header-nav-hack, #mw-page-header-links > :not(#p-pagetools), #mw-page-header-links li#ca-view, #mw-page-header-links li#ca-history, #headertabs #edittab, #contentSub { display: none; } #mw-content-block > #mw-content-wrapper > :not(#mw-content), #mw-site-navigation, #mw-related-navigation { display: none; } #mw-content { margin: auto; } @media screen and (max-width: 851px) { #mw-content { padding: 0.5em; } table.storytable { width: 100%!important; margin: auto; } table.storybodytable { width: 100%!important; } .storybodytable tr td:not(.storychoice):not(.storyimage):not(.LIME) { font-size: 1em; } } /* Header Tabs */ .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header, .ui-widget-header .ui-state-default, #headertabs.bare .ui-widget-header { background: transparent; border: none; } .ui-tabs .ui-tabs-nav li { list-style: none; top: 0; margin: 0; border-bottom: 0; padding: 0; white-space: nowrap; text-transform: uppercase; } .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { background: floralwhite; border: none; } /* Styles */ body, #mw-content-container, #mw-content-block, #mw-content, table, table.storytable, table.storytable > tr > th, table.storytable > tr > td, table.storytable > * > tr > th, table.storytable > * > tr > td { background: antiquewhite; font-family: Arvo!important; font-size: 24px; border: none; box-shadow: none; } @media screen and (max-width: 850px) { body, #mw-content-container, #mw-content-block, #mw-content, table, table.storytable, table.storytable > tr > th, table.storytable > tr > td, table.storytable > * > tr > th, table.storytable > * > tr > td { font-size: 18px; } } .storyborder { border-width: 0 4px 0 0; } @media screen and (max-width: 650px) { .storyborder { border-width: 0 0 4px 0!important; } .line { display: flex; flex-direction: column; } .label:not(.charname) { display: none; } .label.charname { width: auto!important; text-align: left!important; } } .translatorcredit { background-color: floralwhite; border-color: oldlace; color: #333; } /* Images */ /* References */ #mw-content h2 { border: none; text-align: center; font-family: Arvo!important; } ol.references { margin: 0!important; list-style: none; border: none; } ol.references li { display: block; padding-left: 20%!important; padding-right: 20%!important; } @media screen and (max-width: 650px) { ol.references li { padding-left: 10%!important; padding-right: 10%!important; } } /* Links */ #headertabs.bare .ui-widget-content a, #headertabs.bare .ui-widget-content a:visited, a, a:visited { color: #333; } #headertabs.bare .ui-widget-content a:hover, a:hover { color: var(--mankai); }