{currentStep.title}

\n {currentStep.fields.map(field => (\n

\n \n {field.label} \n {field.required && *}\n \n {field.type === 'select' ? (\n <>\n \n {errors[field.name] && (\n

\n {errors[field.name]}\n

\n )}\n \n ) : (\n <>\n handleInputChange(sectionName, field.name, e.target.value)}\n aria-invalid={!!errors[field.name]}\n aria-describedby={`${field.name}-error`}\n />\n {errors[field.name] && (\n

\n {errors[field.name]}\n

\n )}\n \n )}\n

\n ))}\n

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

Expoline 2025 - Participant Registration

\n $\"Expoline$ \n \n {renderFormStep()}\n \n

\n {step > 0 && (\n \n )}\n {step < steps.length - 1 ? (\n \n ) : (\n \n )}\n

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") { client(); }\n\n// Updated Comprehensive CSS\nconst css = `\n :root {\n --primary-color: #667eea;\n --secondary-color: #764ba2;\n --text-color: #ffffff;\n --error-color: #ff6b6b;\n }\n\n * {\n box-sizing: border-box;\n transition: all 0.3s ease;\n }\n\n body {\n font-family: 'Arial', sans-serif;\n background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);\n margin: 0;\n padding: 0;\n min-height: 100vh;\n display: flex;\n justify-content: center;\n align-items: center;\n color: var(--text-color);\n line-height: 1.6;\n }\n\n .glass-container {\n background: rgba(255, 255, 255, 0.1);\n backdrop-filter: blur(10px);\n -webkit-backdrop-filter: blur(10px);\n border-radius: 16px;\n border: 1px solid rgba(255, 255, 255, 0.125);\n box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);\n max-width: 800px;\n width: 90%;\n padding: 30px;\n position: relative;\n overflow: hidden;\n }\n\n /* Device-specific Adjustments */\n .device-mobile .glass-container {\n width: 95%;\n padding: 15px;\n margin: 10px;\n }\n\n .device-mobile .form-group {\n margin-bottom: 10px;\n }\n\n .device-mobile .navigation-buttons {\n flex-direction: column;\n }\n\n .device-mobile .navigation-buttons button {\n width: 100%;\n margin-bottom: 10px;\n }\n\n .required {\n color: var(--error-color);\n margin-left: 4px;\n }\n\n .error-message {\n color: var(--error-color);\n font-size: 0.8em;\n margin-top: 5px;\n }\n\n .glass-header {\n background: rgba(255, 255, 255, 0.2);\n backdrop-filter: blur(10px);\n -webkit-backdrop-filter: blur(10px);\n border-radius: 10px;\n padding: 15px;\n text-align: center;\n margin-bottom: 20px;\n }\n\n .form-step {\n background: rgba(255, 255, 255, 0.1);\n backdrop-filter: blur(5px);\n -webkit-backdrop-filter: blur(5px);\n border-radius: 10px;\n padding: 20px;\n margin-bottom: 20px;\n }\n\n .form-group {\n margin-bottom: 15px;\n }\n\n .form-group label {\n display: block;\n margin-bottom: 5px;\n color: rgba(255, 255, 255, 0.8);\n font-weight: bold;\n }\n\n .form-group input,\n .form-group select {\n width: 100%;\n padding: 10px;\n background: rgba(255, 255, 255, 0.2);\n border: 1px solid rgba(255, 255, 255, 0.125);\n border-radius: 8px;\n color: white;\n backdrop-filter: blur(5px);\n -webkit-backdrop-filter: blur(5px);\n }\n\n .form-group input:focus,\n .form-group select:focus {\n outline: 2px solid rgba(255, 255, 255, 0.5);\n }\n\n .form-group input::placeholder,\n .form-group select::placeholder {\n color: rgba(255, 255, 255, 0.6);\n }\n\n .navigation-buttons {\n display: flex;\n justify-content: space-between;\n gap: 10px;\n }\n\n .glass-button {\n background: rgba(255, 255, 255, 0.2);\n backdrop-filter: blur(10px);\n -webkit-backdrop-filter: blur(10px);\n border: 1px solid rgba(255, 255, 255, 0.125);\n color: white;\n padding: 10px 20px;\n border-radius: 8px;\n cursor: pointer;\n transition: all 0.3s ease;\n flex-grow: 1;\n }\n\n .glass-button:hover:not(:disabled) {\n background: rgba(255, 255, 255, 0.3);\n transform: scale(1.02);\n }\n\n .glass-button:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .submit-button {\n background: rgba(0, 255, 0, 0.2);\n }\n\n .logo {\n max-width: 200px;\n margin: 0 auto 20px;\n display: block;\n border-radius: 10px;\n background: rgba(255, 255, 255, 0.2);\n padding: 10px;\n }\n\n @media (max-width: 600px) {\n .navigation-buttons {\n flex-direction: column;\n }\n .navigation-buttons button {\n width: 100%;\n }\n }\n`;\n\nexport default async function server(request: Request): Promise {\n return new Response(`\n \n \n Expoline 2025 - Participant Registration\n \n \n \n \n \n \n

\n \n \n \n \n `, {\n headers: { \n \"content-type\": \"text/html\",\n \"Cache-Control\": \"no-cache, no-store, must-revalidate\"\n }\n });\n}","deleted","label",[99],"permalink","https://www.val.town/x/bladesquad/expositionAgencyPage/code/main.tsx","extension","actionData","errors"]