astra/owpengram-server
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fixes

Browse source
This commit is contained in:
onysd 2026-07-25 01:24:36 +03:00
parent ba15e2f32f
commit b2e84a187d
13 changed files with 261 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

5
cmd/telesrv-admin/web/src/pages/LoginPage.tsx
View file

@ -27,6 +27,11 @@ export function LoginPage({ onLogin }: { onLogin: (actor: string) => void }) {
return (
<main className="login-page">
<div className="bg-orbs" aria-hidden="true">
<div className="bg-orb bg-orb--1" />
<div className="bg-orb bg-orb--2" />
<div className="bg-orb bg-orb--3" />
</div>
<section className="login-panel">
<div className="login-head">
<div className="brand brand-elevated">

4
cmd/telesrv-admin/web/src/styles/01-foundation.css
View file

@ -82,6 +82,8 @@
--shadow: 0 28px 70px -36px rgba(5, 5, 8, 0.35);
--shadow-sm: 0 2px 10px rgba(24, 39, 56, 0.05);
--shadow-brand: 0 8px 22px rgba(37, 99, 235, 0.22);
--hero-glow: rgba(37, 99, 235, 0.14);
--hero-grid: rgba(5, 5, 8, 0.04);
/* Radii */
--radius-xs: 8px;
@ -157,6 +159,8 @@
--shadow: 0 16px 40px rgba(0, 0, 0, 0.46);
--shadow-sm: 0 2px 12px rgba(0, 0, 0, 0.38);
--shadow-brand: 0 8px 22px rgba(91, 157, 255, 0.26);
--hero-glow: rgba(91, 157, 255, 0.25);
--hero-grid: rgba(255, 255, 255, 0.04);
}
* {

80
cmd/telesrv-admin/web/src/styles/04-modal-and-login.css
View file

@ -176,11 +176,91 @@
}
.login-page {
position: relative;
display: grid;
min-height: 100vh;
place-items: center;
padding: 24px;
background: var(--bg);
background-image:
radial-gradient(900px 480px at 50% -8%, var(--hero-glow) 0%, rgba(0, 0, 0, 0) 70%),
linear-gradient(var(--hero-grid) 1px, transparent 1px),
linear-gradient(90deg, var(--hero-grid) 1px, transparent 1px);
background-size: auto, 44px 44px, 44px 44px;
overflow: hidden;
}
.login-page .bg-orbs {
position: absolute;
inset: -60px;
z-index: 0;
pointer-events: none;
}
.login-page .bg-orb {
position: absolute;
border-radius: 50%;
filter: blur(100px);
pointer-events: none;
}
.login-page .bg-orb--1 {
top: -15%;
left: -10%;
width: 700px;
height: 700px;
background: color-mix(in srgb, var(--brand-2) 40%, transparent);
animation: loginOrbFloat1 20s ease-in-out infinite;
}
.login-page .bg-orb--2 {
top: 25%;
right: -15%;
width: 600px;
height: 600px;
background: color-mix(in srgb, var(--brand) 38%, transparent);
animation: loginOrbFloat2 24s ease-in-out infinite;
}
.login-page .bg-orb--3 {
bottom: -15%;
left: 30%;
width: 500px;
height: 500px;
background: color-mix(in srgb, var(--brand-2) 30%, transparent);
animation: loginOrbFloat3 28s ease-in-out infinite;
}
@keyframes loginOrbFloat1 {
0%, 100% { transform: translate(0, 0) scale(1); }
33% { transform: translate(60px, -40px) scale(1.08); }
66% { transform: translate(-30px, 30px) scale(.92); }
}
@keyframes loginOrbFloat2 {
0%, 100% { transform: translate(0, 0) scale(1); }
33% { transform: translate(-50px, -35px) scale(.93); }
66% { transform: translate(45px, 25px) scale(1.07); }
}
@keyframes loginOrbFloat3 {
0%, 100% { transform: translate(0, 0) scale(1); }
33% { transform: translate(40px, 45px) scale(1.06); }
66% { transform: translate(-55px, -25px) scale(.94); }
}
@media (max-width: 720px) {
.login-page .bg-orb { filter: blur(60px); }
.login-page .bg-orb--1 { width: 350px; height: 350px; }
.login-page .bg-orb--2 { width: 300px; height: 300px; }
.login-page .bg-orb--3 { width: 250px; height: 250px; }
}
@media (prefers-reduced-motion: reduce) {
.login-page .bg-orb { animation: none; }
}
.login-page .login-panel {
position: relative;
z-index: 1;
}
.login-panel {