gitea/valuecards
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

branding added

Browse Source
This commit is contained in:
davmar
2026-09-18 00:16:49 +02:00
parent 78fd23f69f
commit c1bb355986
32 changed files with 342 additions and 287 deletions
Download Patch File Download Diff File Expand all files Collapse all files
stitch/manifest.json
+12
View File
@@ -106,5 +106,17 @@
"deviceType": "MOBILE",
"htmlFile": "practice-hub.html",
"screenshotFile": "practice-hub.png"
},
{
"id": "2ff051bf1fe5482699a5f1bb9a5e980d",
"slug": "app-icon",
"title": "Values Compass App Icon (Values Top / Compass Bottom)",
"width": "512",
"height": "512",
"deviceType": "ICON",
"htmlFile": "app-icon.svg",
"screenshotFile": "app-icon.png",
"htmlBytes": 6549,
"screenshotBytes": 85489
}
]
stitch/screens/app-icon.html
+125
View File
@@ -0,0 +1,125 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="100%" height="100%">
<defs>
<!-- Background subtle gradient: warm linen into soft stone -->
<linearGradient id="bgGrad" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" stop-color="#FAF6F0"/>
<stop offset="100%" stop-color="#EFE9DE"/>
</linearGradient>
<!-- Card 1 (back) -->
<linearGradient id="cardBackGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#E8E0D2"/>
<stop offset="100%" stop-color="#DDD3C3"/>
</linearGradient>
<!-- Card 2 (middle) -->
<linearGradient id="cardMidGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#F4EFE6"/>
<stop offset="100%" stop-color="#E5DDD0"/>
</linearGradient>
<!-- Card 3 (front/core anchor) -->
<linearGradient id="cardFrontGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#FFFFFF"/>
<stop offset="100%" stop-color="#FAF7F1"/>
</linearGradient>
<!-- Gold / Warm Taupe Compass Accent -->
<linearGradient id="goldAccent" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#C4975E"/>
<stop offset="50%" stop-color="#7D6B58"/>
<stop offset="100%" stop-color="#5E4E3E"/>
</linearGradient>
<!-- Drop Shadows -->
<filter id="shadowBack" x="-20%" y="-20%" width="140%" height="140%">
<feDropShadow dx="0" dy="5" stdDeviation="7" flood-color="#4A3F35" flood-opacity="0.08"/>
</filter>
<filter id="shadowMid" x="-20%" y="-20%" width="140%" height="140%">
<feDropShadow dx="0" dy="8" stdDeviation="10" flood-color="#4A3F35" flood-opacity="0.09"/>
</filter>
<filter id="shadowFront" x="-25%" y="-20%" width="150%" height="150%">
<feDropShadow dx="0" dy="12" stdDeviation="14" flood-color="#4A3F35" flood-opacity="0.12"/>
</filter>
<filter id="glowCenter" x="-30%" y="-30%" width="160%" height="160%">
<feDropShadow dx="0" dy="2" stdDeviation="4" flood-color="#C4975E" flood-opacity="0.25"/>
</filter>
</defs>
<!-- Squircle Base Container for App Icon -->
<rect width="512" height="512" rx="116" fill="url(#bgGrad)"/>
<!-- Subtle tactile border -->
<rect width="508" height="508" x="2" y="2" rx="114" fill="none" stroke="#FFFFFF" stroke-width="2.5" stroke-opacity="0.7"/>
<rect width="510" height="510" x="1" y="1" rx="115" fill="none" stroke="#D8CEBF" stroke-width="1" stroke-opacity="0.35"/>
<!-- TOP TEXT: "Values" in even bigger font -->
<text x="256" y="96" font-family="'Newsreader', 'Georgia', serif" font-size="46" font-weight="700" fill="#2E241C" text-anchor="middle" letter-spacing="1.2">Values</text>
<!-- CENTER DECK: Layered Cards (Vertically centered between y=120 and y=390, centered at y=255) -->
<!-- BACK CARD -->
<g transform="translate(256, 255) rotate(-9) translate(-256, -255)" filter="url(#shadowBack)">
<rect x="168" y="148" width="176" height="214" rx="24" fill="url(#cardBackGrad)" stroke="#D0C5B4" stroke-width="1.5"/>
<line x1="198" y1="180" x2="252" y2="180" stroke="#B8AC9B" stroke-width="3" stroke-linecap="round" opacity="0.6"/>
</g>
<!-- MIDDLE CARD -->
<g transform="translate(256, 255) rotate(7) translate(-256, -255)" filter="url(#shadowMid)">
<rect x="168" y="148" width="176" height="214" rx="24" fill="url(#cardMidGrad)" stroke="#E0D7C9" stroke-width="1.5"/>
<line x1="198" y1="180" x2="270" y2="180" stroke="#A89B8A" stroke-width="3" stroke-linecap="round" opacity="0.6"/>
</g>
<!-- FRONT CARD -->
<g filter="url(#shadowFront)">
<!-- Primary Card Body -->
<rect x="168" y="142" width="176" height="226" rx="24" fill="url(#cardFrontGrad)" stroke="#ECE4D8" stroke-width="1.5"/>
<!-- Inset border line for tactile editorial paper texture -->
<rect x="178" y="152" width="156" height="206" rx="18" fill="none" stroke="#7D6B58" stroke-width="1" stroke-opacity="0.12" stroke-dasharray="3 3"/>
<!-- Pill indicator -->
<rect x="238" y="163" width="36" height="3" rx="1.5" fill="#7D6B58" fill-opacity="0.25"/>
<!-- CENTER EMBLEM: Compass / North Star Icon -->
<g transform="translate(256, 252)">
<!-- Outer delicate concentric aura circles -->
<circle cx="0" cy="0" r="48" fill="none" stroke="#7D6B58" stroke-opacity="0.1" stroke-width="1"/>
<circle cx="0" cy="0" r="37" fill="#FAF6F0" stroke="#7D6B58" stroke-opacity="0.18" stroke-width="1.2"/>
<!-- 4 cardinal tick marks -->
<line x1="0" y1="-43" x2="0" y2="-39" stroke="#7D6B58" stroke-width="1.5" stroke-linecap="round" opacity="0.5"/>
<line x1="0" y1="39" x2="0" y2="43" stroke="#7D6B58" stroke-width="1.5" stroke-linecap="round" opacity="0.5"/>
<line x1="-43" y1="0" x2="-39" y2="0" stroke="#7D6B58" stroke-width="1.5" stroke-linecap="round" opacity="0.5"/>
<line x1="39" y1="0" x2="43" y2="0" stroke="#7D6B58" stroke-width="1.5" stroke-linecap="round" opacity="0.5"/>
<!-- 8-Pointed Mindfulness Star / Compass Star of Core Values -->
<!-- North Point -->
<path d="M 0,0 L -6,-11 L 0,-33 L 6,-11 Z" fill="url(#goldAccent)" filter="url(#glowCenter)"/>
<!-- South Point -->
<path d="M 0,0 L -6,11 L 0,33 L 6,11 Z" fill="#7D6B58"/>
<!-- East Point -->
<path d="M 0,0 L 11,-6 L 33,0 L 11,6 Z" fill="#8C7965"/>
<!-- West Point -->
<path d="M 0,0 L -11,-6 L -33,0 L -11,6 Z" fill="#6F5E4E"/>
<!-- Diagonal Secondary Petals -->
<path d="M 0,0 L 4,-8 L 16,-16 L 8,-4 Z" fill="#A48C74" opacity="0.85"/>
<path d="M 0,0 L -4,-8 L -16,-16 L -8,-4 Z" fill="#917A63" opacity="0.85"/>
<path d="M 0,0 L 4,8 L 16,16 L 8,4 Z" fill="#786552" opacity="0.85"/>
<path d="M 0,0 L -4,8 L -16,16 L -8,4 Z" fill="#6A5846" opacity="0.85"/>
<!-- Center Stillness Core -->
<circle cx="0" cy="0" r="6" fill="#FAF6F0" stroke="#7D6B58" stroke-width="1.8"/>
<circle cx="0" cy="0" r="2.8" fill="#C4975E"/>
</g>
<!-- Three grounded dots at bottom of card -->
<g transform="translate(256, 332)">
<circle cx="-13" cy="0" r="2.4" fill="#7D6B58" opacity="0.25"/>
<circle cx="0" cy="0" r="2.8" fill="#C4975E" opacity="0.8"/>
<circle cx="13" cy="0" r="2.4" fill="#7D6B58" opacity="0.25"/>
</g>
</g>
<!-- BOTTOM TEXT: "Compass" in even bigger font -->
<text x="256" y="445" font-family="'Newsreader', 'Georgia', serif" font-size="46" font-weight="700" fill="#2E241C" text-anchor="middle" letter-spacing="1.2">Compass</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 6.4 KiB

stitch/screens/app-icon.json
+15
View File
@@ -0,0 +1,15 @@
{
"name": "projects/9343387512370733994/screens/2ff051bf1fe5482699a5f1bb9a5e980d",
"title": "Values Compass App Icon (Values Top / Compass Bottom)",
"screenshot": {
"name": "projects/9343387512370733994/screens/37733e82516730535cc8c45d50f9c83977990ea75683fd3b9c5aae43deb599ac/fileEntries/screenshot",
"downloadUrl": "https://lh3.googleusercontent.com/aida/AEtjO1V7dhzWlGzADkZJ8s9ld_l4GvEdZrbr95uqltFAiNz4A3amMuVlieFKXgEeSbXi9JXw5EKVu9kizHY2o62tAWpZ81-RddVCw_8KXWcvWjEwOxPzALUFySqbtXkuW2ghbCe9-Ne-L9KTjubvBLv9MSOaPyEpIKNrbfqlh53CoYtCc9g1UunfdGYMPYXefoJ6BHDS2eERw2Y1JZdS5lW-s65D_qWCwZ4zBjMaDa66GOcTexVMKFo7DA-kt4s"
},
"htmlCode": {
"name": "projects/9343387512370733994/screens/2ff051bf1fe5482699a5f1bb9a5e980d/fileEntries/html",
"downloadUrl": "https://contribution.usercontent.google.com/download?c=CgthaWRhX2NvZGVmeBJ7Eh1hcHBfY29tcGFuaW9uX2dlbmVyYXRlZF9maWxlcxpaCiVodG1sXzAwMDY1YmI1MTMzNzJjM2YwNDRmNDUwZGQ3M2RhNGY3EgsSBxD_iY311x0YAZIBIwoKcHJvamVjdF9pZBIVQhM5MzQzMzg3NTEyMzcwNzMzOTk0&filename=&opi=89354086",
"mimeType": "image/svg+xml"
},
"width": "512",
"height": "512"
}
stitch/screens/app-icon.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 84 KiB

stitch/screens/app-icon.svg
+125
View File
@@ -0,0 +1,125 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="100%" height="100%">
<defs>
<!-- Background subtle gradient: warm linen into soft stone -->
<linearGradient id="bgGrad" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" stop-color="#FAF6F0"/>
<stop offset="100%" stop-color="#EFE9DE"/>
</linearGradient>
<!-- Card 1 (back) -->
<linearGradient id="cardBackGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#E8E0D2"/>
<stop offset="100%" stop-color="#DDD3C3"/>
</linearGradient>
<!-- Card 2 (middle) -->
<linearGradient id="cardMidGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#F4EFE6"/>
<stop offset="100%" stop-color="#E5DDD0"/>
</linearGradient>
<!-- Card 3 (front/core anchor) -->
<linearGradient id="cardFrontGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#FFFFFF"/>
<stop offset="100%" stop-color="#FAF7F1"/>
</linearGradient>
<!-- Gold / Warm Taupe Compass Accent -->
<linearGradient id="goldAccent" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#C4975E"/>
<stop offset="50%" stop-color="#7D6B58"/>
<stop offset="100%" stop-color="#5E4E3E"/>
</linearGradient>
<!-- Drop Shadows -->
<filter id="shadowBack" x="-20%" y="-20%" width="140%" height="140%">
<feDropShadow dx="0" dy="5" stdDeviation="7" flood-color="#4A3F35" flood-opacity="0.08"/>
</filter>
<filter id="shadowMid" x="-20%" y="-20%" width="140%" height="140%">
<feDropShadow dx="0" dy="8" stdDeviation="10" flood-color="#4A3F35" flood-opacity="0.09"/>
</filter>
<filter id="shadowFront" x="-25%" y="-20%" width="150%" height="150%">
<feDropShadow dx="0" dy="12" stdDeviation="14" flood-color="#4A3F35" flood-opacity="0.12"/>
</filter>
<filter id="glowCenter" x="-30%" y="-30%" width="160%" height="160%">
<feDropShadow dx="0" dy="2" stdDeviation="4" flood-color="#C4975E" flood-opacity="0.25"/>
</filter>
</defs>
<!-- Squircle Base Container for App Icon -->
<rect width="512" height="512" rx="116" fill="url(#bgGrad)"/>
<!-- Subtle tactile border -->
<rect width="508" height="508" x="2" y="2" rx="114" fill="none" stroke="#FFFFFF" stroke-width="2.5" stroke-opacity="0.7"/>
<rect width="510" height="510" x="1" y="1" rx="115" fill="none" stroke="#D8CEBF" stroke-width="1" stroke-opacity="0.35"/>
<!-- TOP TEXT: "Values" in even bigger font -->
<text x="256" y="96" font-family="'Newsreader', 'Georgia', serif" font-size="46" font-weight="700" fill="#2E241C" text-anchor="middle" letter-spacing="1.2">Values</text>
<!-- CENTER DECK: Layered Cards (Vertically centered between y=120 and y=390, centered at y=255) -->
<!-- BACK CARD -->
<g transform="translate(256, 255) rotate(-9) translate(-256, -255)" filter="url(#shadowBack)">
<rect x="168" y="148" width="176" height="214" rx="24" fill="url(#cardBackGrad)" stroke="#D0C5B4" stroke-width="1.5"/>
<line x1="198" y1="180" x2="252" y2="180" stroke="#B8AC9B" stroke-width="3" stroke-linecap="round" opacity="0.6"/>
</g>
<!-- MIDDLE CARD -->
<g transform="translate(256, 255) rotate(7) translate(-256, -255)" filter="url(#shadowMid)">
<rect x="168" y="148" width="176" height="214" rx="24" fill="url(#cardMidGrad)" stroke="#E0D7C9" stroke-width="1.5"/>
<line x1="198" y1="180" x2="270" y2="180" stroke="#A89B8A" stroke-width="3" stroke-linecap="round" opacity="0.6"/>
</g>
<!-- FRONT CARD -->
<g filter="url(#shadowFront)">
<!-- Primary Card Body -->
<rect x="168" y="142" width="176" height="226" rx="24" fill="url(#cardFrontGrad)" stroke="#ECE4D8" stroke-width="1.5"/>
<!-- Inset border line for tactile editorial paper texture -->
<rect x="178" y="152" width="156" height="206" rx="18" fill="none" stroke="#7D6B58" stroke-width="1" stroke-opacity="0.12" stroke-dasharray="3 3"/>
<!-- Pill indicator -->
<rect x="238" y="163" width="36" height="3" rx="1.5" fill="#7D6B58" fill-opacity="0.25"/>
<!-- CENTER EMBLEM: Compass / North Star Icon -->
<g transform="translate(256, 252)">
<!-- Outer delicate concentric aura circles -->
<circle cx="0" cy="0" r="48" fill="none" stroke="#7D6B58" stroke-opacity="0.1" stroke-width="1"/>
<circle cx="0" cy="0" r="37" fill="#FAF6F0" stroke="#7D6B58" stroke-opacity="0.18" stroke-width="1.2"/>
<!-- 4 cardinal tick marks -->
<line x1="0" y1="-43" x2="0" y2="-39" stroke="#7D6B58" stroke-width="1.5" stroke-linecap="round" opacity="0.5"/>
<line x1="0" y1="39" x2="0" y2="43" stroke="#7D6B58" stroke-width="1.5" stroke-linecap="round" opacity="0.5"/>
<line x1="-43" y1="0" x2="-39" y2="0" stroke="#7D6B58" stroke-width="1.5" stroke-linecap="round" opacity="0.5"/>
<line x1="39" y1="0" x2="43" y2="0" stroke="#7D6B58" stroke-width="1.5" stroke-linecap="round" opacity="0.5"/>
<!-- 8-Pointed Mindfulness Star / Compass Star of Core Values -->
<!-- North Point -->
<path d="M 0,0 L -6,-11 L 0,-33 L 6,-11 Z" fill="url(#goldAccent)" filter="url(#glowCenter)"/>
<!-- South Point -->
<path d="M 0,0 L -6,11 L 0,33 L 6,11 Z" fill="#7D6B58"/>
<!-- East Point -->
<path d="M 0,0 L 11,-6 L 33,0 L 11,6 Z" fill="#8C7965"/>
<!-- West Point -->
<path d="M 0,0 L -11,-6 L -33,0 L -11,6 Z" fill="#6F5E4E"/>
<!-- Diagonal Secondary Petals -->
<path d="M 0,0 L 4,-8 L 16,-16 L 8,-4 Z" fill="#A48C74" opacity="0.85"/>
<path d="M 0,0 L -4,-8 L -16,-16 L -8,-4 Z" fill="#917A63" opacity="0.85"/>
<path d="M 0,0 L 4,8 L 16,16 L 8,4 Z" fill="#786552" opacity="0.85"/>
<path d="M 0,0 L -4,8 L -16,16 L -8,4 Z" fill="#6A5846" opacity="0.85"/>
<!-- Center Stillness Core -->
<circle cx="0" cy="0" r="6" fill="#FAF6F0" stroke="#7D6B58" stroke-width="1.8"/>
<circle cx="0" cy="0" r="2.8" fill="#C4975E"/>
</g>
<!-- Three grounded dots at bottom of card -->
<g transform="translate(256, 332)">
<circle cx="-13" cy="0" r="2.4" fill="#7D6B58" opacity="0.25"/>
<circle cx="0" cy="0" r="2.8" fill="#C4975E" opacity="0.8"/>
<circle cx="13" cy="0" r="2.4" fill="#7D6B58" opacity="0.25"/>
</g>
</g>
<!-- BOTTOM TEXT: "Compass" in even bigger font -->
<text x="256" y="445" font-family="'Newsreader', 'Georgia', serif" font-size="46" font-weight="700" fill="#2E241C" text-anchor="middle" letter-spacing="1.2">Compass</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 6.4 KiB