TheSunIsLeaking/recflare
3
0
Fork 0
mirror of https://github.com/djdevin/recflare.git synced 2026-09-08 22:51:30 -07:00
Code Issues Packages Projects Releases Wiki Activity

blur bg image

Browse Source
This commit is contained in:
Devin Zuczek
2026-07-24 23:12:15 -04:00
parent beed8451d4
commit d5e3d3946e
1 changed files with 10 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/www/src/client/styles.css
+10 -3
View File
@@ -177,6 +177,10 @@ body {
height: 100%; height: 100%;
object-fit: cover; object-fit: cover;
z-index: -2; z-index: -2;
/* Softened so the headline reads over any screenshot. Scaled up past the frame
because blur samples past the edges and would otherwise feather them. */
filter: blur(5px) saturate(1.08);
transform: scale(1.06);
animation: photo-in 0.7s ease; animation: photo-in 0.7s ease;
} }
@@ -195,9 +199,8 @@ body {
background: linear-gradient( background: linear-gradient(
to top, to top,
rgb(10 7 4 / 90%) 0%, rgb(10 7 4 / 90%) 0%,
rgb(10 7 4 / 64%) 30%, rgb(10 7 4 / 74%) 40%,
rgb(10 7 4 / 16%) 62%, rgb(10 7 4 / 44%) 100%
rgb(10 7 4 / 26%) 100%
); );
} }
@@ -218,6 +221,9 @@ body {
margin: 0 0 20px; margin: 0 0 20px;
max-width: 15ch; max-width: 15ch;
text-wrap: balance; text-wrap: balance;
/* Bloom: a wide, soft shadow rather than a hard one, so it separates the type from
a bright screenshot without reading as a drop shadow. */
text-shadow: 0 2px 30px rgb(8 5 2 / 55%);
} }
/* The one place the orange carries meaning in the headline: the year it restores. */ /* The one place the orange carries meaning in the headline: the year it restores. */
@@ -239,6 +245,7 @@ body {
padding: 0 20px 22px; padding: 0 20px 22px;
font-size: 0.8rem; font-size: 0.8rem;
color: rgb(255 255 255 / 72%); color: rgb(255 255 255 / 72%);
text-shadow: 0 1px 12px rgb(8 5 2 / 60%);
} }
/* The dots are the only way to steer the stage, so each one gets a 24px target /* The dots are the only way to steer the stage, so each one gets a 24px target