mirrors/phanpy
1
0
Fork 0
mirror of https://github.com/cheeaun/phanpy.git synced 2024-11-29 12:48:57 +03:00
Code Issues Projects Releases Packages Wiki Activity

Have a little fun with CSS variables X JS

Browse source
This commit is contained in:
Lim Chee Aun 2023-01-07 20:38:05 +08:00
parent 41df88e625
commit 33176c5ea7
2 changed files with 11 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
src/app.css
View file

@ -494,6 +494,13 @@ a.mention span {
width: 100vw;
height: 100vh;
height: 100dvh;
background-color: var(--average-color-alpha);
background-image: radial-gradient(
closest-side,
var(--average-color) 10%,
var(--average-color-alpha) 40%,
transparent 100%
);
}
.carousel > * :is(img, video) {
width: auto;

6
src/components/status.jsx
View file

@ -1326,8 +1326,10 @@ function Carousel({ mediaAttachments, index = 0, onClose = () => {} }) {
<InView
class="carousel-item"
style={{
backgroundColor:
rgbAverageColor && `rgba(${rgbAverageColor.join(',')}, .5)`,
'--average-color': `rgb(${rgbAverageColor?.join(',')})`,
'--average-color-alpha': `rgba(${rgbAverageColor?.join(
',',
)}, .5)`,
}}
tabindex="0"
key={media.id}