animate details icon
This commit is contained in:
parent
c311d1f397
commit
7fa979fc1a
2 changed files with 7 additions and 1 deletions
|
@ -210,6 +210,12 @@ main:not([data-view=route-result]) #route-details,
|
||||||
main:not(.show-details) #resultswrapper .details {
|
main:not(.show-details) #resultswrapper .details {
|
||||||
display:none;
|
display:none;
|
||||||
}
|
}
|
||||||
|
main .buttons .details .material-icons {
|
||||||
|
transition: transform 250ms;
|
||||||
|
}
|
||||||
|
main.show-details .buttons .details .material-icons {
|
||||||
|
transform: scale(1, -1);
|
||||||
|
}
|
||||||
main.show-details #resultswrapper .details {
|
main.show-details #resultswrapper .details {
|
||||||
animation: show-details;
|
animation: show-details;
|
||||||
animation-duration: 150ms;
|
animation-duration: 150ms;
|
||||||
|
|
|
@ -47,7 +47,7 @@
|
||||||
<i class="material-icons" id="route-dots">more_vert</i>
|
<i class="material-icons" id="route-dots">more_vert</i>
|
||||||
<div class="buttons" id="location-buttons">
|
<div class="buttons" id="location-buttons">
|
||||||
<button class="button-clear details">
|
<button class="button-clear details">
|
||||||
<i class="material-icons">arrow_downward</i>
|
<i class="material-icons">expand_more</i>
|
||||||
Details
|
Details
|
||||||
</button>
|
</button>
|
||||||
<button class="button-clear share">
|
<button class="button-clear share">
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue