add play button for gallery

This commit is contained in:
rzen
2020-09-07 10:00:23 -04:00
parent 9a79558814
commit 2cc6343944
7 changed files with 64 additions and 28 deletions

View File

@ -252,7 +252,7 @@ main {
cursor: pointer;
border-radius: 6px;
display: none;
transition: all .3s ease;
transition: all 300ms ease;
}
img:first-child {
@ -271,13 +271,44 @@ main {
width: 1rem;
height: 1rem;
border-radius: .5rem;
transition: all .3s ease;
transition: all 300ms ease;
background-color: hsl($hue,10,80);
&.selected {
background-color: hsl($hue,50,40);
}
}
.play {
label {
margin: .5rem;
display: inline-block;
box-sizing: border-box;
width: 0;
height: .5rem;
cursor: pointer;
border-color: transparent transparent transparent #202020;
transition: 300ms all ease;
will-change: border-width;
// paused state
border-style: double;
border-width: 0 0 0 .5rem;
}
input[type='checkbox'] {
visibility: hidden;
&:checked + label {
border-style: solid;
border-width: .3rem 0 .3rem .5rem;
}
}
}
}
}
div.gallery + p {