mediawiki-skins-Citizen/resources/skins.citizen.styles/Header.less
RogerDodger 296691c2ab remove pointer events on header
This allows users to click on things underneath the header itself
or its shadow. Very useful, especially if the shadow is made any
bigger.
2021-02-04 18:46:41 +10:30

63 lines
1.4 KiB
Plaintext

.mw-header {
--width-button-base: ~'calc(var(--size-icon) + var(--padding-page))';
--width-button-corner: ~'calc(var(--size-icon) + var(--padding-page) * 2)';
position: fixed;
z-index: 10;
top: 0;
right: 0;
left: 0;
display: flex;
height: var( --height-header );
justify-content: space-between;
pointer-events: none;
& > * {
pointer-events: auto;
}
&-tools {
display: inherit;
}
ul {
list-style: none;
}
ul,
li {
display: block;
margin: 0;
}
&:before {
position: absolute;
right: 0;
left: 0;
height: ~'calc( var( --height-header ) * 1.5 )';
/*
* ease(x) := 1 - pow(1 - x, 2);
*/
background-image: linear-gradient(to bottom,
~"rgba(var(--background-color-dp-00-rgb),1)" 0%,
~"rgba(var(--background-color-dp-00-rgb),0.988)" 11.11%,
~"rgba(var(--background-color-dp-00-rgb),0.951)" 22.22%,
~"rgba(var(--background-color-dp-00-rgb),0.889)" 33.33%,
~"rgba(var(--background-color-dp-00-rgb),0.802)" 44.44%,
~"rgba(var(--background-color-dp-00-rgb),0.691)" 55.56%,
~"rgba(var(--background-color-dp-00-rgb),0.556)" 66.67%,
~"rgba(var(--background-color-dp-00-rgb),0.395)" 77.78%,
~"rgba(var(--background-color-dp-00-rgb),0.210)" 88.89%,
~"rgba(var(--background-color-dp-00-rgb),0)" 100%);
content: '';
}
}
// User icon bar
#p-personal-extra {
ul {
display: flex;
height: var( --height-header );
align-items: center;
}
}