diff --git a/site/assets/css/style.css b/site/assets/css/style.css index 831a32b..9b654fd 100644 --- a/site/assets/css/style.css +++ b/site/assets/css/style.css @@ -480,6 +480,7 @@ section[id] { z-index: -1; border: var(--ring) solid transparent; background: + var(--noise) 0 0 / 140px padding-box, linear-gradient(var(--btn-face), var(--btn-face)) padding-box, conic-gradient(from var(--pc-a), rgba(var(--fitme-accent-rgb), 0) 0deg, rgba(var(--fitme-accent-rgb), 0) 150deg, var(--fitme-accent) 250deg, #f4ff9c 300deg, var(--fitme-accent) 330deg, @@ -4615,3 +4616,19 @@ a:where(:not(.site-btn, .gym-switch-btn, .gal-link, .skip-link, .splide__arrow, @media (prefers-reduced-motion: reduce) { a { transition: none !important; } } + +/* ── Noise texture ───────────────────────────────────────────────────────────── + Buttons: a tiled grey fractal-noise image laid over the face colour (!important + so the hover rules, which reset `background`, don't drop it; the hover face in + ::before carries the same layer). Headings: the #pt-noise SVG filter (defined + in site/includes/include.php) multiplies grain into the lettering only. */ +:root { + --noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E"); +} +.site-btn, +.gym-switch-btn, +.crossfit-nav-link { + background-image: var(--noise) !important; + background-size: 140px 140px !important; +} +h1, h2 { filter: url(#pt-noise); } diff --git a/site/includes/include.php b/site/includes/include.php index b16eacc..27ce692 100644 --- a/site/includes/include.php +++ b/site/includes/include.php @@ -89,4 +89,20 @@ $canonical = $GLOBALS['_canonical_override'] ?? match ($page) {
+ Saltar para o conteúdo