Seazn/profit-planet-frontend
2
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: Seazn:94bc1e9219f3b79213d5a9fc882c14e9fe7ac1e7
Branches Tags
Seazn:main
Seazn:dev
Seazn:release
..
compare: Seazn:20710484fe6b04e17fd1af1a6058473f395452f7
Branches Tags
Seazn:dev
Seazn:main
Seazn:release

No commits in common. "94bc1e9219f3b79213d5a9fc882c14e9fe7ac1e7" and "20710484fe6b04e17fd1af1a6058473f395452f7" have entirely different histories.
94bc1e9219 ... 20710484fe

5 changed files with 36 additions and 85 deletions
Show Stats Expand all files Collapse all files

49
src/app/globals.css
View File

@ -9,12 +9,6 @@
--color-brand-header: #0F172A; --color-brand-header: #0F172A;
--color-brand-text: #4A4A4A; --color-brand-text: #4A4A4A;
--color-brand-background: #FFFFFF; --color-brand-background: #FFFFFF;
/* Text Colors - Better contrast */
--color-text-primary: #0F172A; /* Dark slate for main text */
--color-text-secondary: #334155; /* Slate 700 for secondary text */
--color-text-muted: #64748B; /* Slate 500 for muted text */
--color-text-subtle: #94A3B8; /* Slate 400 for subtle text */
} }
/* Theme variables moved to :root for compatibility */ /* Theme variables moved to :root for compatibility */
@ -40,49 +34,6 @@ html, body {
overflow-x: hidden; overflow-x: hidden;
} }
/* Better text color utilities */
.text-primary {
color: var(--color-text-primary) !important;
}
.text-secondary {
color: var(--color-text-secondary) !important;
}
.text-muted {
color: var(--color-text-muted) !important;
}
.text-subtle {
color: var(--color-text-subtle) !important;
}
/* Override problematic gray colors */
.text-gray-500 {
color: var(--color-text-muted) !important;
}
.text-gray-400 {
color: var(--color-text-subtle) !important;
}
.text-gray-300 {
color: var(--color-text-subtle) !important;
}
/* Fix placeholder colors for better contrast */
.placeholder-gray-400::placeholder {
color: var(--color-text-muted) !important;
}
.placeholder-gray-300::placeholder {
color: var(--color-text-muted) !important;
}
input::placeholder, textarea::placeholder {
color: var(--color-text-muted) !important;
}
#__next { #__next {
height: 100%; height: 100%;
} }

14
src/app/login/components/LoginForm.tsx
View File

@ -248,7 +248,7 @@ export default function LoginForm() {
autoComplete="email" autoComplete="email"
value={formData.email} value={formData.email}
onChange={handleInputChange} onChange={handleInputChange}
className="appearance-none block w-full px-4 py-3 border border-gray-300 rounded-lg placeholder-slate-500 focus:outline-none focus:ring-2 focus:ring-[#8D6B1D] focus:border-[#8D6B1D] text-base bg-white text-[#0F172A] transition" className="appearance-none block w-full px-4 py-3 border border-gray-300 rounded-lg placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-[#8D6B1D] focus:border-[#8D6B1D] text-base bg-white text-[#0F172A] transition"
style={{ style={{
fontSize: isMobile ? '0.875rem' : undefined, fontSize: isMobile ? '0.875rem' : undefined,
padding: isMobile ? '0.4rem 0.75rem' : undefined, padding: isMobile ? '0.4rem 0.75rem' : undefined,
@ -278,7 +278,7 @@ export default function LoginForm() {
autoComplete="current-password" autoComplete="current-password"
value={formData.password} value={formData.password}
onChange={handleInputChange} onChange={handleInputChange}
className="appearance-none block w-full px-4 py-3 pr-12 border border-gray-300 rounded-lg placeholder-slate-500 focus:outline-none focus:ring-2 focus:ring-[#8D6B1D] focus:border-[#8D6B1D] text-base bg-white text-[#0F172A] transition" className="appearance-none block w-full px-4 py-3 pr-12 border border-gray-300 rounded-lg placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-[#8D6B1D] focus:border-[#8D6B1D] text-base bg-white text-[#0F172A] transition"
style={{ style={{
fontSize: isMobile ? '0.875rem' : undefined, fontSize: isMobile ? '0.875rem' : undefined,
padding: isMobile ? '0.4rem 2.5rem 0.4rem 0.75rem' : '0.75rem 3rem 0.75rem 1rem', padding: isMobile ? '0.4rem 2.5rem 0.4rem 0.75rem' : '0.75rem 3rem 0.75rem 1rem',
@ -292,9 +292,9 @@ export default function LoginForm() {
className="absolute inset-y-0 right-0 pr-3 flex items-center" className="absolute inset-y-0 right-0 pr-3 flex items-center"
> >
{showPassword ? ( {showPassword ? (
<EyeSlashIcon className="h-5 w-5 text-slate-500 hover:text-[#8D6B1D] transition-colors" /> <EyeSlashIcon className="h-5 w-5 text-gray-400 hover:text-[#8D6B1D] transition-colors" />
) : ( ) : (
<EyeIcon className="h-5 w-5 text-slate-500 hover:text-[#8D6B1D] transition-colors" /> <EyeIcon className="h-5 w-5 text-gray-400 hover:text-[#8D6B1D] transition-colors" />
)} )}
</button> </button>
</div> </div>
@ -310,7 +310,7 @@ export default function LoginForm() {
onChange={handleInputChange} onChange={handleInputChange}
className="h-4 w-4 text-[#8D6B1D] border-2 border-gray-300 rounded focus:ring-[#8D6B1D] focus:ring-2" className="h-4 w-4 text-[#8D6B1D] border-2 border-gray-300 rounded focus:ring-[#8D6B1D] focus:ring-2"
/> />
<label htmlFor="rememberMe" className="ml-2 text-sm text-slate-700"> <label htmlFor="rememberMe" className="ml-2 text-sm text-[#4A4A4A]">
Angemeldet bleiben Angemeldet bleiben
</label> </label>
</div> </div>
@ -322,7 +322,7 @@ export default function LoginForm() {
checked={showPassword} checked={showPassword}
onChange={(e) => setShowPassword(e.target.checked)} onChange={(e) => setShowPassword(e.target.checked)}
/> />
<label htmlFor="show-password" className="ml-2 text-sm text-slate-700"> <label htmlFor="show-password" className="ml-2 text-sm text-[#4A4A4A]">
Passwort anzeigen Passwort anzeigen
</label> </label>
</div> </div>
@ -401,7 +401,7 @@ export default function LoginForm() {
}} }}
> >
<p <p
className="text-base text-slate-700" className="text-base text-[#4A4A4A]"
style={{ style={{
fontSize: isMobile ? '0.8rem' : undefined, fontSize: isMobile ? '0.8rem' : undefined,
}} }}

4
src/app/login/page.tsx
View File

@ -34,7 +34,7 @@ export default function LoginPage() {
<div className="min-h-screen flex items-center justify-center"> <div className="min-h-screen flex items-center justify-center">
<div className="text-center"> <div className="text-center">
<div className="animate-spin rounded-full h-12 w-12 border-b-2 border-[#8D6B1D] mx-auto mb-4"></div> <div className="animate-spin rounded-full h-12 w-12 border-b-2 border-[#8D6B1D] mx-auto mb-4"></div>
<p className="text-slate-700">You are already logged in. Redirecting...</p> <p className="text-[#4A4A4A]">You are already logged in. Redirecting...</p>
</div> </div>
</div> </div>
</PageLayout> </PageLayout>
@ -52,7 +52,7 @@ export default function LoginPage() {
{/* Footer for mobile */} {/* Footer for mobile */}
<div className="relative z-10 md:hidden"> <div className="relative z-10 md:hidden">
<div className="text-center py-4 text-sm text-slate-700"> <div className="text-center py-4 text-sm text-[#4A4A4A]">
© 2024 Profit Planet. Alle Rechte vorbehalten. © 2024 Profit Planet. Alle Rechte vorbehalten.
</div> </div>
</div> </div>

48
src/app/register/components/RegisterForm.tsx
View File

@ -240,10 +240,10 @@ export default function RegisterForm({
return ( return (
<div className="mt-2"> <div className="mt-2">
<div className="text-sm text-slate-700 mb-2">Passwort-Anforderungen:</div> <div className="text-sm text-[#4A4A4A] mb-2">Passwort-Anforderungen:</div>
<ul className="text-sm space-y-1"> <ul className="text-sm space-y-1">
{rules.map((rule, index) => ( {rules.map((rule, index) => (
<li key={index} className={`flex items-center gap-2 ${rule.test ? 'text-green-600' : 'text-slate-600'}`}> <li key={index} className={`flex items-center gap-2 ${rule.test ? 'text-green-600' : 'text-gray-500'}`}>
<span>{rule.test ? '✓' : '○'}</span> <span>{rule.test ? '✓' : '○'}</span>
<span>{rule.text}</span> <span>{rule.text}</span>
</li> </li>
@ -274,7 +274,7 @@ export default function RegisterForm({
className={`px-6 py-2 rounded-md font-semibold text-sm transition-all duration-200 ${ className={`px-6 py-2 rounded-md font-semibold text-sm transition-all duration-200 ${
mode === 'personal' mode === 'personal'
? 'bg-[#8D6B1D] text-white shadow-sm' ? 'bg-[#8D6B1D] text-white shadow-sm'
: 'bg-transparent text-slate-700 hover:text-[#8D6B1D]' : 'bg-transparent text-[#4A4A4A] hover:text-[#8D6B1D]'
}`} }`}
onClick={() => setMode('personal')} onClick={() => setMode('personal')}
type="button" type="button"
@ -285,7 +285,7 @@ export default function RegisterForm({
className={`px-6 py-2 rounded-md font-semibold text-sm transition-all duration-200 ${ className={`px-6 py-2 rounded-md font-semibold text-sm transition-all duration-200 ${
mode === 'company' mode === 'company'
? 'bg-[#8D6B1D] text-white shadow-sm' ? 'bg-[#8D6B1D] text-white shadow-sm'
: 'bg-transparent text-slate-700 hover:text-[#8D6B1D]' : 'bg-transparent text-[#4A4A4A] hover:text-[#8D6B1D]'
}`} }`}
onClick={() => setMode('company')} onClick={() => setMode('company')}
type="button" type="button"
@ -317,7 +317,7 @@ export default function RegisterForm({
name="firstName" name="firstName"
value={personalForm.firstName} value={personalForm.firstName}
onChange={handlePersonalChange} onChange={handlePersonalChange}
className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors text-primary" className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors"
required required
/> />
</div> </div>
@ -332,7 +332,7 @@ export default function RegisterForm({
name="lastName" name="lastName"
value={personalForm.lastName} value={personalForm.lastName}
onChange={handlePersonalChange} onChange={handlePersonalChange}
className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors text-primary" className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors"
required required
/> />
</div> </div>
@ -349,7 +349,7 @@ export default function RegisterForm({
name="email" name="email"
value={personalForm.email} value={personalForm.email}
onChange={handlePersonalChange} onChange={handlePersonalChange}
className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors text-primary" className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors"
required required
/> />
</div> </div>
@ -364,7 +364,7 @@ export default function RegisterForm({
name="confirmEmail" name="confirmEmail"
value={personalForm.confirmEmail} value={personalForm.confirmEmail}
onChange={handlePersonalChange} onChange={handlePersonalChange}
className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors text-primary" className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors"
required required
/> />
</div> </div>
@ -380,7 +380,7 @@ export default function RegisterForm({
name="phoneNumber" name="phoneNumber"
value={personalForm.phoneNumber} value={personalForm.phoneNumber}
onChange={handlePersonalChange} onChange={handlePersonalChange}
className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors text-primary" className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors"
placeholder="+49 123 456 7890" placeholder="+49 123 456 7890"
/> />
</div> </div>
@ -397,7 +397,7 @@ export default function RegisterForm({
name="password" name="password"
value={personalForm.password} value={personalForm.password}
onChange={handlePersonalChange} onChange={handlePersonalChange}
className="w-full px-3 py-2 pr-10 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors text-primary" className="w-full px-3 py-2 pr-10 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors"
required required
/> />
<button <button
@ -406,9 +406,9 @@ export default function RegisterForm({
className="absolute inset-y-0 right-0 pr-3 flex items-center" className="absolute inset-y-0 right-0 pr-3 flex items-center"
> >
{showPersonalPassword ? ( {showPersonalPassword ? (
<EyeSlashIcon className="h-4 w-4 text-slate-600" /> <EyeSlashIcon className="h-4 w-4 text-gray-400" />
) : ( ) : (
<EyeIcon className="h-4 w-4 text-slate-600" /> <EyeIcon className="h-4 w-4 text-gray-400" />
)} )}
</button> </button>
</div> </div>
@ -425,7 +425,7 @@ export default function RegisterForm({
name="confirmPassword" name="confirmPassword"
value={personalForm.confirmPassword} value={personalForm.confirmPassword}
onChange={handlePersonalChange} onChange={handlePersonalChange}
className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors text-primary" className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors"
required required
/> />
</div> </div>
@ -463,7 +463,7 @@ export default function RegisterForm({
name="companyName" name="companyName"
value={companyForm.companyName} value={companyForm.companyName}
onChange={handleCompanyChange} onChange={handleCompanyChange}
className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors text-primary" className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors"
required required
/> />
</div> </div>
@ -478,7 +478,7 @@ export default function RegisterForm({
name="contactPersonName" name="contactPersonName"
value={companyForm.contactPersonName} value={companyForm.contactPersonName}
onChange={handleCompanyChange} onChange={handleCompanyChange}
className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors text-primary" className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors"
required required
/> />
</div> </div>
@ -495,7 +495,7 @@ export default function RegisterForm({
name="companyEmail" name="companyEmail"
value={companyForm.companyEmail} value={companyForm.companyEmail}
onChange={handleCompanyChange} onChange={handleCompanyChange}
className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors text-primary" className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors"
required required
/> />
</div> </div>
@ -510,7 +510,7 @@ export default function RegisterForm({
name="confirmCompanyEmail" name="confirmCompanyEmail"
value={companyForm.confirmCompanyEmail} value={companyForm.confirmCompanyEmail}
onChange={handleCompanyChange} onChange={handleCompanyChange}
className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors text-primary" className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors"
required required
/> />
</div> </div>
@ -527,7 +527,7 @@ export default function RegisterForm({
name="companyPhone" name="companyPhone"
value={companyForm.companyPhone} value={companyForm.companyPhone}
onChange={handleCompanyChange} onChange={handleCompanyChange}
className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors text-primary" className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors"
placeholder="+49 123 456 7890" placeholder="+49 123 456 7890"
/> />
</div> </div>
@ -542,7 +542,7 @@ export default function RegisterForm({
name="contactPersonPhone" name="contactPersonPhone"
value={companyForm.contactPersonPhone} value={companyForm.contactPersonPhone}
onChange={handleCompanyChange} onChange={handleCompanyChange}
className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors text-primary" className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors"
placeholder="+49 123 456 7890" placeholder="+49 123 456 7890"
/> />
</div> </div>
@ -560,7 +560,7 @@ export default function RegisterForm({
name="password" name="password"
value={companyForm.password} value={companyForm.password}
onChange={handleCompanyChange} onChange={handleCompanyChange}
className="w-full px-3 py-2 pr-10 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors text-primary" className="w-full px-3 py-2 pr-10 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors"
required required
/> />
<button <button
@ -569,9 +569,9 @@ export default function RegisterForm({
className="absolute inset-y-0 right-0 pr-3 flex items-center" className="absolute inset-y-0 right-0 pr-3 flex items-center"
> >
{showCompanyPassword ? ( {showCompanyPassword ? (
<EyeSlashIcon className="h-4 w-4 text-slate-600" /> <EyeSlashIcon className="h-4 w-4 text-gray-400" />
) : ( ) : (
<EyeIcon className="h-4 w-4 text-slate-600" /> <EyeIcon className="h-4 w-4 text-gray-400" />
)} )}
</button> </button>
</div> </div>
@ -588,7 +588,7 @@ export default function RegisterForm({
name="confirmPassword" name="confirmPassword"
value={companyForm.confirmPassword} value={companyForm.confirmPassword}
onChange={handleCompanyChange} onChange={handleCompanyChange}
className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors text-primary" className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8D6B1D] focus:border-transparent transition-colors"
required required
/> />
</div> </div>
@ -618,7 +618,7 @@ export default function RegisterForm({
{/* Login Link */} {/* Login Link */}
<div className="mt-8 text-center"> <div className="mt-8 text-center">
<p className="text-slate-700"> <p className="text-[#4A4A4A]">
Bereits registriert?{' '} Bereits registriert?{' '}
<a <a
href="/login" href="/login"

4
src/app/register/page.tsx
View File

@ -104,7 +104,7 @@ export default function RegisterPage() {
<h1 className="text-4xl font-semibold tracking-tight text-white sm:text-5xl"> <h1 className="text-4xl font-semibold tracking-tight text-white sm:text-5xl">
Registriere dich jetzt Registriere dich jetzt
</h1> </h1>
<p className="mt-2 text-lg/8 text-gray-200"> <p className="mt-2 text-lg/8 text-gray-300">
Erstelle dein persönliches oder Unternehmens-Konto bei Profit Erstelle dein persönliches oder Unternehmens-Konto bei Profit
Planet. Planet.
</p> </p>
@ -132,7 +132,7 @@ export default function RegisterPage() {
/> />
)} )}
{registered && ( {registered && (
<div className="mt-6 mx-auto text-center text-sm text-gray-200"> <div className="mt-6 mx-auto text-center text-sm text-gray-300">
Registrierung erfolgreich – Weiterleitung... Registrierung erfolgreich – Weiterleitung...
</div> </div>
)} )}