mirror of
https://github.com/koel/koel
synced 2024-12-23 02:53:20 +00:00
24 lines
530 B
Vue
24 lines
530 B
Vue
<template>
|
|
<button
|
|
class="relative flex items-center justify-center h-[42px] aspect-square rounded-full
|
|
bg-none md:bg-black/30 text-xl opacity-70 transition-opacity duration-200 ease-in-out text-current cursor-pointer
|
|
hover:active-state active:scale-90"
|
|
type="button"
|
|
>
|
|
<slot />
|
|
</button>
|
|
</template>
|
|
|
|
<style lang="postcss" scoped>
|
|
@tailwind utilities;
|
|
|
|
@layer utilities {
|
|
.active-state {
|
|
@apply opacity-100 text-k-text-primary bg-white/10;
|
|
}
|
|
}
|
|
|
|
button.active {
|
|
@apply active-state;
|
|
}
|
|
</style>
|