calum/rda-v3
1
0
Fork 0
Code Issues Pull requests 1 Projects Releases Packages Wiki Activity Actions

Improve readability of Support Us card text with frosted panel

Browse source 
Added semi-opaque dark background (rgba 0,0,0,0.48) with blur(4px)
to the text panel on each editorial card so label, heading, body and
CTA are clearly legible regardless of the underlying image.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Calum Muir 2026-04-30 19:54:21 +00:00
parent e37a97a9e1
commit cf5959b461
1 changed files with 2 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/pages/support-us.astro
View file

@ -265,8 +265,8 @@ const faqs = [
loading="lazy" loading="lazy"
decoding="async" decoding="async"
/> />
<div style="position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.3) 55%, rgba(0,0,0,0.1) 100%);" /> <div style="position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0.2) 60%, rgba(0,0,0,0.05) 100%);" />
<div style="position: absolute; bottom: 0; left: 0; right: 0; padding: 28px 28px 34px;"> <div style="position: absolute; bottom: 0; left: 0; right: 0; padding: 28px 28px 34px; background: rgba(0,0,0,0.48); backdrop-filter: blur(4px);">
<p style="font-family: 'Public Sans', sans-serif; font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: #7DA371; margin-bottom: 8px;"> <p style="font-family: 'Public Sans', sans-serif; font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: #7DA371; margin-bottom: 8px;">
{w.label} {w.label}
</p> </p>