MediaWiki:Common.css/src/interface/mainBox/navBar/tabs/tab.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 / interface / mainBox / navBar / tabs / tab.scss
Siblings: dropdown.scss tab.scss watch.scss
Children: (none)
@use "../../../../lib";
/* tab */
#mw-head{
--theme-tab-border-radius: var(--theme-widget-border-radius);
--theme-tab-border-style: solid;
--theme-tab-border-left-width: 1px;
--theme-tab-border-right-width: 1px;
--theme-tab-border-top-width: 1px;
--theme-tab-border-bottom-width: 1px;
--theme-tab-border-width: var(--theme-tab-border-top-width) var(--theme-tab-border-right-width) var(--theme-tab-border-bottom-width) var(--theme-tab-border-left-width);
--theme-tab-border-bottom-color: var(--theme-border-bottom-color);
--theme-tab-border-bottom: var(--theme-tab-border-style) var(--theme-tab-border-bottom-width) var(--theme-tab-border-bottom-color);
--theme-tab-border-bottom-selected: var(--theme-tab-border-style) var(--theme-tab-border-bottom-width) transparent;
.vector-menu-tabs .mw-list-item,
.vector-menu-dropdown{
/* outer box */
height: auto;
border-bottom: var(--theme-tab-border-bottom);
position: relative;
padding-right: var(--layout-gap); /* make space for gap */
&::after{
/* inset shadow */
@include lib.pseudo-block;
width: 100%;
height: 100%;
background: var(--theme-background-shadow);
position: absolute;
right: 0;
bottom: 0;
}
&.icon{
display: flex;
}
}
.vector-menu-tabs .mw-list-item a,
.vector-menu-dropdown .vector-menu-heading {
/* inner box */
height: auto;
margin: 0;
padding: var(--tab-padding-y) var(--tab-padding-x);
background: var(--theme-tab-background);
border-width: var(--theme-tab-border-width);
border-style: var(--theme-tab-border-style);
border-color: var(--theme-tab-border-color);
border-bottom: 0;
border-radius: var(--theme-tab-border-radius);
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
color: var(--theme-link-color);
&:hover{
color: var(--theme-link-color-hover);
}
&.new{
color: var(--theme-link-color-redlink);
}
}
.vector-menu-tabs .mw-list-item.selected{
/* outer box: selected */
background: var(--theme-tab-background-selected);
border-width: var(--theme-tab-border-width);
border-style: var(--theme-tab-border-style);
border-color: var(--theme-tab-border-color-selected);
border-radius: var(--theme-tab-border-radius);
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
border-bottom: 0;
padding-right: 0;
margin-right: var(--layout-gap); /* make space for gap */
&::after{
/* gap */
width: var(--layout-gap);
right: auto;
left: 100%;
margin: 0 0 0 var(--theme-tab-border-left-width);/*<< left offset */
border-bottom: var(--theme-tab-border-bottom);
}
a{
/* inner box: selected */
border: 0;
border-bottom: var(--theme-tab-border-bottom-selected);
background: none;
color: var(--theme-text-color);
}
}
}