MediaWiki:Vector.css: Difference between revisions
From Ardent Spacers Wiki
No edit summary |
No edit summary |
||
| Line 31: | Line 31: | ||
position: relative; | position: relative; | ||
left: -2px; | left: -2px; | ||
} | |||
#ca-edit, | |||
.ve-not-available body:is(.action-edit,.action-view,.action-submit):has([title^="Start a new section"],[title^="Create the source"]) #mw-head #right-navigation nav:not(.mw-portlet-cactions) #ca-edit, | |||
body:is(.action-edit,.action-view,.action-submit) #mw-head #right-navigation:has([title^="Create this page"]) nav:not(.mw-portlet-cactions) #ca-ve-edit { | |||
transform: skew(-30deg) !important; | |||
padding: 0 .26em !important; | |||
clip-path: unset; | |||
} | |||
.ve-not-available body:is(.action-edit,.action-view,.action-submit):not([title^="Start a new section"]):has([title^="Create the source"]) #mw-head #right-navigation nav:not(.mw-portlet-cactions) #ca-edit a, | |||
body:is(.action-edit,.action-view,.action-submit) #mw-head #right-navigation:has([title^="Create this page"]) nav:not(.mw-portlet-cactions) #ca-ve-edit a { | |||
transform: skew(30deg) !important; | |||
} | |||
html:not(.ve-not-available) #ca-edit, | |||
.ve-not-available body:is(.action-edit,.action-view,.action-submit):not([title^="Start a new section"]):has([title^="Create the source"]) #p-views .vector-menu-content-list:has(#ca-edit) li:nth-child(2), | |||
body:is(.action-edit,.action-view,.action-submit) #mw-head #right-navigation:has([title^="Create this page"]) #p-views .vector-menu-content-list:has(#ca-ve-edit) li:nth-child(2) { | |||
border-left: .25em solid var(--vector-tab-gap) !important; | |||
} | |||
#mw-head #right-navigation nav:not(.mw-portlet-cactions) .mw-list-item#ca-watch span, | |||
#mw-head #right-navigation nav:not(.mw-portlet-cactions) .mw-list-item#ca-unwatch span { | |||
display: none; | |||
} | |||
.vector-menu-tabs #ca-watch.icon a::before, | |||
.vector-menu-tabs #ca-watch.icon a:hover::before, | |||
.vector-menu-tabs #ca-watch.icon a:focus::before, | |||
.vector-menu-tabs #ca-unwatch.icon a::before, | |||
.vector-menu-tabs #ca-unwatch.icon a:hover::before, | |||
.vector-menu-tabs #ca-unwatch.icon a:focus::before, | |||
#p-cactions-label::after, | |||
#p-cactions-label span { | |||
transform: skew(30deg); | |||
} | |||
.vector-menu-dropdown .vector-menu-heading { | |||
font-weight: 600; | |||
/* Ensuring "More" text for drop down menu uses same color as other Vector tab elements | |||
which are nested in a different nav element (nav#p-views vs nav#p-cactions) */ | |||
color: var(--vector-tab-link-color); | |||
} | |||
.mw-portlet-cactions { | |||
transform: skew(-30deg); | |||
margin-right: -.875em; | |||
border-left: .25em solid var(--vector-tab-gap); | |||
font-weight: 600; | |||
text-transform: uppercase; | |||
font-variant-caps: all-small-caps; | |||
} | |||
nav .vector-menu-content-list li:first-child { | |||
transform: none !important; | |||
border-left: 0 !important; | |||
padding-right: 1.25em !important; | |||
margin-right: -1em; | |||
clip-path: polygon(0% 0%, calc(100% - 24px) 0%, 100% 100%, 0 100%); | |||
} | |||
nav .vector-menu-content-list li:first-child a span{ | |||
transform: none !important; | |||
} | |||
/*body.ns-special #p-cactions,*/ | |||
#p-views .vector-menu-content-list li:nth-child(2) { | |||
border-left: 0 !important; | |||
} | |||
#p-cactions #p-cactions-label { | |||
padding-right: 20px; | |||
} | |||
#p-cactions>.vector-menu-content { | |||
transform: skew(30deg); | |||
transform-origin: top; | |||
margin-left: 0; | |||
} | |||
Revision as of 23:53, 9 August 2026
/* All CSS here will be loaded for users of the Vector skin */
:root {
/* tilted tabs at the top of the page */
#mw-head #left-navigation .mw-list-item {
transform: skew(30deg);
padding: 0 .25em;
border-left: .25em solid var(--vector-tab-gap);
font-weight: 600;
text-transform: uppercase;
font-variant-caps: all-small-caps;
}
#mw-head #right-navigation nav:not(.mw-portlet-cactions) .mw-list-item {
transform: skew(-30deg);
padding: 0 .26em;
margin: 0 -.1em; /* Use negative margin to fill in one pixel gaps that can occur */
border-left: .25em solid var(--vector-tab-gap);
font-weight: 600;
text-transform: uppercase;
font-variant-caps: all-small-caps;
}
#mw-head #left-navigation .mw-list-item>a>span {
display: inline-block;
transform: skew(-30deg);
}
#mw-head #right-navigation nav:not(.mw-portlet-cactions) .mw-list-item>a>span {
display: inline-block;
transform: skew(30deg);
position: relative;
left: -2px;
}
#ca-edit,
.ve-not-available body:is(.action-edit,.action-view,.action-submit):has([title^="Start a new section"],[title^="Create the source"]) #mw-head #right-navigation nav:not(.mw-portlet-cactions) #ca-edit,
body:is(.action-edit,.action-view,.action-submit) #mw-head #right-navigation:has([title^="Create this page"]) nav:not(.mw-portlet-cactions) #ca-ve-edit {
transform: skew(-30deg) !important;
padding: 0 .26em !important;
clip-path: unset;
}
.ve-not-available body:is(.action-edit,.action-view,.action-submit):not([title^="Start a new section"]):has([title^="Create the source"]) #mw-head #right-navigation nav:not(.mw-portlet-cactions) #ca-edit a,
body:is(.action-edit,.action-view,.action-submit) #mw-head #right-navigation:has([title^="Create this page"]) nav:not(.mw-portlet-cactions) #ca-ve-edit a {
transform: skew(30deg) !important;
}
html:not(.ve-not-available) #ca-edit,
.ve-not-available body:is(.action-edit,.action-view,.action-submit):not([title^="Start a new section"]):has([title^="Create the source"]) #p-views .vector-menu-content-list:has(#ca-edit) li:nth-child(2),
body:is(.action-edit,.action-view,.action-submit) #mw-head #right-navigation:has([title^="Create this page"]) #p-views .vector-menu-content-list:has(#ca-ve-edit) li:nth-child(2) {
border-left: .25em solid var(--vector-tab-gap) !important;
}
#mw-head #right-navigation nav:not(.mw-portlet-cactions) .mw-list-item#ca-watch span,
#mw-head #right-navigation nav:not(.mw-portlet-cactions) .mw-list-item#ca-unwatch span {
display: none;
}
.vector-menu-tabs #ca-watch.icon a::before,
.vector-menu-tabs #ca-watch.icon a:hover::before,
.vector-menu-tabs #ca-watch.icon a:focus::before,
.vector-menu-tabs #ca-unwatch.icon a::before,
.vector-menu-tabs #ca-unwatch.icon a:hover::before,
.vector-menu-tabs #ca-unwatch.icon a:focus::before,
#p-cactions-label::after,
#p-cactions-label span {
transform: skew(30deg);
}
.vector-menu-dropdown .vector-menu-heading {
font-weight: 600;
/* Ensuring "More" text for drop down menu uses same color as other Vector tab elements
which are nested in a different nav element (nav#p-views vs nav#p-cactions) */
color: var(--vector-tab-link-color);
}
.mw-portlet-cactions {
transform: skew(-30deg);
margin-right: -.875em;
border-left: .25em solid var(--vector-tab-gap);
font-weight: 600;
text-transform: uppercase;
font-variant-caps: all-small-caps;
}
nav .vector-menu-content-list li:first-child {
transform: none !important;
border-left: 0 !important;
padding-right: 1.25em !important;
margin-right: -1em;
clip-path: polygon(0% 0%, calc(100% - 24px) 0%, 100% 100%, 0 100%);
}
nav .vector-menu-content-list li:first-child a span{
transform: none !important;
}
/*body.ns-special #p-cactions,*/
#p-views .vector-menu-content-list li:nth-child(2) {
border-left: 0 !important;
}
#p-cactions #p-cactions-label {
padding-right: 20px;
}
#p-cactions>.vector-menu-content {
transform: skew(30deg);
transform-origin: top;
margin-left: 0;
}
}
