usulpro
/
banatie-service
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: improve input style

This commit is contained in:
Oleg Proskurin 2025-12-14 12:14:33 +07:00
parent 4a47c53a0a
commit 6650c03188
1 changed files with 21 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
apps/landing/src/app/homepage/_components/WaitlistPopup.tsx
View File

@ -178,6 +178,7 @@ export default function WaitlistPopup({ isOpen, onClose, onSubmit }: WaitlistPop
color: rgba(255, 236, 210, 0.9); color: rgba(255, 236, 210, 0.9);
} }
.waitlist-card-dashed:hover span,
.waitlist-card-dashed.selected span { .waitlist-card-dashed.selected span {
color: rgba(255, 255, 255, 0.8) !important; color: rgba(255, 255, 255, 0.8) !important;
} }
@ -199,18 +200,34 @@ export default function WaitlistPopup({ isOpen, onClose, onSubmit }: WaitlistPop
color: rgba(255, 236, 210, 0.9); color: rgba(255, 236, 210, 0.9);
} }
.waitlist-other-label {
transition: color 0.2s ease;
}
.waitlist-other-container:focus-within .waitlist-other-label {
color: rgba(255, 255, 255, 0.7);
}
.waitlist-other-container.has-value .waitlist-other-label {
color: #a78bfa;
}
.waitlist-other-input { .waitlist-other-input {
background: rgba(255, 255, 255, 0.03); background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.08); border: 2px solid transparent;
transition: all 0.2s ease; transition: all 0.2s ease;
} }
.waitlist-other-input:focus { .waitlist-other-input:focus {
background: rgba(255, 255, 255, 0.05); background: rgba(255, 255, 255, 0.05);
border-color: rgba(139, 92, 246, 0.4); border-color: rgba(255, 255, 255, 0.4);
outline: none; outline: none;
} }
.waitlist-other-container.has-value .waitlist-other-input {
border-color: rgba(168, 85, 247, 0.9);
}
.waitlist-submit-btn { .waitlist-submit-btn {
background: transparent; background: transparent;
border: 1px solid rgba(139, 92, 246, 0.6); border: 1px solid rgba(139, 92, 246, 0.6);
@ -321,8 +338,8 @@ export default function WaitlistPopup({ isOpen, onClose, onSubmit }: WaitlistPop
{/* Other input */} {/* Other input */}
<div className="mb-6"> <div className="mb-6">
<div className="flex items-center gap-3"> <div className={`waitlist-other-container flex items-center gap-3 ${other ? 'has-value' : ''}`}>
<span className="text-white/40 text-sm whitespace-nowrap">Something cooler:</span> <span className="waitlist-other-label text-white/40 text-sm whitespace-nowrap">Something cooler:</span>
<input <input
type="text" type="text"
value={other} value={other}