Views
Actions
Difference between revisions of "MediaWiki:Citizen.css"
From Forge Community Wiki
(modify style <tt> tags, and some cleanup) |
(add styling for the tabs extension) |
||
Line 14: | Line 14: | ||
padding: 0 0.1em; | padding: 0 0.1em; | ||
} | } | ||
+ | |||
+ | /* ***************** Styling for Tabs : START ***************** */ | ||
+ | |||
+ | .tabs-dropdown .tabs-content, | ||
+ | .tabs-dropdown .tabs-container, | ||
+ | .tabs-dropdown li, | ||
+ | .tabs-dropdown ul, | ||
+ | .tabs-dropdown ol { | ||
+ | background-color: rgba(32,32,32,0.2); | ||
+ | } | ||
+ | |||
+ | .tabs-label { | ||
+ | background-color: #222; | ||
+ | border-color: #666; | ||
+ | } | ||
+ | |||
+ | .tabs-tabbox > .tabs-container { | ||
+ | border-color: #666; | ||
+ | } | ||
+ | .tabs-plain > .tabs-label { | ||
+ | border-color: #666; | ||
+ | } | ||
+ | .tabs-togglebox >*> .tabs-content { | ||
+ | border-color: #666; | ||
+ | } | ||
+ | |||
+ | .tabs-dropdown >*> .tabs-content, | ||
+ | .tabs-dropdown li ul, | ||
+ | .tabs-dropdown li ol { | ||
+ | box-shadow: 2px 3px 5px #111; | ||
+ | } | ||
+ | |||
+ | .tabs-dropdown li, | ||
+ | .tabs-dropdown >*> .tabs-content> a, | ||
+ | .tabs-dropdown >*> .tabs-content>p> a, | ||
+ | .tabs-dropdown ol>li> a { | ||
+ | border-top-color: #666; | ||
+ | } | ||
+ | |||
+ | .tabs-dropdown li ul, | ||
+ | .tabs-dropdown li ol { | ||
+ | border-color: #666; | ||
+ | } | ||
+ | .tabs-dropdown li ul:before, | ||
+ | .tabs-dropdown li ol:before { | ||
+ | color: #88F; | ||
+ | } | ||
+ | |||
+ | .tabs-label:hover { | ||
+ | background-color: #444; | ||
+ | } | ||
+ | .tabs-label:active, .tabs-label:focus { | ||
+ | background-color: #444; | ||
+ | } | ||
+ | .tabs-tabbox > .tabs-input:checked + .tabs-label, | ||
+ | .tabs-input-0:checked + .tabs-input-1 + .tabs-label { | ||
+ | z-index: 2; | ||
+ | background-color: #444; | ||
+ | } | ||
+ | |||
+ | .tabs-dropdown >*> .tabs-content li:hover { | ||
+ | background-color: #444; | ||
+ | } | ||
+ | .tabs-dropdown a, | ||
+ | .tabs-dropdown a:hover, | ||
+ | .tabs-dropdown a: visited { | ||
+ | color: #15B; | ||
+ | } | ||
+ | .tabs-dropdown a:active { | ||
+ | color: #108; | ||
+ | } | ||
+ | .tabs-dropdown >*> .tabs-content> a:hover, | ||
+ | .tabs-dropdown >*> .tabs-content>p> a:hover, | ||
+ | .tabs-dropdown ol>li> a:hover { | ||
+ | background-color: #444; | ||
+ | } | ||
+ | |||
+ | .tabs-tabbox > .tabs-input.checked + .tabs-label, | ||
+ | .tabs-input-0.checked + .tabs-input-1 + .tabs-label { | ||
+ | background-color: #444; | ||
+ | } | ||
+ | |||
+ | /* ***************** Styling for Tabs : END ***************** */ |
Revision as of 07:29, 8 January 2021
/* All CSS here will be loaded for users of the Citizen skin */ @media only screen and (prefers-color-scheme:dark) { code, .mw-code { color: #46C410; } } .external { color: #527ECA; } tt { font-size: 100%; padding: 0 0.1em; } /* ***************** Styling for Tabs : START ***************** */ .tabs-dropdown .tabs-content, .tabs-dropdown .tabs-container, .tabs-dropdown li, .tabs-dropdown ul, .tabs-dropdown ol { background-color: rgba(32,32,32,0.2); } .tabs-label { background-color: #222; border-color: #666; } .tabs-tabbox > .tabs-container { border-color: #666; } .tabs-plain > .tabs-label { border-color: #666; } .tabs-togglebox >*> .tabs-content { border-color: #666; } .tabs-dropdown >*> .tabs-content, .tabs-dropdown li ul, .tabs-dropdown li ol { box-shadow: 2px 3px 5px #111; } .tabs-dropdown li, .tabs-dropdown >*> .tabs-content> a, .tabs-dropdown >*> .tabs-content>p> a, .tabs-dropdown ol>li> a { border-top-color: #666; } .tabs-dropdown li ul, .tabs-dropdown li ol { border-color: #666; } .tabs-dropdown li ul:before, .tabs-dropdown li ol:before { color: #88F; } .tabs-label:hover { background-color: #444; } .tabs-label:active, .tabs-label:focus { background-color: #444; } .tabs-tabbox > .tabs-input:checked + .tabs-label, .tabs-input-0:checked + .tabs-input-1 + .tabs-label { z-index: 2; background-color: #444; } .tabs-dropdown >*> .tabs-content li:hover { background-color: #444; } .tabs-dropdown a, .tabs-dropdown a:hover, .tabs-dropdown a: visited { color: #15B; } .tabs-dropdown a:active { color: #108; } .tabs-dropdown >*> .tabs-content> a:hover, .tabs-dropdown >*> .tabs-content>p> a:hover, .tabs-dropdown ol>li> a:hover { background-color: #444; } .tabs-tabbox > .tabs-input.checked + .tabs-label, .tabs-input-0.checked + .tabs-input-1 + .tabs-label { background-color: #444; } /* ***************** Styling for Tabs : END ***************** */