🔷 add play and actions btn

This commit is contained in:
geoffrey45
2022-04-08 21:04:52 +03:00
parent 9afab33b9a
commit 24db32ae09
4 changed files with 134 additions and 26 deletions
+15 -13
View File
@@ -1,23 +1,25 @@
<template>
<div class="play-btn circular">
<div class="icon"></div>
</div>
<div class="play-btn rounded shadow-sm" @click="playThis"></div>
</template>
<script setup lang="ts">
function playThis(e: Event) {
e.preventDefault();
e.stopImmediatePropagation();
}
</script>
<style lang="scss">
.play-btn {
width: 2rem;
height: 2rem;
background-color: $accent;
width: 2.5rem;
height: 2.5rem;
background-color: $gray3;
background-image: url("../../assets/icons/play.svg");
background-size: 1.25rem;
background-position: 60%;
background-repeat: no-repeat;
transition: all .25s;
background-size: 1.75rem;
background-position: 50% 50%;
transition: all 0.25s ease-in-out;
&:hover {
background-color: rgb(58, 197, 58);
transform: scale(1.1);
background-color: $accent;
transform: scale(1.1);
}
}
</style>