jeffemmett
/
cineasthesia-landing
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Use AI-generated botanical textures for leaf backgrounds 

Replace invisible SVG patterns with real leaf texture images:
- leaves-green.png: transparent monstera/fern/vine pattern for
  light sections (Projects)
- leaves-gold.png: gold botanical line art on black for dark
  sections (Design Science Studio)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Jeff Emmett 2026-03-19 17:10:14 -07:00
parent 89b0bf09c7
commit 14c70d4eab
3 changed files with 6 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/img/leaves-gold.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 MiB

BIN
public/img/leaves-green.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 954 KiB

12
public/index.html
View File

@ -218,15 +218,15 @@
inset: 0;
z-index: 0;
pointer-events: none;
opacity: 0.08;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300' viewBox='0 0 300 300'%3E%3Cg fill='%234A6741' stroke='%234A6741' stroke-width='0.8'%3E%3Cpath d='M60 30 C80 10 110 15 115 45 C120 75 100 110 80 120 C60 130 42 110 45 85 C47 65 50 45 60 30Z' fill-opacity='0.6'/%3E%3Cpath d='M60 30 C70 55 75 85 78 115' stroke-width='1' fill='none'/%3E%3Cpath d='M70 50 C82 44 90 50' fill='none'/%3E%3Cpath d='M73 70 C86 66 95 73' fill='none'/%3E%3Cpath d='M72 90 C85 88 92 95' fill='none'/%3E%3Cpath d='M66 60 C54 55 48 60' fill='none'/%3E%3Cpath d='M68 80 C56 76 50 82' fill='none'/%3E%3Cpath d='M220 20 C222 50 218 90 210 140' stroke-width='1.2' fill='none'/%3E%3Cpath d='M220 40 C235 32 240 40 230 48' fill-opacity='0.5'/%3E%3Cpath d='M218 58 C233 50 238 58 228 66' fill-opacity='0.5'/%3E%3Cpath d='M216 76 C231 68 236 76 226 84' fill-opacity='0.45'/%3E%3Cpath d='M214 94 C229 86 234 94 224 102' fill-opacity='0.4'/%3E%3Cpath d='M212 112 C227 104 232 112 222 120' fill-opacity='0.35'/%3E%3Cpath d='M218 58 C203 50 198 58 208 66' fill-opacity='0.5'/%3E%3Cpath d='M216 76 C201 68 196 76 206 84' fill-opacity='0.45'/%3E%3Cpath d='M214 94 C199 86 194 94 204 102' fill-opacity='0.4'/%3E%3Cpath d='M150 200 C165 175 190 178 185 205 C180 232 155 235 150 210Z' fill-opacity='0.5'/%3E%3Cpath d='M150 200 C162 210 170 220' stroke-width='0.8' fill='none'/%3E%3Cpath d='M250 180 C265 160 278 165 270 185 C262 205 245 200 250 180Z' fill-opacity='0.35'/%3E%3Cpath d='M250 180 C260 190 265 198' fill='none'/%3E%3Cpath d='M40 230 C55 210 68 215 60 235 C52 255 35 250 40 230Z' fill-opacity='0.3'/%3E%3C/g%3E%3C/svg%3E");
background-size: 300px 300px;
opacity: 0.12;
background-image: url('img/leaves-green.png');
background-size: 600px;
}
.leafy-bg-dark::before {
opacity: 0.12;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300' viewBox='0 0 300 300'%3E%3Cg fill='%23C68B3F' stroke='%23C68B3F' stroke-width='0.8'%3E%3Cpath d='M60 30 C80 10 110 15 115 45 C120 75 100 110 80 120 C60 130 42 110 45 85 C47 65 50 45 60 30Z' fill-opacity='0.5'/%3E%3Cpath d='M60 30 C70 55 75 85 78 115' stroke-width='1' fill='none'/%3E%3Cpath d='M70 50 C82 44 90 50' fill='none'/%3E%3Cpath d='M73 70 C86 66 95 73' fill='none'/%3E%3Cpath d='M72 90 C85 88 92 95' fill='none'/%3E%3Cpath d='M220 20 C222 50 218 90 210 140' stroke-width='1.2' fill='none'/%3E%3Cpath d='M220 40 C235 32 240 40 230 48' fill-opacity='0.45'/%3E%3Cpath d='M218 58 C233 50 238 58 228 66' fill-opacity='0.45'/%3E%3Cpath d='M216 76 C231 68 236 76 226 84' fill-opacity='0.4'/%3E%3Cpath d='M214 94 C229 86 234 94 224 102' fill-opacity='0.35'/%3E%3Cpath d='M218 58 C203 50 198 58 208 66' fill-opacity='0.45'/%3E%3Cpath d='M216 76 C201 68 196 76 206 84' fill-opacity='0.4'/%3E%3Cpath d='M150 200 C165 175 190 178 185 205 C180 232 155 235 150 210Z' fill-opacity='0.4'/%3E%3Cpath d='M250 180 C265 160 278 165 270 185 C262 205 245 200 250 180Z' fill-opacity='0.3'/%3E%3C/g%3E%3C/svg%3E");
background-size: 300px 300px;
opacity: 0.15;
background-image: url('img/leaves-gold.png');
background-size: 600px;
}
/* PROJECT CARDS */