refactor(core): ♻️ refactor sticky header element styles

This commit is contained in:
alistair3149 2024-11-12 18:47:35 -05:00
parent 5975e51f58
commit 5431d1499a
No known key found for this signature in database
2 changed files with 6 additions and 6 deletions

View file

@ -48,14 +48,14 @@
}
}
.sticky-header-element {
top: var( --height-sticky-header ) !important;
}
.citizen-sticky-header(@bottomBorder: true, @zIndex: true) {
position: -webkit-sticky;
position: sticky;
top: 0;
transition-timing-function: var( --transition-timing-function-ease );
transition-duration: var( --transition-duration-base );
transition-property: transform;
transform: translate3d( 0, var( --height-sticky-header ), 0 );
.sticky-header-element;
& when (@bottomBorder ) {
box-shadow: 0 1px 0 0 var( --border-color-base );

View file

@ -95,7 +95,7 @@ html {
* to make their templates compatible with the Citizen sticky header.
*/
.mw-sticky-header-element {
top: var( --height-sticky-header ) !important;
.sticky-header-element;
}
// Make sticky header more compact if there are less screen estate