4-7-8 Breathing

\n {stepTexts[currentStep]}\n

\n {countdown} seconds\n

\n {!isGuided && cycleCount === 4 && (\n

\n Breathing Exercise Complete!\n \n \n

\n )}\n

\n );\n };\n\n return (\n

🧘 Breathing Techniques

\n {Object.keys(breathingTechniques).map((technique) => (\n \n ))}\n

\n {selectedTechnique && !isGuided && (\n

{selectedTechnique}

\n {breathingTechniques[selectedTechnique].description}\n

\n {selectedTechnique === \"4-7-8 Breathing\" ? (\n \n ) : (\n

{step}

\n )}\n \n

\n )}\n {selectedTechnique === \"4-7-8 Breathing\" && isGuided && renderStepInstruction()}\n \n

\n );\n}\n\nconst styles = {\n container: {\n fontFamily: 'system-ui, sans-serif',\n maxWidth: '600px',\n margin: '0 auto',\n padding: '20px',\n textAlign: 'center',\n backgroundColor: '#f0f4f8',\n minHeight: '100vh'\n },\n title: {\n color: '#2c3e50',\n marginBottom: '30px'\n },\n buttonContainer: {\n display: 'flex',\n justifyContent: 'center',\n gap: '15px',\n marginBottom: '30px'\n },\n button: {\n padding: '10px 20px',\n backgroundColor: '#3498db',\n color: 'white',\n border: 'none',\n borderRadius: '5px',\n cursor: 'pointer',\n transition: 'background-color 0.3s'\n },\n startButton: {\n marginTop: '20px',\n padding: '12px 24px',\n backgroundColor: '#2ecc71',\n color: 'white',\n border: 'none',\n borderRadius: '5px',\n cursor: 'pointer',\n fontSize: '16px'\n },\n instructionContainer: {\n backgroundColor: 'white',\n borderRadius: '10px',\n padding: '20px',\n boxShadow: '0 4px 6px rgba(0,0,0,0.1)'\n },\n description: {\n fontStyle: 'italic',\n color: '#7f8c8d',\n marginBottom: '20px'\n },\n steps: {\n textAlign: 'left',\n lineHeight: '1.6'\n },\n closeButton: {\n marginTop: '20px',\n padding: '8px 16px',\n backgroundColor: '#e74c3c',\n color: 'white',\n border: 'none',\n borderRadius: '5px',\n cursor: 'pointer'\n },\n footer: {\n marginTop: '20px',\n fontSize: '0.8em',\n color: '#7f8c8d'\n },\n sourceLink: {\n color: '#3498db',\n textDecoration: 'none'\n },\n guidedContainer: {\n backgroundColor: 'white',\n borderRadius: '10px',\n padding: '30px',\n boxShadow: '0 4px 6px rgba(0,0,0,0.1)',\n marginTop: '20px'\n },\n stepInstruction: {\n fontSize: '20px',\n marginBottom: '20px',\n color: '#2c3e50'\n },\n countdown: {\n fontSize: '48px',\n fontWeight: 'bold',\n color: '#3498db'\n },\n completedMessage: {\n marginTop: '20px',\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'center',\n gap: '15px'\n },\n restartButton: {\n padding: '10px 20px',\n backgroundColor: '#2ecc71',\n color: 'white',\n border: 'none',\n borderRadius: '5px',\n cursor: 'pointer'\n },\n quitButton: {\n padding: '10px 20px',\n backgroundColor: '#e74c3c',\n color: 'white',\n border: 'none',\n borderRadius: '5px',\n cursor: 'pointer'\n }\n};\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") { client(); }\n\nexport default async function server(request: Request): Promise {\n return new Response(`\n \n \n Breathing Techniques\n \n \n \n \n

\n \n \n \n \n `, {\n headers: {\n \"content-type\": \"text/html\",\n },\n });\n}",[],[173],"files",[153,171],"counts",{"_184":32,"_185":121,"_186":32,"_187":188},"pulls","branches","forks","envVars",{"_189":32,"_190":32},"count","emptyCount","contents",[],{"_104":154,"_95":99,"_155":156,"_157":-5,"_158":141,"_159":121,"_160":118,"_106":194,"_100":32,"_162":163,"_164":165,"_166":22,"_167":-5,"_98":195},["D",1731816028063],[99],"upstreamProject","upstreamBranch","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.branch.$branch.version.$version.code.$",{"_93":94,"_95":96,"_97":43,"_100":101,"_98":99,"_102":204,"_151":209,"_180":216,"_163":217,"_191":219,"_220":-5,"_221":22,"_222":-5,"_223":-5,"_224":-5,"_225":226},{"_104":105,"_95":96,"_106":205,"_108":-5,"_109":22,"_110":111,"_112":-5,"_113":-5,"_14":114,"_115":116,"_117":118,"_119":-5,"_120":121,"_16":122,"_123":124,"_125":124,"_126":127,"_128":127,"_129":127,"_130":124,"_131":124,"_23":206,"_135":207,"_138":208,"_150":22},["D",1746205328831],{"_93":94,"_133":134},{"_93":94,"_137":134},{"_100":140,"_95":43,"_104":141,"_142":105,"_143":-5,"_144":-5,"_145":-5,"_146":-5,"_147":-5,"_148":96,"_149":94},[210,213],{"_104":154,"_95":99,"_155":156,"_157":-5,"_158":141,"_159":121,"_160":118,"_106":161,"_100":32,"_162":163,"_164":165,"_166":22,"_167":-5,"_168":211,"_98":212},[],[99],{"_104":172,"_95":173,"_155":116,"_157":-5,"_158":141,"_159":101,"_160":22,"_106":174,"_100":175,"_162":176,"_164":177,"_166":22,"_167":-5,"_168":214,"_98":215},[],[173],[210,213],{"_104":154,"_95":99,"_155":156,"_157":-5,"_158":141,"_159":121,"_160":118,"_106":194,"_100":32,"_162":163,"_164":165,"_166":22,"_167":-5,"_98":218},[99],[],"upstream","showCompareCallout","pull","ahead","behind","templates",[],"actionData","errors"]

nemonicui

BreathingInstructional