MediaWiki:Common.css/src/extension/ThemeToggle.scss
< MediaWiki:Common.css | src
Jump to navigation
Jump to search
This page is one of the SCSS pages which are the basis for MediaWiki:Common.css. After you edit this page, you will need to recompile them for your changes to take effect. See Terraria Wiki:CSS to learn more.
Ancestors: / src / extension / ThemeToggle.scss
Siblings: AbuseFilter.scss Cargo.scss CategoryTree.scss Cite.scss CiteThisPage.scss CodeEditor.scss DebugTemplates.scss Echo.scss EmbedVideo.scss InputBox.scss Interwiki.scss Math.scss MultimediaViewer.scss ReplaceText.scss Scribunto.scss SimpleMathJax.scss SyntaxHighlight.scss TabberNeue.scss TemplateData.scss ThemeToggle.scss WikiEditor.scss
Children: (none)
@use "../lib";
/********* Extension:ThemeToggle *********/
header#wikigg-header #p-personal li#pt-themes {
white-space: nowrap;
line-height: unset;/*<< reset */
height: var(--layout-topbar-height);
border-right: 1px solid #404040;
padding-left: 12px;
padding-right: 12px;
&:hover, &:active{
background: unset;
}
#pt-themes-label{
padding: 0;
margin: 0;
background: none;
align-items: flex-start;
justify-content: center;
cursor: pointer;
height: 100%;
> span:first-child{
color: #bbb;
font-size: 10px;
line-height: 12px;
margin: 0;
}
> span:last-child{
line-height: 18px;
margin: 0;
display: flex;
align-items: center;
&::after{
all: unset;
content: '';
display: block;
width: 14px;
height: 14px;
@include lib.mask-icon(#bbb, var(--icon-chevron-down));
margin: 0 0 0 3px;
}
}
}
#pt-themes-checkbox{
display: none;
}
#pt-themes-checkbox:checked + #pt-themes-label::after{
transform: scaleY(-1);
}
.ext-themetoggle-popup{
border: 0;
padding: 0;
width: auto;
min-width: 100%;
left: 0;
top: var(--layout-topbar-height);
transform: none;
font-size: inherit;/*<< reset */
line-height: inherit;/*<< reset */
&::before{
display: none;
}
ul{
padding: 6px;
gap: 2px;
border: 0;
background: #000538;/*<< same as top bar */
li{
transition: background 0.3s;
}
li:first-child{
padding: 0 6px;
font-size: 12px;
line-height: 20px;
color: #bbb
}
a{
padding: 2px 6px;
font-size: inherit;
}
}
}
@media screen and (max-width: lib.$breakpoint-wikigg-header) {
border-right: 0;
border-radius: 0;
padding-left: 0;
padding-right: 0;
display: block;
float: none;
position: absolute;
top: calc(0px - var(--layout-topbar-height));
right: var(--layout-topbar-height);
.ext-themetoggle-popup{
left: auto;
right: -1px;
z-index: 1;
ul li:not(#pt-themes):hover{
background: rgba(255,255,255,0.25);
}
}
#pt-themes-label{
span, span:last-child{
display: none;
}
&::after{
content: "";
display: block;
@include lib.mask-icon(#fff, var(--icon-brush), 19px 19px);
width: var(--layout-topbar-height);
height: var(--layout-topbar-height);
margin: 0;
}
}
#pt-themes-checkbox:checked + #pt-themes-label::after{
transform: none;
}
/* Disable hover-to-show for styleToggle menu, keep click-to-show only */
&:hover .ext-themetoggle-popup{
display: none;
}
> input[type="checkbox"]:checked ~ .ext-themetoggle-popup{
display: block;
}
#pt-themes-label:hover,
.vector-menu-checkbox:checked ~ #pt-themes-label{
background: rgba(255,255,255,0.25);
}
}
}