From 4b2ed9907401b5915806a93a745fc32c76e6fb9b Mon Sep 17 00:00:00 2001 From: SquadleDude <167652540+squadledude@users.noreply.github.com> Date: Mon, 3 Aug 2026 15:15:33 +0300 Subject: [PATCH] AFDSAFDSFD sfsf --- app/static/css/login.css | 111 +++++++++++++++++++++++++++++++-------- 1 file changed, 89 insertions(+), 22 deletions(-) diff --git a/app/static/css/login.css b/app/static/css/login.css index 755473a..d593d81 100644 --- a/app/static/css/login.css +++ b/app/static/css/login.css @@ -1,32 +1,99 @@ -body { background: radial-gradient(circle, var(--auth-dot) 10%, transparent 11%),radial-gradient(circle at bottom left, var(--auth-dot) 5%, transparent 6%),radial-gradient(circle at bottom right, var(--auth-dot) 5%, transparent 6%),radial-gradient(circle at top left, var(--auth-dot) 5%, transparent 6%),radial-gradient(circle at top right, var(--auth-dot) 5%, transparent 6%); background-size: 3em 3em; background-color: var(--auth-bg); } #main { display: flex; justify-content: center; align-items: center; min-height: 100vh; } -.login-container { min-width: 420px; /* increased so larger logo has room */ display: inline-block; background-color: var(--auth-card-bg); box-shadow: 0 0 15px var(--auth-card-shadow); } +body { + background: radial-gradient(circle, var(--auth-dot) 10%, transparent 11%),radial-gradient(circle at bottom left, var(--auth-dot) 5%, transparent 6%),radial-gradient(circle at bottom right, var(--auth-dot) 5%, transparent 6%),radial-gradient(circle at top left, var(--auth-dot) 5%, transparent 6%),radial-gradient(circle at top right, var(--auth-dot) 5%, transparent 6%); + background-size: 3em 3em; + background-color: var(--auth-bg); +} +#main { + display: flex; + justify-content: center; + align-items: center; + min-height: 100vh; +} +.login-container { + min-width: 330px; + display: inline-block; + background-color: var(--auth-card-bg); + box-shadow: 0 0 15px var(--auth-card-shadow); +} -.login-container h1 { text-align: center; margin-bottom: 0; font-size: 3.5rem; font-weight: 700; } .login-container p { text-align: center; padding: 0; margin-bottom: 15px; font-size: small; } +.login-container h1 { + text-align: center; + margin-bottom: 0; + font-size: 3.5rem; + font-weight: 700; +} +.login-container p { + text-align: center; + padding: 0; + margin-bottom: 15px; + font-size: small; +} -.login-container button { width: 100%; font-weight: 600; font-size: larger; padding: 3px; margin-bottom: 0 !important; } +.login-container button { + width: 100%; + font-weight: 600; + font-size: larger; + padding: 3px; + margin-bottom: 0 !important; +} -.login-container a { font-size: small; font-weight: 400 !important; } +.login-container a { + font-size: small; + font-weight: 400 !important; +} -.col { padding: 0 !important; } +.col { + padding: 0 !important; +} -#password { margin-top: 10px; margin-bottom: 10px; } +#password { + margin-top: 10px; + margin-bottom: 10px; +} +.form-text { + /* wrap the text*/ + word-wrap: break-word; +} -.form-text { /* wrap the text*/ word-wrap: break-word; } +#main a { + text-decoration: none !important; + color: rgb(32, 147, 255) !important; + font-weight: 500 !important; + transition: 0.2s; +} -#main a { text-decoration: none !important; color: rgb(32, 147, 255) !important; font-weight: 500 !important; transition: 0.2s; } +#main a:hover { + text-decoration: none !important; + color: rgb(3, 133, 255) !important; + transition: 0.2s; +} -#main a:hover { text-decoration: none !important; color: rgb(3, 133, 255) !important; transition: 0.2s; } -/* ========================= Login logo and responsive tweaks ========================= */ - -/* login logo (used in login.html) / .login-logo { display: block; margin: 12px auto 14px; max-width: 420px; / larger maximum width on desktop / width: 100%; / scale responsively up to max-width */ height: auto; object-fit: contain; } - - -/* subtitle under logo */ .login-subtitle { text-align: center; margin-bottom: 12px; color: rgba(230,238,248,0.9); font-size: small; } - - -/* Navbar brand logo sizing */ .navbar .navbar-brand .brand-logo { display: block; max-height: 64px; width: auto; height: auto; transform: translateY(2px); } - - -/* responsive breakpoints */ @media (max-width: 992px) { .login-logo { max-width: 300px; } .login-container { min-width: 100px; } } @media (max-width: 480px) { .login-logo { max-width: 160px; } .login-container { min-width: 280px; } } @media (max-width: 576px) { .navbar .navbar-brand .brand-logo { max-height: 40px; transform: translateY(0); } } +/* ========================= + Login logo and responsive tweaks + ========================= */ +.login-logo { + display: block; + margin: 0 auto 8px; + max-width: 260px; + height: auto; +} +.login-subtitle { + text-align: center; + margin-bottom: 12px; + color: rgba(230,238,248,0.9); + font-size: small; +} +@media (max-width: 480px) { + .login-logo { max-width: 160px; } +} +.navbar .navbar-brand .brand-logo { + display: block; + max-height: 44px; + width: auto; + transform: translateY(6px); +} +@media (max-width: 576px) { + .navbar .navbar-brand .brand-logo { max-height: 40px; } +}