gurix/Zauberwald
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(03): soft radial mask for forest elements and green background prompt

Browse Source 
- CSS radial-gradient mask for organic blending into forest scene
- Generate with light green background instead of transparency (avoids checkerboard)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
gurix
2026-03-29 17:59:47 +02:00
co-authored by Claude Opus 4.6
parent a02948d612
commit e41d71d403
2 changed files with 5 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/forest/reward.ts
+1 -1
View File
@@ -115,7 +115,7 @@ async function generateForestElement(db: IDBDatabase): Promise<{
ELEMENT_TYPES[Math.floor(Math.random() * ELEMENT_TYPES.length)]!;
// Build prompt
const prompt = `Kinderbuch-Illustration, Aquarell-Stil, ${elementType}, magischer Wald, warm, einladend, fuer Kinder, Pastellfarben, kein Text, einzelnes Element auf transparentem Hintergrund`;
const prompt = `Kinderbuch-Illustration, Aquarell-Stil, ${elementType}, magischer Wald, warm, einladend, fuer Kinder, Pastellfarben, kein Text, einfarbig heller gruener Hintergrund`;
// Generate image
const blob = await generateImage(prompt, referenceImages, config);
src/styles/main.css
+4 -2
View File
@@ -417,9 +417,11 @@ h3 {
.forest__element img {
max-width: 100%;
max-height: 100%;
object-fit: contain;
border-radius: 8px;
object-fit: cover;
border-radius: 50%;
filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.15));
mask-image: radial-gradient(ellipse 70% 70% at center, black 50%, transparent 100%);
-webkit-mask-image: radial-gradient(ellipse 70% 70% at center, black 50%, transparent 100%);
}
.forest__element--new {