krispire/spsays-training
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

post cards overlay enhancements

Browse Source
This commit is contained in:
gosangam
2026-06-02 15:02:17 +05:30
parent e72679d1b6
commit 4d45e20cb1
2 changed files with 8 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/social/collection-scroll-card.tsx
+4 -1
View File
@@ -222,7 +222,10 @@ function CoverSlide({
className="object-cover" className="object-cover"
unoptimized unoptimized
/> />
<div className="absolute inset-0 bg-gradient-to-t from-black/85 via-black/40 to-black/10" /> {/* Heavier overlay — title + description sit over the bottom
two-thirds, so we push the via stop to 65% and bump the
base opacity for stronger contrast. */}
<div className="absolute inset-0 bg-gradient-to-t from-black/95 via-black/65 via-65% to-black/20" />
</> </>
) : ( ) : (
<div className="absolute inset-0" style={quoteCardBgStyle()} /> <div className="absolute inset-0" style={quoteCardBgStyle()} />
components/social/post-grid-card.tsx
+4 -2
View File
@@ -73,8 +73,10 @@ export function PostGridCard({
unoptimized unoptimized
/> />
{/* Bottom-up gradient for caption legibility — keeps the image {/* Bottom-up gradient for caption legibility — keeps the image
visible up top while text sits over solid darkness below. */} visible up top while text sits over solid darkness below.
<div className="absolute inset-0 bg-gradient-to-t from-black/80 via-black/40 to-transparent" /> Stronger base + via stop pushed to 65% so roughly two-thirds
of the card is in the dark zone. */}
<div className="absolute inset-0 bg-gradient-to-t from-black/95 via-black/65 via-65% to-transparent" />
</> </>
) : ( ) : (
<div className="absolute inset-0" style={quoteCardBgStyle()} /> <div className="absolute inset-0" style={quoteCardBgStyle()} />