FEATURE introducing the load more button component
This commit is contained in:
parent
609e5865b8
commit
db1a2c5a45
19
resources/css/components/buttons/load-more.css
Normal file
19
resources/css/components/buttons/load-more.css
Normal file
|
|
@ -0,0 +1,19 @@
|
||||||
|
.load-more-button {
|
||||||
|
@apply text-primary font-semibold flex items-center justify-center gap-2;
|
||||||
|
|
||||||
|
&:after {
|
||||||
|
@apply content-[''] h-8 w-8 block;
|
||||||
|
background-image: url('../resources/img/icons/button-arrow-down-small.svg');
|
||||||
|
background-size: contain;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center;
|
||||||
|
transition: transform 0.3s ease-in-out;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
&:after {
|
||||||
|
transform: translateY(2px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user