Give the page background a casino felt texture
CI / Build and push docker image (push) Successful in 59s
CI / Build and push docker image (push) Successful in 59s
Replace the flat radial green with a layered body background: a soft overhead light and an edge vignette over a fine grain tiled across the green gradient. The grain is a tiny seamless SVG tile (feTurbulence fractal noise mapped to semi-transparent black speckles, stitchTiles so it repeats without seams) committed under web/assets, so it rides the existing asset pipeline and works offline; the palette and panel/card colors are unchanged.
This commit is contained in:
+21
-5
@@ -40,11 +40,27 @@
|
||||
body {
|
||||
min-height: 100vh;
|
||||
background-color: var(--felt-dark);
|
||||
background-image: radial-gradient(
|
||||
ellipse at 50% -10%,
|
||||
var(--felt) 0%,
|
||||
var(--felt-dark) 65%
|
||||
);
|
||||
/* Casino-table felt: a fine grain texture tiled over the green
|
||||
* gradient, lit from above and darkened towards the edges. The first
|
||||
* layer is the topmost one. */
|
||||
background-image:
|
||||
radial-gradient(
|
||||
ellipse at 50% 45%,
|
||||
transparent 55%,
|
||||
rgba(0, 0, 0, 0.38) 100%
|
||||
),
|
||||
radial-gradient(
|
||||
ellipse at 50% -10%,
|
||||
rgba(255, 255, 255, 0.07),
|
||||
transparent 60%
|
||||
),
|
||||
url("/assets/felt.svg"),
|
||||
radial-gradient(
|
||||
ellipse at 50% -10%,
|
||||
var(--felt) 0%,
|
||||
var(--felt-dark) 65%
|
||||
);
|
||||
background-repeat: no-repeat, no-repeat, repeat, no-repeat;
|
||||
background-attachment: fixed;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user