/**
* App icons as SVG data URLs for the Mana ecosystem
* These can be used directly as image src or CSS background-image
*/
// Helper to convert SVG string to data URL
const svgToDataUrl = (svg: string): string => {
const encoded = encodeURIComponent(svg).replace(/'/g, '%27').replace(/"/g, '%22');
return `data:image/svg+xml,${encoded}`;
};
// Memoro icon SVG
const memoroSvg = ``;
// Mana icon (single droplet)
const manaSvg = ``;
// ManaChat icon (simplified chat bubble with gradient)
const chatSvg = ``;
// Presi icon (presentation/slides icon with gradient)
const presiSvg = ``;
// Cards icon (cards/flashcards with gradient)
const cardsSvg = ``;
// Picture icon (image/gallery with gradient)
const pictureSvg = ``;
// Quotes icon (quote/inspiration with gradient)
const quotesSvg = ``;
// WiseKeep icon (wisdom/lightbulb with gradient)
const wisekeepSvg = ``;
// Moodlit icon (colorful gradient circle)
const moodlitSvg = ``;
// Food icon (nutrition/heart with gradient)
const foodSvg = ``;
// Contacts icon (address book/person with gradient)
const contactsSvg = ``;
// Calendar icon (calendar with gradient)
const calendarSvg = ``;
// Storage icon (cloud storage with gradient)
const storageSvg = ``;
// Clock icon (analog clock with gradient)
const clockSvg = ``;
// Todo icon (checkbox/task list with gradient)
const todoSvg = ``;
// Mail icon (envelope with gradient)
const mailSvg = ``;
// Inventory icon (box/package with gradient)
const inventorySvg = ``;
// Questions icon (question mark with magnifying glass)
const questionsSvg = ``;
// CityCorners icon (map pin with blue gradient)
const citycornersSvg = ``;
// Taktik icon (clock with play button, amber gradient)
const timesSvg = ``;
// Calc icon (calculator with pink gradient)
const calcSvg = ``;
// Context icon (document/knowledge with sky blue gradient)
const contextSvg = ``;
// Comic icon — speech bubble with a lightning-bolt panel marker on
// orange→red gradient. Sits warm between Picture (green) and Wardrobe
// (rose) so the Mana launcher reads as a coherent creative family.
const comicSvg = ``;
// Wardrobe icon — T-shirt on hanger with rose-violet gradient.
// Rose/violet to sit between Picture (green) and Calc (pink) without
// clashing; the hanger loop sits on the shoulder line so the silhouette
// reads as "clothing" at any scale.
const wardrobeSvg = ``;
// Augur icon — open eye with a small star in the iris and three drifting
// dots ("signs in the air") on indigo→violet gradient. Sits in the cosmic
// family next to Dreams (indigo) and Cards (violet) so the launcher reads
// as "the seeing/oracular cluster". The eye is symmetric and abstract on
// purpose: not a religious or zodiac symbol, just "watch".
const augurSvg = ``;
/**
* App icons as data URLs
* Use these directly in or CSS background-image
*/
export const APP_ICONS = {
memoro: svgToDataUrl(memoroSvg),
mana: svgToDataUrl(manaSvg),
chat: svgToDataUrl(chatSvg),
presi: svgToDataUrl(presiSvg),
cards: svgToDataUrl(cardsSvg),
quiz: svgToDataUrl(
// Speech-bubble question mark with a small checkmark — quiz / answer.
// Pink→fuchsia gradient to stand apart from the purple Cards icon.
``
),
picture: svgToDataUrl(pictureSvg),
quotes: svgToDataUrl(quotesSvg),
wisekeep: svgToDataUrl(wisekeepSvg),
moodlit: svgToDataUrl(moodlitSvg),
food: svgToDataUrl(foodSvg),
contacts: svgToDataUrl(contactsSvg),
calendar: svgToDataUrl(calendarSvg),
storage: svgToDataUrl(storageSvg),
clock: svgToDataUrl(clockSvg),
todo: svgToDataUrl(todoSvg),
mail: svgToDataUrl(mailSvg),
inventory: svgToDataUrl(inventorySvg),
wardrobe: svgToDataUrl(wardrobeSvg),
comic: svgToDataUrl(comicSvg),
augur: svgToDataUrl(augurSvg),
questions: svgToDataUrl(questionsSvg),
context: svgToDataUrl(contextSvg),
citycorners: svgToDataUrl(citycornersSvg),
times: svgToDataUrl(timesSvg),
calc: svgToDataUrl(calcSvg),
uload: svgToDataUrl(
``
),
news: svgToDataUrl(
``
),
'news-research': svgToDataUrl(
``
),
'research-lab': svgToDataUrl(
``
),
guides: svgToDataUrl(
``
),
music: svgToDataUrl(
``
),
photos: svgToDataUrl(
``
),
plants: svgToDataUrl(
``
),
skilltree: svgToDataUrl(
``
),
habits: svgToDataUrl(
``
),
journal: svgToDataUrl(
``
),
notes: svgToDataUrl(
``
),
dreams: svgToDataUrl(
``
),
period: svgToDataUrl(
``
),
finance: svgToDataUrl(
``
),
places: svgToDataUrl(
``
),
arcade: svgToDataUrl(
``
),
events: svgToDataUrl(
``
),
body: svgToDataUrl(
// Dumbbell + heart-pulse hybrid: training (barbell) + body (pulse line).
// Red→orange gradient to set it apart from the green health-adjacent
// modules (plants, food) and the pink period icon.
``
),
firsts: svgToDataUrl(
// Sparkle/star burst — represents a special "first time" moment.
// Warm amber→rose gradient to evoke excitement and novelty.
``
),
lasts: svgToDataUrl(
// Hourglass with a single falling grain — the moment something
// passes for the last time. Indigo→slate gradient for the
// contemplative, retrospective tone (mirror to firsts' warm amber).
``
),
drink: svgToDataUrl(
// Water drop + glass — represents beverage tracking.
// Blue→cyan gradient for the hydration theme.
``
),
who: svgToDataUrl(
// Theatre mask silhouette in front of a question mark — references
// the "guess who's behind the disguise" mechanic. Purple gradient.
``
),
recipes: svgToDataUrl(
// Cooking pot with steam — represents recipe collection.
// Orange→amber gradient for a warm kitchen feel.
``
),
stretch: svgToDataUrl(
// Person in a stretch pose — represents guided stretching / flexibility.
// Emerald→teal gradient for the health/wellness theme.
``
),
meditate: svgToDataUrl(
// Person in lotus meditation pose with radiating calm.
// Violet→indigo gradient for the mindfulness/calm theme.
``
),
sleep: svgToDataUrl(
// Moon with stars — represents sleep / night time.
// Indigo→purple gradient for the nighttime/rest theme.
``
),
mood: svgToDataUrl(
// Smiley face — represents mood/emotion tracking.
// Warm amber→rose gradient for the emotional/feelings theme.
``
),
// ── Companion Brain ─────────────────────────────────
myday: svgToDataUrl(
``
),
activity: svgToDataUrl(
``
),
companion: svgToDataUrl(
``
),
goals: svgToDataUrl(
``
),
wetter: svgToDataUrl(
// Sun partially behind cloud with rain drops — weather / forecast.
// Sky-blue gradient for the weather theme.
``
),
library: svgToDataUrl(
// Stack of books (left) + a book with a spine/pages motif (right) — the
// "Bibliothek" theme covering books/movies/series/comics. Purple→fuchsia
// gradient sits next to music/photos/picture in the Kreativität & Medien row.
``
),
articles: svgToDataUrl(
// Bookmark ribbon tucked into a folded document corner — "Für später
// gemerkt". Orange→amber gradient sets it apart from news (emerald)
// and news-research (cyan) in the Wissen & Recherche row.
``
),
writing: svgToDataUrl(
// Fountain-pen nib writing on a lined sheet — the "Ghostwriter"
// theme. Sky→cyan gradient sits next to chat (sky) and storage
// (blue) without clashing, while standing apart from articles
// (orange) and library (purple) in the text/media family.
``
),
invoices: svgToDataUrl(
// Document with a QR-code corner (CH QR-Bill) + a diagonal amount line.
// Emerald→teal sits next to finance green in the Arbeit & Finanzen row.
``
),
broadcast: svgToDataUrl(
// Megaphone / loudspeaker with three radiating sound arcs.
// Indigo→cyan gradient sets it apart from mail (blue) and invoices
// (emerald) while staying in the "communication" colour family.
``
),
agents: svgToDataUrl(
// Smiling robot head with antenna dot — represents the AI agents that
// carry out autonomous missions. Violet→fuchsia gradient sits next to
// companion in the AI Workbench family.
``
),
timeline: svgToDataUrl(
// Vertical event-dots with connecting line — timeline/history axis.
// Amber→orange gradient so it stands apart from the blue Activity icon
// while still reading as "chronological" in the AI Workbench family.
``
),
website: svgToDataUrl(
// Browser window with three stacked content blocks — the "Baukasten"
// theme. Indigo→violet gradient, sibling to broadcast (communication
// family) but leaning more towards the creative-publishing cluster.
``
),
spaces: svgToDataUrl(
// Three people-silhouettes clustered in the tile — the Spaces primitive
// is about shared workspaces, so the icon emphasises "group". Teal→indigo
// gradient sits next to contacts (green) and chat (indigo) in the
// communication family without competing with either.
``
),
} as const;
export type AppIconId = keyof typeof APP_ICONS;