host/xiaowang
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Edit header navigation bar style

Browse source
This commit is contained in:
Paul Nicoué 2022-06-10 16:07:48 +02:00
parent e90e57ff02
commit 64ad7b3a70
5 changed files with 31 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

24
assets/css/style.scss
View file

@ -111,10 +111,9 @@ footer {
.header-bar {
width: 100%;
max-width: var(--content-max-width);
height: var(--header-bar-height);
margin: auto;
padding: var(--header-bar-vertical-padding) var(--header-bar-horizontal-padding);
padding: var(--header-bar-vertical-padding) Max(var(--header-bar-horizontal-padding), calc((100vw - var(--content-max-width)) / 2 + var(--header-bar-horizontal-padding)));
background-color: var(--transparent-white);
border-bottom: 1px solid var(--transparent-white);
display: -webkit-box;
@ -127,9 +126,15 @@ footer {
-ms-flex-align: center;
align-items: center;
z-index: 1;
-webkit-transition: border-bottom 400ms ease-in-out;
-o-transition: border-bottom 400ms ease-in-out;
transition: border-bottom 400ms ease-in-out;
-webkit-transition:
height 400ms ease-in-out,
border-bottom 400ms ease-in-out;
-o-transition:
height 400ms ease-in-out,
border-bottom 400ms ease-in-out;
transition:
height 400ms ease-in-out,
border-bottom 400ms ease-in-out;
&--fixed {
position: fixed;
@ -247,7 +252,7 @@ footer {
min-width: 100vw;
max-width: 100vw;
height: 100vh;
padding: calc(var(--header-bar-height) + 4rem) 4rem 4rem 4rem;
padding: calc(var(--header-bar-height) + 4rem) Max(4rem, calc((100vw - var(--content-max-width)) / 2 + 4rem)) 4rem 4rem;
background-color: var(--transparent-black);
color: var(--white);
overflow-x: hidden;
@ -321,6 +326,13 @@ footer {
@media screen and (min-width: $tablet-media-query) {
.header-bar {
&--fixed {
--header-bar-height: calc(var(--header-bar-vertical-padding) + var(--icon-size));
}
}
.header-bar__nav-menu {
min-width: 50vw;
}