muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 04:46:40 +07:00
Code Packages Activity Actions

added dominant color to node swiper block

Browse source
This commit is contained in:
Fedor Katurov 2022-12-05 22:30:40 +06:00
parent 4ded317fd0
commit 15a83b6793
2 changed files with 2 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/components/node/NodeImageSwiperBlock/index.tsx
View file

@ -130,6 +130,7 @@ const NodeImageSwiperBlock: FC<IProps> = observer(({ node }) => {
{images.map((file, i) => ( {images.map((file, i) => (
<SwiperSlide className={styles.slide} key={file.id}> <SwiperSlide className={styles.slide} key={file.id}>
<Image <Image
style={{ backgroundColor: file.metadata?.dominant_color }}
src={getURL(file, ImagePresets['1600'])} src={getURL(file, ImagePresets['1600'])}
width={file.metadata?.width} width={file.metadata?.width}
height={file.metadata?.height} height={file.metadata?.height}

1
src/components/node/NodeImageSwiperBlock/styles.module.scss
View file

@ -122,6 +122,7 @@
border-radius: $radius; border-radius: $radius;
transition: box-shadow 1s; transition: box-shadow 1s;
box-shadow: transparentize(black, 0.7) 0 3px 5px; box-shadow: transparentize(black, 0.7) 0 3px 5px;
background-color: red;
:global(.swiper-slide-active) & { :global(.swiper-slide-active) & {
box-shadow: transparentize(black, 0.9) 0 10px 5px 4px, box-shadow: transparentize(black, 0.9) 0 10px 5px 4px,