feat: added play buttons

This commit is contained in:
Aliaksei Karzhou
2024-07-11 16:40:45 +03:00
parent 0cd253a653
commit 0b70e62905
5 changed files with 204 additions and 0 deletions

View File

@@ -31,6 +31,7 @@
}
&-video {
position: relative;
height: 205px;
margin: 0 0 15px;
overflow: hidden;
@@ -50,6 +51,52 @@
width: 100%;
height: 100%;
}
&::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 10;
background-color: rgba($color: #000000, $alpha: 0.1);
backdrop-filter: blur(10px);
cursor: pointer;
}
&::after {
content: '';
position: absolute;
top: 50%;
left: 50%;
z-index: 11;
display: block;
width: 88px;
aspect-ratio: 1 / 1;
background: url(../img/icons/play.svg) center no-repeat;
background-size: cover;
transform: translateX(-50%) translateY(-50%);
transition: transform ease-in-out 0.1s;
cursor: pointer;
@include tablet {
width: 64px;
}
}
&.active::before,
&.active::after {
display: none;
}
&:hover::after {
transform: translateX(-50%) translateY(-50%) scale(1.06);
}
&:active::after {
transform: translateX(-50%) translateY(-50%) scale(0.98);
}
}
&-name {