49 lines
998 B
SCSS
49 lines
998 B
SCSS
|
@use "@sass-palette/hope-config";
|
||
|
|
|
||
|
|
@mixin shining() {
|
||
|
|
position: relative;
|
||
|
|
overflow: hidden;
|
||
|
|
|
||
|
|
&::before {
|
||
|
|
content: " ";
|
||
|
|
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
bottom: 0;
|
||
|
|
|
||
|
|
width: 300%;
|
||
|
|
height: 300%;
|
||
|
|
|
||
|
|
background: rgb(255 255 255 / 50%);
|
||
|
|
|
||
|
|
transition: transform 0.6s;
|
||
|
|
transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg)
|
||
|
|
translate3d(0, -125%, 0);
|
||
|
|
|
||
|
|
@media print {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
#{hope-config.$dark-selector} & {
|
||
|
|
background: rgb(255 255 255 / 15%);
|
||
|
|
}
|
||
|
|
|
||
|
|
#{hope-config.$rtl-selector} & {
|
||
|
|
transform: scale3d(-1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg)
|
||
|
|
translate3d(0, -125%, 0);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
&:hover {
|
||
|
|
&::before {
|
||
|
|
transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg)
|
||
|
|
translate3d(0, 125%, 0);
|
||
|
|
|
||
|
|
#{hope-config.$rtl-selector} & {
|
||
|
|
transform: scale3d(-1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg)
|
||
|
|
translate3d(0, 125%, 0);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|