1 line
19 KiB
JSON
1 line
19 KiB
JSON
|
|
{"ast":null,"code":"var _jsxFileName = \"D:\\\\aiproject\\\\goAgent\\\\todo\\\\client\\\\src\\\\components\\\\LoginForm.js\",\n _s = $RefreshSig$();\nimport React, { useState } from 'react';\nimport styled, { keyframes } from 'styled-components';\nimport { login } from '../services/api';\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\nconst fadeIn = keyframes`\n from {\n opacity: 0;\n transform: translateY(20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n`;\nconst LoginContainer = styled.div`\n width: 100%;\n max-width: 400px;\n margin: 0 auto;\n padding: ${({\n theme\n}) => theme.spacing.xl};\n background: ${({\n theme\n}) => theme.colors.glass.light};\n backdrop-filter: blur(10px);\n -webkit-backdrop-filter: blur(10px);\n border-radius: ${({\n theme\n}) => theme.borderRadius.xl};\n box-shadow: ${({\n theme\n}) => theme.shadows.lg};\n animation: ${fadeIn} 0.5s ease-out;\n border: 1px solid ${({\n theme\n}) => theme.colors.glass.light};\n\n @media (prefers-color-scheme: dark) {\n background: ${({\n theme\n}) => theme.colors.glass.dark};\n border-color: ${({\n theme\n}) => theme.colors.glass.dark};\n }\n`;\n_c = LoginContainer;\nconst LoginTitle = styled.h1`\n color: ${({\n theme\n}) => theme.colors.text.primary};\n font-size: ${({\n theme\n}) => theme.typography.fontSize['3xl']};\n font-weight: ${({\n theme\n}) => theme.typography.fontWeight.bold};\n text-align: center;\n margin-bottom: ${({\n theme\n}) => theme.spacing.xl};\n display: flex;\n align-items: center;\n justify-content: center;\n gap: ${({\n theme\n}) => theme.spacing.sm};\n\n &::before {\n content: '🔒';\n font-size: 1.2em;\n }\n`;\n_c2 = LoginTitle;\nconst Form = styled.form`\n display: flex;\n flex-direction: column;\n gap: ${({\n theme\n}) => theme.spacing.lg};\n`;\n_c3 = Form;\nconst InputGroup = styled.div`\n position: relative;\n`;\n_c4 = InputGroup;\nconst Input = styled.input`\n width: 100%;\n padding: ${({\n theme\n}) => theme.spacing.md};\n font-size: ${({\n theme\n}) => theme.typography.fontSize.base};\n border: 2px solid ${({\n theme\n}) => theme.colors.glass.light};\n border-radius: ${({\n theme\n}) => theme.borderRadius.lg};\n background: ${({\n theme\n}) => theme.colors.glass.light};\n color: ${({\n theme\n}) => theme.colors.text.primary};\n transition: all ${({\n theme\n}) => theme.transitions.default};\n\n &:focus {\n outline: none;\n border-color: ${({\n theme\n}) => theme.colors.primary};\n box-shadow: 0 0 0 3px ${({\n theme\n}) => theme.colors.primary}40;\n }\n\n &::placeholder {\n color: ${({\n theme\n}) => theme.colors.text.secondary};\n }\n\n @media (prefers-color-scheme: dark) {\n background: ${({\n theme\n}) => theme.colors.glass.dark};\n border-color: ${({\n theme\n}) => theme.colors.glass.dark};\n }\n`;\n_c5 = Input;\nconst SubmitButton = styled.button`\n width: 100%;\n padding: ${({\n theme\n}) => theme.spacing.md};\n font-size: ${({\n theme\n}) => theme.typography.fontSize.base};\n font-weight: ${({\n theme\n}) => theme.typography.fontWeight.semibold};\n color: white;\n background: ${({\n theme\n}) => theme.colors.primary};\n border: none;\n border-radius: ${({\n theme\n}) => theme.borderRadius.lg};\n cursor: pointer;\n transition: all ${({\n theme\n}) => theme.transitions.default};\n display: flex;\n align-items: center;\n justify-content: center;\n gap: ${({\n theme\n}) => theme.spacing.sm};\n\n &:hover {\n background: ${({\n theme\n}) => theme.colors.primary}dd;\n transform: translateY(-1px);\n }\n\n &:active {\n transform: translateY(0);\n }\n\n &::after {\n content: '→';\n font-size: 1.2em;\n transition: transform ${({\n theme\n}) => theme.transitions.default};\n }\n\n &:hover::after {\n transform: translateX(4px);\n }\n`;\n_c6 = SubmitButton;\nconst ErrorMessage = styled.div`\n color: ${({\n theme\n}) => theme.colors.status.error};\n font-size: ${({\n theme\n}) => theme.typography.fontSize.sm};\n text-align: center;\n
|