From ef55d9bb24430610b60c1b77821307cd72c08c55 Mon Sep 17 00:00:00 2001 From: zwlucas Date: Sat, 25 Jul 2026 18:23:29 -0300 Subject: feat: upload of the project Signed-off-by: zwlucas --- web/src/pages/LoginPage.module.css | 125 +++++++++++++++++++++++++++++++++++++ 1 file changed, 125 insertions(+) create mode 100644 web/src/pages/LoginPage.module.css (limited to 'web/src/pages/LoginPage.module.css') diff --git a/web/src/pages/LoginPage.module.css b/web/src/pages/LoginPage.module.css new file mode 100644 index 0000000..0205736 --- /dev/null +++ b/web/src/pages/LoginPage.module.css @@ -0,0 +1,125 @@ +.page { + min-height: 100vh; + display: flex; + align-items: center; + justify-content: center; + padding: var(--space-6); + background: + radial-gradient(ellipse at 60% 20%, rgba(108, 126, 248, 0.08) 0%, transparent 60%), + radial-gradient(ellipse at 20% 80%, rgba(108, 126, 248, 0.05) 0%, transparent 50%), + var(--color-bg); +} + +.card { + width: 100%; + max-width: 400px; + background: var(--color-surface); + border: 1px solid var(--color-border); + border-radius: var(--radius-xl); + padding: var(--space-8); + box-shadow: var(--shadow-lg); + animation: slideUp var(--transition-normal) ease; +} + +@keyframes slideUp { + from { opacity: 0; transform: translateY(16px); } + to { opacity: 1; transform: translateY(0); } +} + +.logo { + display: flex; + align-items: center; + gap: var(--space-3); + margin-bottom: var(--space-6); +} + +.appName { + font-size: var(--text-lg); + font-weight: 700; + color: var(--color-text-primary); + letter-spacing: -0.02em; + line-height: 1.2; +} + +.appSub { + font-size: var(--text-xs); + color: var(--color-text-muted); +} + +.heading { + font-size: var(--text-xl); + font-weight: 600; + color: var(--color-text-primary); + letter-spacing: -0.02em; + margin-bottom: var(--space-6); +} + +.form { + display: flex; + flex-direction: column; + gap: var(--space-4); +} + +.field { + display: flex; + flex-direction: column; + gap: var(--space-2); +} + +.label { + font-size: var(--text-sm); + font-weight: 500; + color: var(--color-text-primary); +} + +.passwordWrapper { + position: relative; +} + +.passwordWrapper .input { + padding-right: var(--space-10); +} + +.showPass { + position: absolute; + right: var(--space-3); + top: 50%; + transform: translateY(-50%); + font-size: var(--text-base); + line-height: 1; + color: var(--color-text-muted); + transition: color var(--transition-fast); +} + +.showPass:hover { + color: var(--color-text-secondary); +} + +.error { + padding: var(--space-3) var(--space-4); + background: rgba(248, 113, 113, 0.1); + border: 1px solid rgba(248, 113, 113, 0.3); + border-radius: var(--radius-md); + color: var(--color-priority-critical); + font-size: var(--text-sm); + animation: fadeIn var(--transition-fast) ease; +} + +@keyframes fadeIn { + from { opacity: 0; } + to { opacity: 1; } +} + +.submitBtn { + width: 100%; + padding: var(--space-3); + font-size: var(--text-base); + margin-top: var(--space-2); +} + +.registerLink { + font-size: var(--text-sm); + color: var(--color-text-muted); + text-align: center; + margin-top: var(--space-5); +} -- cgit v1.2.3