mirror of
https://github.com/remvze/moodist.git
synced 2025-12-17 00:44:14 +00:00
feat: add shine effect
This commit is contained in:
parent
3feb9c1a09
commit
d9df0d4b2c
2 changed files with 15 additions and 1 deletions
|
|
@ -38,7 +38,7 @@ import { Container } from './container';
|
||||||
background: linear-gradient(
|
background: linear-gradient(
|
||||||
90deg,
|
90deg,
|
||||||
transparent,
|
transparent,
|
||||||
var(--color-neutral-200),
|
var(--color-neutral-400),
|
||||||
transparent
|
transparent
|
||||||
);
|
);
|
||||||
transform: translateX(-50%);
|
transform: translateX(-50%);
|
||||||
|
|
|
||||||
|
|
@ -61,6 +61,20 @@ const count = soundCount();
|
||||||
background-size: 21px 21px;
|
background-size: 21px 21px;
|
||||||
opacity: 0.8;
|
opacity: 0.8;
|
||||||
mask-image: linear-gradient(#fff, transparent, transparent);
|
mask-image: linear-gradient(#fff, transparent, transparent);
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 50%;
|
||||||
|
width: 300px;
|
||||||
|
height: 100px;
|
||||||
|
content: '';
|
||||||
|
background: var(--color-neutral-200);
|
||||||
|
filter: blur(50px);
|
||||||
|
border-radius: 100%;
|
||||||
|
opacity: 0.8;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue