Skip to content

Commit ccbc8d8

Browse files
feat: fix hardcoded values
1 parent 26c0e7e commit ccbc8d8

File tree

333 files changed

+4214
-4216
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

333 files changed

+4214
-4216
lines changed

apps/sim/app/(auth)/auth-layout-client.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,8 @@ export default function AuthLayoutClient({ children }: { children: React.ReactNo
1414

1515
return (
1616
<AuthBackground className='dark font-[430] font-season'>
17-
<main className='relative flex min-h-full flex-col text-[#ECECEC]'>
18-
<header className='shrink-0 bg-[#1C1C1C]'>
17+
<main className='relative flex min-h-full flex-col text-[var(--landing-text)]'>
18+
<header className='shrink-0 bg-[var(--text-primary)]'>
1919
<Navbar logoOnly />
2020
</header>
2121
<div className='relative z-30 flex flex-1 items-center justify-center px-4 pb-24'>

apps/sim/app/(auth)/components/auth-background.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ type AuthBackgroundProps = {
99
export default function AuthBackground({ className, children }: AuthBackgroundProps) {
1010
return (
1111
<div className={cn('fixed inset-0 overflow-hidden', className)}>
12-
<div className='-z-50 pointer-events-none absolute inset-0 bg-[#1C1C1C]' />
12+
<div className='-z-50 pointer-events-none absolute inset-0 bg-[var(--text-primary)]' />
1313
<AuthBackgroundSVG />
1414
<div className='relative z-20 h-full overflow-auto'>{children}</div>
1515
</div>

apps/sim/app/(auth)/components/branded-button.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -55,9 +55,9 @@ export const BrandedButton = forwardRef<HTMLButtonElement, BrandedButtonProps>(
5555
onMouseEnter={handleMouseEnter}
5656
onMouseLeave={handleMouseLeave}
5757
className={cn(
58-
'group inline-flex h-[32px] items-center justify-center gap-[8px] rounded-[5px] border px-[10px] font-[430] font-season text-[14px] transition-colors disabled:cursor-not-allowed disabled:opacity-50',
58+
'group inline-flex h-[32px] items-center justify-center gap-2 rounded-[5px] border px-2.5 font-[430] font-season text-sm transition-colors disabled:cursor-not-allowed disabled:opacity-50',
5959
!hasCustomColor &&
60-
'border-[#FFFFFF] bg-[#FFFFFF] text-black hover:border-[#E0E0E0] hover:bg-[#E0E0E0]',
60+
'border-[var(--white)] bg-[var(--white)] text-black hover:border-[var(--border-1)] hover:bg-[var(--border-1)]',
6161
fullWidth && 'w-full',
6262
className
6363
)}

apps/sim/app/(auth)/components/sso-login-button.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ export function SSOLoginButton({
3535

3636
const primaryBtnClasses = cn(
3737
primaryClassName || 'branded-button-gradient',
38-
'flex w-full items-center justify-center gap-2 rounded-[10px] border font-medium text-[15px] text-white transition-all duration-200'
38+
'flex w-full items-center justify-center gap-2 rounded-[10px] border font-medium text-base text-white transition-all duration-200'
3939
)
4040

4141
const outlineBtnClasses = cn('w-full rounded-[10px]')

apps/sim/app/(auth)/components/status-page-layout.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -20,8 +20,8 @@ export function StatusPageLayout({
2020
}: StatusPageLayoutProps) {
2121
return (
2222
<AuthBackground className='dark font-[430] font-season'>
23-
<main className='relative flex min-h-full flex-col text-[#ECECEC]'>
24-
<header className='shrink-0 bg-[#1C1C1C]'>
23+
<main className='relative flex min-h-full flex-col text-[var(--landing-text)]'>
24+
<header className='shrink-0 bg-[var(--text-primary)]'>
2525
<Navbar logoOnly />
2626
</header>
2727
<div className='relative z-30 flex flex-1 items-center justify-center px-4 pb-24'>
@@ -31,7 +31,7 @@ export function StatusPageLayout({
3131
<h1 className='font-[430] font-season text-[40px] text-white leading-[110%] tracking-[-0.02em]'>
3232
{title}
3333
</h1>
34-
<p className='font-[430] font-season text-[#F6F6F6]/60 text-[18px] leading-[125%] tracking-[0.02em]'>
34+
<p className='font-[430] font-season text-[var(--text-primary)]/60 text-lg leading-[125%] tracking-[0.02em]'>
3535
{description}
3636
</p>
3737
</div>

apps/sim/app/(auth)/components/support-footer.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,12 +11,12 @@ export function SupportFooter({ position = 'fixed' }: SupportFooterProps) {
1111

1212
return (
1313
<div
14-
className={`right-0 bottom-0 left-0 z-50 pb-8 text-center font-[340] text-[#999] text-[13px] leading-relaxed ${position}`}
14+
className={`right-0 bottom-0 left-0 z-50 pb-8 text-center font-[340] text-[var(--text-subtle)] text-small leading-relaxed ${position}`}
1515
>
1616
Need help?{' '}
1717
<a
1818
href={`mailto:${brandConfig.supportEmail}`}
19-
className='text-[#999] underline-offset-4 transition hover:text-[#ECECEC] hover:underline'
19+
className='text-[var(--text-subtle)] underline-offset-4 transition hover:text-[var(--landing-text)] hover:underline'
2020
>
2121
Contact support
2222
</a>

apps/sim/app/(auth)/login/login-form.tsx

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -386,7 +386,7 @@ export default function LoginPage({
386386
<h1 className='font-[430] font-season text-[40px] text-white leading-[110%] tracking-[-0.02em]'>
387387
Sign in
388388
</h1>
389-
<p className='font-[430] font-season text-[#F6F6F6]/60 text-[18px] leading-[125%] tracking-[0.02em]'>
389+
<p className='font-[430] font-season text-[var(--text-primary)]/60 text-lg leading-[125%] tracking-[0.02em]'>
390390
Enter your details
391391
</p>
392392
</div>
@@ -404,7 +404,7 @@ export default function LoginPage({
404404

405405
{/* Password reset success message */}
406406
{resetSuccessMessage && (
407-
<div className='mt-1 space-y-1 text-[#4CAF50] text-xs'>
407+
<div className='mt-1 space-y-1 text-[var(--success)] text-xs'>
408408
<p>{resetSuccessMessage}</p>
409409
</div>
410410
)}
@@ -459,7 +459,7 @@ export default function LoginPage({
459459
<button
460460
type='button'
461461
onClick={() => setForgotPasswordOpen(true)}
462-
className='font-medium text-[#999] text-xs transition hover:text-[#ECECEC]'
462+
className='font-medium text-[var(--text-subtle)] text-xs transition hover:text-[var(--landing-text)]'
463463
>
464464
Forgot password?
465465
</button>
@@ -487,7 +487,7 @@ export default function LoginPage({
487487
<button
488488
type='button'
489489
onClick={() => setShowPassword(!showPassword)}
490-
className='-translate-y-1/2 absolute top-1/2 right-3 text-[#999] transition hover:text-[#ECECEC]'
490+
className='-translate-y-1/2 absolute top-1/2 right-3 text-[var(--text-subtle)] transition hover:text-[var(--landing-text)]'
491491
aria-label={showPassword ? 'Hide password' : 'Show password'}
492492
>
493493
{showPassword ? <EyeOff size={18} /> : <Eye size={18} />}
@@ -530,10 +530,10 @@ export default function LoginPage({
530530
{showDivider && (
531531
<div className='relative my-6 font-light'>
532532
<div className='absolute inset-0 flex items-center'>
533-
<div className='w-full border-[#2A2A2A] border-t' />
533+
<div className='w-full border-[var(--surface-4)] border-t' />
534534
</div>
535535
<div className='relative flex justify-center text-sm'>
536-
<span className='bg-[#1C1C1C] px-4 font-[340] text-[#999]'>Or continue with</span>
536+
<span className='bg-[var(--text-primary)] px-4 font-[340] text-[var(--text-subtle)]'>Or continue with</span>
537537
</div>
538538
</div>
539539
)}
@@ -559,24 +559,24 @@ export default function LoginPage({
559559

560560
{/* Only show signup link if email/password signup is enabled */}
561561
{!isFalsy(getEnv('NEXT_PUBLIC_EMAIL_PASSWORD_SIGNUP_ENABLED')) && (
562-
<div className='pt-6 text-center font-light text-[14px]'>
562+
<div className='pt-6 text-center font-light text-sm'>
563563
<span className='font-normal'>Don't have an account? </span>
564564
<Link
565565
href={isInviteFlow ? `/signup?invite_flow=true&callbackUrl=${callbackUrl}` : '/signup'}
566-
className='font-medium text-[#ECECEC] underline-offset-4 transition hover:text-white hover:underline'
566+
className='font-medium text-[var(--landing-text)] underline-offset-4 transition hover:text-white hover:underline'
567567
>
568568
Sign up
569569
</Link>
570570
</div>
571571
)}
572572

573-
<div className='absolute right-0 bottom-0 left-0 px-8 pb-8 text-center font-[340] text-[#999] text-[13px] leading-relaxed sm:px-8 md:px-[44px]'>
573+
<div className='absolute right-0 bottom-0 left-0 px-8 pb-8 text-center font-[340] text-[var(--text-subtle)] text-small leading-relaxed sm:px-8 md:px-[44px]'>
574574
By signing in, you agree to our{' '}
575575
<Link
576576
href='/terms'
577577
target='_blank'
578578
rel='noopener noreferrer'
579-
className='text-[#999] underline-offset-4 transition hover:text-[#ECECEC] hover:underline'
579+
className='text-[var(--text-subtle)] underline-offset-4 transition hover:text-[var(--landing-text)] hover:underline'
580580
>
581581
Terms of Service
582582
</Link>{' '}
@@ -585,7 +585,7 @@ export default function LoginPage({
585585
href='/privacy'
586586
target='_blank'
587587
rel='noopener noreferrer'
588-
className='text-[#999] underline-offset-4 transition hover:text-[#ECECEC] hover:underline'
588+
className='text-[var(--text-subtle)] underline-offset-4 transition hover:text-[var(--landing-text)] hover:underline'
589589
>
590590
Privacy Policy
591591
</Link>
@@ -635,7 +635,7 @@ export default function LoginPage({
635635
aria-live='polite'
636636
>
637637
<div className='overflow-hidden'>
638-
<div className='mt-1 text-[#4CAF50] text-xs'>
638+
<div className='mt-1 text-[var(--success)] text-xs'>
639639
<p>{resetStatus.message}</p>
640640
</div>
641641
</div>

apps/sim/app/(auth)/oauth/consent/page.tsx

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -130,7 +130,7 @@ export default function OAuthConsentPage() {
130130
<h1 className='font-[430] font-season text-[40px] text-white leading-[110%] tracking-[-0.02em]'>
131131
Authorize Application
132132
</h1>
133-
<p className='font-[430] font-season text-[#F6F6F6]/60 text-[18px] leading-[125%] tracking-[0.02em]'>
133+
<p className='font-[430] font-season text-[var(--text-primary)]/60 text-lg leading-[125%] tracking-[0.02em]'>
134134
Loading application details...
135135
</p>
136136
</div>
@@ -145,7 +145,7 @@ export default function OAuthConsentPage() {
145145
<h1 className='font-[430] font-season text-[40px] text-white leading-[110%] tracking-[-0.02em]'>
146146
Authorization Error
147147
</h1>
148-
<p className='font-[430] font-season text-[#F6F6F6]/60 text-[18px] leading-[125%] tracking-[0.02em]'>
148+
<p className='font-[430] font-season text-[var(--text-primary)]/60 text-lg leading-[125%] tracking-[0.02em]'>
149149
{error}
150150
</p>
151151
</div>
@@ -170,11 +170,11 @@ export default function OAuthConsentPage() {
170170
className='rounded-[10px]'
171171
/>
172172
) : (
173-
<div className='flex h-12 w-12 items-center justify-center rounded-[10px] bg-[#2A2A2A] font-medium text-[#999] text-[18px]'>
173+
<div className='flex h-12 w-12 items-center justify-center rounded-[10px] bg-[var(--surface-4)] font-medium text-[var(--text-subtle)] text-lg'>
174174
{(clientName ?? '?').charAt(0).toUpperCase()}
175175
</div>
176176
)}
177-
<ArrowLeftRight className='h-5 w-5 text-[#999]' />
177+
<ArrowLeftRight className='h-5 w-5 text-[var(--text-subtle)]' />
178178
<Image
179179
src='/new/logo/colorized-bg.svg'
180180
alt='Sim'
@@ -188,14 +188,14 @@ export default function OAuthConsentPage() {
188188
<h1 className='font-[430] font-season text-[40px] text-white leading-[110%] tracking-[-0.02em]'>
189189
Authorize Application
190190
</h1>
191-
<p className='font-[430] font-season text-[#F6F6F6]/60 text-[18px] leading-[125%] tracking-[0.02em]'>
192-
<span className='font-medium text-[#ECECEC]'>{clientName}</span> is requesting access to
191+
<p className='font-[430] font-season text-[var(--text-primary)]/60 text-lg leading-[125%] tracking-[0.02em]'>
192+
<span className='font-medium text-[var(--landing-text)]'>{clientName}</span> is requesting access to
193193
your account
194194
</p>
195195
</div>
196196

197197
{session?.user && (
198-
<div className='mt-5 flex items-center gap-3 rounded-lg border border-[#2A2A2A] px-4 py-3'>
198+
<div className='mt-5 flex items-center gap-3 rounded-lg border border-[var(--surface-4)] px-4 py-3'>
199199
{session.user.image ? (
200200
<Image
201201
src={session.user.image}
@@ -206,20 +206,20 @@ export default function OAuthConsentPage() {
206206
unoptimized
207207
/>
208208
) : (
209-
<div className='flex h-8 w-8 items-center justify-center rounded-full bg-[#2A2A2A] font-medium text-[#999] text-[13px]'>
209+
<div className='flex h-8 w-8 items-center justify-center rounded-full bg-[var(--surface-4)] font-medium text-[var(--text-subtle)] text-small'>
210210
{(session.user.name ?? session.user.email ?? '?').charAt(0).toUpperCase()}
211211
</div>
212212
)}
213213
<div className='min-w-0'>
214214
{session.user.name && (
215-
<p className='truncate font-medium text-[14px]'>{session.user.name}</p>
215+
<p className='truncate font-medium text-sm'>{session.user.name}</p>
216216
)}
217-
<p className='truncate text-[#999] text-[13px]'>{session.user.email}</p>
217+
<p className='truncate text-[var(--text-subtle)] text-small'>{session.user.email}</p>
218218
</div>
219219
<button
220220
type='button'
221221
onClick={handleSwitchAccount}
222-
className='ml-auto text-[#999] text-[13px] underline-offset-2 transition-colors hover:text-[#ECECEC] hover:underline'
222+
className='ml-auto text-[var(--text-subtle)] text-small underline-offset-2 transition-colors hover:text-[var(--landing-text)] hover:underline'
223223
>
224224
Switch
225225
</button>
@@ -229,10 +229,10 @@ export default function OAuthConsentPage() {
229229
{scopes.length > 0 && (
230230
<div className='mt-5 w-full max-w-[410px]'>
231231
<div className='rounded-lg border p-4'>
232-
<p className='mb-3 font-medium text-[14px]'>This will allow the application to:</p>
232+
<p className='mb-3 font-medium text-sm'>This will allow the application to:</p>
233233
<ul className='space-y-2'>
234234
{scopes.map((s) => (
235-
<li key={s} className='flex items-start gap-2 font-normal text-[#999] text-[13px]'>
235+
<li key={s} className='flex items-start gap-2 font-normal text-[var(--text-subtle)] text-small'>
236236
<span className='mt-0.5 text-green-500'>&#10003;</span>
237237
<span>{SCOPE_DESCRIPTIONS[s] ?? s}</span>
238238
</li>

apps/sim/app/(auth)/reset-password/reset-password-content.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,7 @@ function ResetPasswordContent() {
7777
<h1 className='font-[430] font-season text-[40px] text-white leading-[110%] tracking-[-0.02em]'>
7878
Reset your password
7979
</h1>
80-
<p className='font-[430] font-season text-[#F6F6F6]/60 text-[18px] leading-[125%] tracking-[0.02em]'>
80+
<p className='font-[430] font-season text-[var(--text-primary)]/60 text-lg leading-[125%] tracking-[0.02em]'>
8181
Enter a new password for your account
8282
</p>
8383
</div>
@@ -92,10 +92,10 @@ function ResetPasswordContent() {
9292
/>
9393
</div>
9494

95-
<div className='pt-6 text-center font-light text-[14px]'>
95+
<div className='pt-6 text-center font-light text-sm'>
9696
<Link
9797
href='/login'
98-
className='font-medium text-[#ECECEC] underline-offset-4 transition hover:text-white hover:underline'
98+
className='font-medium text-[var(--landing-text)] underline-offset-4 transition hover:text-white hover:underline'
9999
>
100100
Back to login
101101
</Link>

apps/sim/app/(auth)/reset-password/reset-password-form.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -46,15 +46,15 @@ export function RequestResetForm({
4646
disabled={isSubmitting}
4747
required
4848
/>
49-
<p className='text-[#999] text-sm'>
49+
<p className='text-[var(--text-subtle)] text-sm'>
5050
We'll send a password reset link to this email address.
5151
</p>
5252
</div>
5353

5454
{/* Status message display */}
5555
{statusType && statusMessage && (
5656
<div
57-
className={cn('text-xs', statusType === 'success' ? 'text-[#4CAF50]' : 'text-red-400')}
57+
className={cn('text-xs', statusType === 'success' ? 'text-[var(--success)]' : 'text-red-400')}
5858
>
5959
<p>{statusMessage}</p>
6060
</div>
@@ -162,7 +162,7 @@ export function SetNewPasswordForm({
162162
<button
163163
type='button'
164164
onClick={() => setShowPassword(!showPassword)}
165-
className='-translate-y-1/2 absolute top-1/2 right-3 text-[#999] transition hover:text-[#ECECEC]'
165+
className='-translate-y-1/2 absolute top-1/2 right-3 text-[var(--text-subtle)] transition hover:text-[var(--landing-text)]'
166166
aria-label={showPassword ? 'Hide password' : 'Show password'}
167167
>
168168
{showPassword ? <EyeOff size={18} /> : <Eye size={18} />}
@@ -190,7 +190,7 @@ export function SetNewPasswordForm({
190190
<button
191191
type='button'
192192
onClick={() => setShowConfirmPassword(!showConfirmPassword)}
193-
className='-translate-y-1/2 absolute top-1/2 right-3 text-[#999] transition hover:text-[#ECECEC]'
193+
className='-translate-y-1/2 absolute top-1/2 right-3 text-[var(--text-subtle)] transition hover:text-[var(--landing-text)]'
194194
aria-label={showConfirmPassword ? 'Hide password' : 'Show password'}
195195
>
196196
{showConfirmPassword ? <EyeOff size={18} /> : <Eye size={18} />}
@@ -208,7 +208,7 @@ export function SetNewPasswordForm({
208208
<div
209209
className={cn(
210210
'mt-1 space-y-1 text-xs',
211-
statusType === 'success' ? 'text-[#4CAF50]' : 'text-red-400'
211+
statusType === 'success' ? 'text-[var(--success)]' : 'text-red-400'
212212
)}
213213
>
214214
<p>{statusMessage}</p>

0 commit comments

Comments
 (0)