Difference between revisions of "MediaWiki:Common.css"
Jump to navigation
Jump to search
(Created page with "→CSS placed here will be applied to all skins: →Hide the title on Main Page: .page-Main_Page .firstHeading { display: none; }") |
|||
Line 4: | Line 4: | ||
.page-Main_Page .firstHeading { | .page-Main_Page .firstHeading { | ||
display: none; | display: none; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* Toggle */ | ||
+ | |||
+ | .rsToggleContainer { | ||
+ | display: inline-block; | ||
+ | position: relative; | ||
+ | height: 3em; | ||
+ | } | ||
+ | .rsSegment { | ||
+ | display: inline-block; | ||
+ | border: 1px solid black; | ||
+ | } | ||
+ | .rsSegmentFirst { | ||
+ | border-top-left-radius: 10px; | ||
+ | border-bottom-left-radius: 10px; | ||
+ | } | ||
+ | .rsSegmentMiddle { | ||
+ | border-left: none; | ||
+ | } | ||
+ | .rsSegmentLast { | ||
+ | border-left: none; | ||
+ | border-top-right-radius: 10px; | ||
+ | border-bottom-right-radius: 10px; | ||
+ | } | ||
+ | .rsSegmentTitle { | ||
+ | display: block; | ||
+ | position: absolute; | ||
+ | left: 50%; | ||
+ | top: 50%; | ||
+ | transform: translate(-50%, -50%); | ||
+ | } | ||
+ | .rsSegmentFill { | ||
+ | position: relative; | ||
+ | background-color: #ddd; | ||
+ | border-top: 1px solid white; | ||
+ | border-bottom: 2px solid #999; | ||
+ | width: 10em; | ||
+ | height: 2em; | ||
+ | } | ||
+ | .rsSegmentFirst .rsSegmentFill { | ||
+ | border-top-left-radius: 9px; | ||
+ | border-bottom-left-radius: 9px; | ||
+ | } | ||
+ | .rsSegmentLast .rsSegmentFill { | ||
+ | border-top-right-radius: 9px; | ||
+ | border-bottom-right-radius: 9px; | ||
+ | } | ||
+ | .rsSegmentSelected .rsSegmentFill { | ||
+ | border-top: 3px solid #666; | ||
+ | border-bottom: none; | ||
+ | background-color: #aaa; | ||
+ | color: white; | ||
+ | } | ||
+ | .rsToggleContainer a { | ||
+ | -webkit-touch-callout: none; | ||
+ | -webkit-user-select: none; | ||
+ | -khtml-user-select: none; | ||
+ | -moz-user-select: none; | ||
+ | -ms-user-select: none; | ||
+ | user-select: none; | ||
+ | } | ||
+ | a:active .rsSegmentFill { | ||
+ | background-color: #bbb; | ||
+ | border-top: 2px solid #999; | ||
+ | border-bottom: 1px solid #bbb; | ||
+ | } | ||
+ | a:active .rsSegmentTitle { | ||
+ | color: black; | ||
} | } |
Revision as of 16:19, 28 March 2020
/* CSS placed here will be applied to all skins */ /* Hide the title on Main Page */ .page-Main_Page .firstHeading { display: none; } /* Toggle */ .rsToggleContainer { display: inline-block; position: relative; height: 3em; } .rsSegment { display: inline-block; border: 1px solid black; } .rsSegmentFirst { border-top-left-radius: 10px; border-bottom-left-radius: 10px; } .rsSegmentMiddle { border-left: none; } .rsSegmentLast { border-left: none; border-top-right-radius: 10px; border-bottom-right-radius: 10px; } .rsSegmentTitle { display: block; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .rsSegmentFill { position: relative; background-color: #ddd; border-top: 1px solid white; border-bottom: 2px solid #999; width: 10em; height: 2em; } .rsSegmentFirst .rsSegmentFill { border-top-left-radius: 9px; border-bottom-left-radius: 9px; } .rsSegmentLast .rsSegmentFill { border-top-right-radius: 9px; border-bottom-right-radius: 9px; } .rsSegmentSelected .rsSegmentFill { border-top: 3px solid #666; border-bottom: none; background-color: #aaa; color: white; } .rsToggleContainer a { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } a:active .rsSegmentFill { background-color: #bbb; border-top: 2px solid #999; border-bottom: 1px solid #bbb; } a:active .rsSegmentTitle { color: black; }