\n \n

Matrix Client

\n Connect to the decentralized future\n

\n\n

\n {error && (\n

\n \n {error}\n

\n )}\n\n

\n \n Homeserver\n \n setHomeserver(e.target.value)}\n className=\"theme-input appearance-none relative block w-full px-4 py-3 rounded-xl focus:outline-none focus:ring-2 focus:z-10 text-sm sm:text-base transition-all duration-200\"\n style={{\n borderColor: 'var(--color-border)',\n backgroundColor: 'var(--color-background)',\n color: 'var(--color-text)',\n ':focus': {\n borderColor: 'var(--color-primary)',\n boxShadow: `0 0 0 3px ${CSS.supports('color', 'var(--color-primary)') ? 'var(--color-primary)' : '#3b82f6'}10`\n }\n }}\n placeholder=\"https://matrix.org\"\n />\n

\n\n

\n \n Username\n \n setUsername(e.target.value)}\n className=\"theme-input appearance-none relative block w-full px-4 py-3 rounded-xl focus:outline-none focus:ring-2 focus:z-10 text-sm sm:text-base transition-all duration-200\"\n style={{\n borderColor: 'var(--color-border)',\n backgroundColor: 'var(--color-background)',\n color: 'var(--color-text)'\n }}\n placeholder=\"@username:matrix.org\"\n />\n

\n\n

\n \n Password\n \n setPassword(e.target.value)}\n className=\"theme-input appearance-none relative block w-full px-4 py-3 rounded-xl focus:outline-none focus:ring-2 focus:z-10 text-sm sm:text-base transition-all duration-200\"\n style={{\n borderColor: 'var(--color-border)',\n backgroundColor: 'var(--color-background)',\n color: 'var(--color-text)'\n }}\n placeholder=\"Password\"\n />\n

\n\n

\n \n {loading ? (\n

\n Signing in...\n

\n ) : (\n

\n \n Sign in to Matrix\n

\n )}\n \n

\n\n

\n Don't have an account?{\" \"}\n \n Learn about Matrix\n \n

\n );\n}","deleted","label",[172,173,154],"frontend","components","permalink","https://www.val.town/x/loading/matrix/code/frontend/components/Login.tsx","extension","actionData","errors"]