@@ -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' > ✓</ span >
237237 < span > { SCOPE_DESCRIPTIONS [ s ] ?? s } </ span >
238238 </ li >
0 commit comments