refactor: Remove ripple effects and gradient from login page
- Remove animated ripple background effects - Remove gradient background, use solid color (bg-dark-bg-darker) - Remove text-shadow glow effect from logo - Simplify brand showcase to clean, minimal design
This commit is contained in:
@@ -842,25 +842,13 @@ export function Auth({
|
|||||||
<div className="w-full h-full flex flex-col md:flex-row">
|
<div className="w-full h-full flex flex-col md:flex-row">
|
||||||
|
|
||||||
{/* Left Side - Brand Showcase */}
|
{/* Left Side - Brand Showcase */}
|
||||||
<div className="hidden md:flex md:w-2/5 relative overflow-hidden items-center justify-center"
|
<div className="hidden md:flex md:w-2/5 bg-dark-bg-darker items-center justify-center">
|
||||||
style={{
|
|
||||||
background: 'linear-gradient(to bottom right, hsl(var(--background)), #0e0e10, #09090b)'
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{/* Animated Ripples Background */}
|
|
||||||
<div className="absolute inset-0 flex items-center justify-center">
|
|
||||||
<div className="absolute w-0 h-0 bg-primary/10 rounded-full animate-[ripple_4s_ease-out_infinite]" />
|
|
||||||
<div className="absolute w-0 h-0 bg-primary/7 rounded-full animate-[ripple_4s_ease-out_infinite_1s]" />
|
|
||||||
<div className="absolute w-0 h-0 bg-primary/5 rounded-full animate-[ripple_4s_ease-out_infinite_2s]" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Logo and Branding */}
|
{/* Logo and Branding */}
|
||||||
<div className="relative z-10 text-center px-8">
|
<div className="text-center px-8">
|
||||||
<div
|
<div
|
||||||
className="text-7xl font-bold tracking-wider mb-4 text-foreground"
|
className="text-7xl font-bold tracking-wider mb-4 text-foreground"
|
||||||
style={{
|
style={{
|
||||||
fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace',
|
fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace'
|
||||||
textShadow: '0 0 30px hsl(var(--primary) / 0.3), 0 0 60px hsl(var(--primary) / 0.2)'
|
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
TERMIX
|
TERMIX
|
||||||
@@ -872,21 +860,6 @@ export function Auth({
|
|||||||
{t("auth.description") || "Secure, powerful, and intuitive SSH connection management"}
|
{t("auth.description") || "Secure, powerful, and intuitive SSH connection management"}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<style>{`
|
|
||||||
@keyframes ripple {
|
|
||||||
0% {
|
|
||||||
width: 0;
|
|
||||||
height: 0;
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
width: 150vmax;
|
|
||||||
height: 150vmax;
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
`}</style>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Right Side - Auth Form */}
|
{/* Right Side - Auth Form */}
|
||||||
|
|||||||
Reference in New Issue
Block a user