Commit 2906d450 authored by Aria Givi's avatar Aria Givi
Browse files

Animation sieht jetzt gut aus

parent 7737b64d
......@@ -49,13 +49,14 @@
&>label {
font-size: 16px;
line-height: 20px;
font-weight: normal;
text-decoration: none;
text-indent: 12px;
color: black;
line-height: 20px;
display: inline-block;
width: 100%;
color: black;
font-weight: normal;
&:hover {
color: red;
}
......@@ -63,13 +64,15 @@
}
& .metager-dropdown-menu {
min-width: 160px;
max-height: 0px;
text-align: left;
list-style-type: none;
z-index: 1000;
float: left;
min-width: 160px;
text-align: left;
max-height: 0px;
overflow: hidden;
transition: 0.5s ease;
&>li>a {
display: block;
font-size: 12px;
......@@ -80,10 +83,12 @@
line-height: 1.42857143;
border-top: 1px solid LightGray;
margin-left: 2px;
&:hover {
text-decoration: none;
}
}
label:after {
#navbar-static-pages {
z-index: 4;
......@@ -128,12 +133,10 @@
&:checked {
& ~.metager-dropdown-menu {
animation-name: dropdown-animation;
animation-duration: 0.7s;
animation-timing-function: ease-out;
animation-fill-mode: forwards;
animation-delay: 0.1s;
max-height: 1000px;
padding: 5px 0;
}
& ~ label > .caret {
border-top:0 solid;
border-bottom:4px solid;
......@@ -143,10 +146,7 @@
&:not(:checked) {
& ~.metager-dropdown-menu {
animation-name: reverse-dropdown-animation;
animation-duration: 0.3s;
animation-timing-function: ease-in;
animation-fill-mode: forwards;
padding: 0px 0;
}
}
}
......@@ -188,34 +188,4 @@ input#nav0:checked {
& ~.sideBar {
right: 0px;
}
}
@keyframes dropdown-animation {
0% {
max-height: 0px;
padding: 0px 0;
}
1% {
padding: 5px 0;
}
100% {
max-height: 1000px;
padding: 5px 0;
}
}
@keyframes reverse-dropdown-animation {
0% {
max-height: 300px;
padding: 5px 0;
}
1% {
padding: 5px 0;
}
100% {
max-height: 0px;
padding: 0px 0;
}
}
}
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment