feat: moving header smoother style
This commit is contained in:
parent
013380545a
commit
cdb6708a57
|
@ -223,12 +223,14 @@
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
|
|
||||||
|
margin-right: 1em;
|
||||||
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
overflow-y: visible;
|
overflow-y: visible;
|
||||||
|
|
||||||
.skill-card {
|
.skill-card {
|
||||||
margin: .3em 0;
|
margin: .3em 0;
|
||||||
width: 12em;
|
width: 13.4em;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -247,7 +249,7 @@
|
||||||
|
|
||||||
.skill-card {
|
.skill-card {
|
||||||
margin: .3em 0;
|
margin: .3em 0;
|
||||||
width: 12em;
|
width: 13.4em;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -176,12 +176,26 @@
|
||||||
height: $header-height;
|
height: $header-height;
|
||||||
|
|
||||||
background: #564ba4;
|
background: #564ba4;
|
||||||
background: #fff;
|
|
||||||
|
|
||||||
z-index: 500;
|
z-index: 500;
|
||||||
|
|
||||||
|
transition: background .5s ease-in-out,
|
||||||
|
margin .2s ease-in-out,
|
||||||
|
left .2s ease-in-out,
|
||||||
|
width .2s ease-in-out,
|
||||||
|
border-radius .2s ease-in-out,
|
||||||
|
box-shadow .2s ease-in-out;
|
||||||
|
|
||||||
&.fixed {
|
&.fixed {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
|
left: 1rem;
|
||||||
|
width: calc( 100% - #{1*2rem} );
|
||||||
|
margin-top: 1rem;
|
||||||
|
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 1rem / 1rem;
|
||||||
|
|
||||||
|
box-shadow: 0 .5em .5em darken(#202228, 5%);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue