Difference between revisions of "User:Yaycupcake/readermode.css"
From A3! Wiki
Yaycupcake (talk | contribs) |
Yaycupcake (talk | contribs) |
||
(15 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
− | + | /* 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 { | |
− | |||
− | |||
− | |||
− | #mw- | ||
display: none; | display: none; | ||
} | } | ||
− | + | #mw-content-block > #mw-content-wrapper > :not(#mw-content), | |
− | #mw- | + | #mw-site-navigation, |
− | + | #mw-related-navigation { | |
− | |||
− | |||
− | |||
− | |||
− | #mw- | ||
display: none; | 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; | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | top: | ||
− | |||
− | |||
padding: 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; | 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 | + | background-color: floralwhite; |
+ | border-color: oldlace; | ||
+ | color: #333; | ||
} | } | ||
+ | /* Images */ | ||
− | + | /* References */ | |
− | + | #mw-content h2 { | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | /* | ||
− | |||
− | |||
− | |||
− | h2 { | ||
border: none; | border: none; | ||
text-align: center; | text-align: center; | ||
Line 202: | Line 113: | ||
ol.references { | ol.references { | ||
margin: 0!important; | margin: 0!important; | ||
− | |||
− | |||
− | |||
− | |||
list-style: none; | list-style: none; | ||
+ | border: none; | ||
} | } | ||
− | |||
ol.references li { | ol.references li { | ||
display: block; | display: block; | ||
Line 215: | Line 122: | ||
} | } | ||
− | + | @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); } |
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); }