Ο Λαβύρινθος της Καρδιάς ✨

\n {gameState === \"PLAYING\" && (\n <>\n

\n Πίστα: {currentLevel + 1} / {LEVELS.length}\n

\n Μάζεψε όλα τα σύμβολα!
\n (Κανόνας: Γέμισε ΟΛΑ τα τετράγωνα με μία γραμμή)\n

\n \n )}\n

\n\n {/* --- Responsive GAME AREA (Grid) --- */}\n \n {grid.map((row, rowIndex) => (\n

\n {row.map((cell, colIndex) => {\n const inPath = isCellInPath(rowIndex, colIndex);\n return (\n \n \n {cell.emoji}\n

\n );\n })}\n \n ))}\n\n {renderPathLine()}\n\n {/* --- ΟΘΟΝΕΣ OVERLAY --- */}\n\n {gameState === \"START\" && (\n

The Love Path 💖

\n Λύσε τους 3 γρίφους{\" \"}\n για να ξεκλειδώσεις το μήνυμα!
\n
\n Σύρε το δάχτυλο για να δημιουργήσεις μια γραμμή.
\n Tip:{\" \"}\n Ξεκίνα από όπου θέλεις. Αν κάνεις λάθος, απλά σύρε το δάχτυλο προς\n τα πίσω για να σβήσεις!\n

\n setGameState(\"PLAYING\")}\n style={styles.button}\n >\n Έναρξη 1ης Πίστας ✨\n \n

\n )}\n\n {gameState === \"LEVEL_CLEARED\" && (\n

Μπράβο! 🌟

\n Έλυσες την Πίστα {currentLevel + 1}. Το πλέγμα τώρα μεγαλώνει...\n

\n loadLevel(currentLevel + 1)}\n style={styles.button}\n >\n Επόμενη Πίστα 🚀\n \n

\n )}\n\n {gameState === \"WON\" && (\n

🎉✨💖🏆✨🎉

{FINAL_LOVE_LETTER.title}

{FINAL_LOVE_LETTER.body}

\n )}\n \n \n );\n}\n\n// --- CSS Styles (In JavaScript) ---\nconst styles: { [key: string]: React.CSSProperties } = {\n page: {\n fontFamily: FONT_FAMILY,\n backgroundColor: \"#fff5f5\",\n minHeight: \"100vh\",\n width: \"100%\",\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"center\",\n justifyContent: \"center\",\n overflow: \"hidden\",\n margin: 0,\n userSelect: \"none\",\n },\n header: { textAlign: \"center\", padding: \"10px\", width: \"100%\" },\n mainTitle: {\n fontSize: \"24px\",\n color: BASE_COLOR,\n margin: \"0 0 10px 0\",\n fontWeight: \"700\",\n },\n levelIndicator: {\n display: \"inline-block\",\n backgroundColor: BASE_COLOR,\n color: \"white\",\n padding: \"5px 15px\",\n borderRadius: \"20px\",\n fontWeight: \"bold\",\n marginBottom: \"10px\",\n },\n subtitle: {\n fontSize: \"14px\",\n color: \"#666\",\n lineHeight: \"1.4\",\n margin: 0,\n fontStyle: \"italic\",\n padding: \"0 10px\",\n },\n\n gameArea: {\n position: \"relative\",\n width: \"90%\",\n maxWidth: \"400px\",\n aspectRatio: \"1\",\n backgroundColor: \"white\",\n boxShadow: \"0 10px 30px rgba(214, 51, 132, 0.15)\",\n borderRadius: \"15px\",\n overflow: \"hidden\",\n touchAction: \"none\",\n display: \"flex\",\n flexDirection: \"column\",\n },\n gridRow: { display: \"flex\", flex: 1 },\n cell: {\n flex: 1,\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n boxSizing: \"border-box\",\n position: \"relative\",\n transition: \"all 0.1s ease-in-out\",\n },\n emoji: {\n fontSize: \"26px\",\n zIndex: 2,\n transition: \"all 0.2s ease-out\",\n },\n\n pathSvg: {\n position: \"absolute\",\n top: 0,\n left: 0,\n width: \"100%\",\n height: \"100%\",\n zIndex: 1,\n pointerEvents: \"none\",\n },\n pathLine: {\n fill: \"none\",\n stroke: BASE_COLOR,\n strokeWidth: \"12\",\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\",\n }, // Ελαφρώς πιο παχιά γραμμή!\n\n overlay: {\n position: \"absolute\",\n top: 0,\n left: 0,\n width: \"100%\",\n height: \"100%\",\n backgroundColor: \"rgba(255,255,255,0.95)\",\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"center\",\n justifyContent: \"center\",\n zIndex: 10,\n padding: \"20px\",\n boxSizing: \"border-box\",\n textAlign: \"center\",\n },\n gameTitle: { fontSize: \"30px\", color: BASE_COLOR, marginBottom: \"20px\" },\n instructions: {\n fontSize: \"15px\",\n color: \"#555\",\n lineHeight: \"1.6\",\n marginBottom: \"30px\",\n },\n button: {\n padding: \"12px 25px\",\n fontSize: \"16px\",\n backgroundColor: BASE_COLOR,\n color: \"white\",\n border: \"none\",\n borderRadius: \"50px\",\n cursor: \"pointer\",\n fontWeight: \"bold\",\n fontFamily: FONT_FAMILY,\n boxShadow: \"0 5px 15px rgba(214, 51, 132, 0.3)\",\n transition: \"transform 0.2s\",\n },\n\n confetti: {\n fontSize: \"35px\",\n marginBottom: \"20px\",\n animation: \"bounce 2s infinite\",\n },\n loveLetterCard: {\n backgroundColor: \"#fff0f6\",\n padding: \"20px\",\n borderRadius: \"20px\",\n boxShadow: \"0 10px 25px rgba(214, 51, 132, 0.1)\",\n border: `2px solid ${BASE_COLOR}`,\n textAlign: \"center\",\n maxWidth: \"350px\",\n },\n successTitle: { fontSize: \"22px\", color: \"#e11d48\", marginBottom: \"15px\" },\n loveText: {\n fontSize: \"15px\",\n lineHeight: \"1.6\",\n color: \"#4a4a4a\",\n margin: 0,\n fontStyle: \"italic\",\n },\n};\n\n// --- Client / Server Setup ---\nfunction client() {\n const styleSheet = document.createElement(\"style\");\n styleSheet.type = \"text/css\";\n styleSheet.innerText = `\n @import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@700&display=swap');\n body { margin: 0; display: block; min-height: 100vh; } \n #root { display: block; width: 100%; min-height: 100vh; }\n button:hover { transform: scale(1.05); }\n button:active { transform: scale(0.95); }\n @keyframes bounce {\n 0%, 100% { transform: translateY(0); }\n 50% { transform: translateY(-10px); }\n }\n `;\n document.head.appendChild(styleSheet);\n createRoot(document.getElementById(\"root\")!).render();\n}\n\nif (typeof document !== \"undefined\") client();\n\nexport default async function server(request: Request): Promise {\n return new Response(\n `\n \n \n \n The Love Path ❤️\n \n \n \n \n

\n \n \n \n `,\n { headers: { \"content-type\": \"text/html; charset=UTF-8\" } },\n );\n}","deleted","label",[103],"permalink","https://www.val.town/x/alexandrosgalazoulas96/spiral/code/main.tsx","extension","actionData","errors"]