Skip to content

Commit a51a91a

Browse files
OmarMcAdamOmarMcAdam
authored
fix-colors (#606)
1 parent 95c4c12 commit a51a91a

File tree

37 files changed

+113
-132
lines changed

37 files changed

+113
-132
lines changed

‎apps/web/src/app/(login)/_components/two-factor-dialog.tsx

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -43,9 +43,7 @@ export function TwoFactorDialog({ open }: { open: boolean }) {
4343
</InputOTP>
4444
</div>
4545
{error && (
46-
<div className="text-destructive text-center text-sm">
47-
{error.message}
48-
</div>
46+
<div className="text-red-9 text-center text-sm">{error.message}</div>
4947
)}
5048
<Button
5149
className="mx-auto w-full"

‎apps/web/src/app/(login)/page.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -92,13 +92,13 @@ export default function Page() {
9292
<div className="py-6">
9393
<PasskeyLoginButton />
9494
<div className="flex items-center justify-center gap-2 py-4">
95-
<Separator className="bg-slate-5 w-28" />
95+
<Separator className="bg-base-5 w-28" />
9696
<Badge
9797
className="uppercase"
9898
variant="outline">
9999
or
100100
</Badge>
101-
<Separator className="bg-slate-5 w-28" />
101+
<Separator className="bg-base-5 w-28" />
102102
</div>
103103
<div className="flex flex-col items-center justify-center gap-4 py-2">
104104
<Form {...form}>

‎apps/web/src/app/[orgShortcode]/_components/sidebar-content.tsx

Lines changed: 31 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -59,35 +59,33 @@ export default function SidebarContent() {
5959
return (
6060
<div
6161
className={cn(
62-
'bg-slate-3 border-slate-5 z-[1] flex h-full w-full min-w-56 resize-x flex-col items-start gap-4 rounded-2xl border p-2'
62+
'bg-base-3 border-base-5 z-[1] flex h-full w-full min-w-56 resize-x flex-col items-start gap-4 rounded-2xl border p-2'
6363
)}>
6464
<OrgMenu />
6565
<div
6666
className={cn(
6767
'flex w-full grow flex-col items-start justify-start gap-4 p-0'
6868
)}>
6969
<div className="flex w-full flex-col gap-0 p-0">
70-
<span className="text-slate-10 p-1 text-[10px] font-semibold uppercase">
70+
<span className="text-base-10 p-1 text-[10px] font-semibold uppercase">
7171
Spaces
7272
</span>
7373
<Link
74-
className="hover:bg-slate-1 flex w-full max-w-full flex-row items-center gap-2 truncate rounded-lg p-1.5"
74+
className="hover:bg-base-1 flex w-full max-w-full flex-row items-center gap-2 truncate rounded-lg p-1.5"
7575
href={`/${orgShortcode}/convo`}>
7676
<div className="bg-blue-4 text-blue-9 flex h-6 w-6 items-center justify-center rounded-sm">
7777
<User
7878
weight="bold"
7979
className={'h-4 w-4'}
8080
/>
8181
</div>
82-
<span className="text-slate-12 font-medium">My personal space</span>
82+
<span className="text-base-12 font-medium">My personal space</span>
8383
</Link>
8484
</div>
8585
</div>
8686
<div className="flex w-full flex-row items-center justify-between p-1">
87-
<span className={cn('font-display text-slate-11 text-sm')}>
88-
UnInbox
89-
</span>
90-
<span className={cn('text-slate-11 text-xs')}>v0.1.0</span>
87+
<span className={cn('font-display text-base-11 text-sm')}>UnInbox</span>
88+
<span className={cn('text-base-11 text-xs')}>v0.1.0</span>
9189
</div>
9290
</div>
9391
);
@@ -151,7 +149,7 @@ function OrgMenu() {
151149
<DropdownMenu onOpenChange={(open) => setSidebarSubmenuOpen(open)}>
152150
<DropdownMenuTrigger
153151
className={
154-
'bg-slate-1 border-slate-5 hover:bg-slate-2 flex w-full flex-row items-center justify-between gap-2 rounded-lg border p-3 shadow-sm'
152+
'bg-base-1 border-base-5 hover:bg-base-2 flex w-full flex-row items-center justify-between gap-2 rounded-lg border p-3 shadow-sm'
155153
}>
156154
<div className={'flex flex-row items-center gap-2'}>
157155
<Avatar className="h-8 w-8">
@@ -165,9 +163,7 @@ function OrgMenu() {
165163
{currentOrg.name}
166164
</span>
167165
<span
168-
className={cn(
169-
'text-slate-11 text-xs font-medium leading-none'
170-
)}>
166+
className={cn('text-base-11 text-xs font-medium leading-none')}>
171167
{displayName}
172168
</span>
173169
</div>
@@ -177,10 +173,10 @@ function OrgMenu() {
177173
<CaretUpDown className={'h-4 w-4'} />
178174
</div>
179175
</DropdownMenuTrigger>
180-
<DropdownMenuContent className="bg-slate-1 border-slate-5 flex w-[214px] flex-col gap-0 p-0">
176+
<DropdownMenuContent className="bg-base-1 border-base-5 flex w-[214px] flex-col gap-0 p-0">
181177
<DropdownMenuLabel className={'px-0 py-0'}>
182178
<div className="flex flex-col items-start justify-start gap-2 p-3">
183-
<span className={'text-slate-11 text-xs font-medium uppercase'}>
179+
<span className={'text-base-11 text-xs font-medium uppercase'}>
184180
Signed in as
185181
</span>
186182
<div className={'flex flex-row gap-2'}>
@@ -190,15 +186,11 @@ function OrgMenu() {
190186
</Avatar>
191187
<div className="flex flex-col items-start justify-center">
192188
<span
193-
className={
194-
'text-slate-12 text-sm font-medium leading-none'
195-
}>
189+
className={'text-base-12 text-sm font-medium leading-none'}>
196190
{displayName}
197191
</span>
198192
<span
199-
className={
200-
'text-slate-11 text-xs font-normal leading-none'
201-
}>
193+
className={'text-base-11 text-xs font-normal leading-none'}>
202194
@{username}
203195
</span>
204196
</div>
@@ -211,15 +203,15 @@ function OrgMenu() {
211203
<DropdownMenuLabel className={'px-0 py-0'}>
212204
<span
213205
className={
214-
'text-slate-11 w-full text-left text-xs font-medium uppercase'
206+
'text-base-11 w-full text-left text-xs font-medium uppercase'
215207
}>
216208
Organizations
217209
</span>
218210
</DropdownMenuLabel>
219211
{orgs.map((org) => (
220212
<DropdownMenuItem
221213
key={org.publicId}
222-
className="focus:bg-slate-3 rounded-sm p-0"
214+
className="focus:bg-base-3 rounded-sm p-0"
223215
asChild>
224216
<div
225217
onClick={() => {
@@ -242,7 +234,7 @@ function OrgMenu() {
242234
/>
243235
<AvatarFallback>{getInitials(org.name)}</AvatarFallback>
244236
</Avatar>
245-
<span className={'text-slate-12 text-sm font-medium'}>
237+
<span className={'text-base-12 text-sm font-medium'}>
246238
{org.name}
247239
</span>
248240
</div>
@@ -252,7 +244,7 @@ function OrgMenu() {
252244
))}
253245
<DropdownMenuItem
254246
key={'addNewOrg'}
255-
className="focus:bg-slate-3 rounded-sm p-0"
247+
className="focus:bg-base-3 rounded-sm p-0"
256248
asChild>
257249
<div
258250
onClick={() => {
@@ -264,14 +256,14 @@ function OrgMenu() {
264256
<div className="flex flex-row items-center gap-2">
265257
<div
266258
className={
267-
'border-slate-5 flex h-10 w-10 shrink-0 items-center justify-center overflow-hidden rounded-md border-2 border-dotted'
259+
'border-base-5 flex h-10 w-10 shrink-0 items-center justify-center overflow-hidden rounded-md border-2 border-dotted'
268260
}>
269261
<Plus
270262
weight="bold"
271263
className={'absolute h-4 w-4'}
272264
/>
273265
</div>
274-
<span className={'text-slate-11 text-sm font-medium'}>
266+
<span className={'text-base-11 text-sm font-medium'}>
275267
Create Organization
276268
</span>
277269
</div>
@@ -283,7 +275,7 @@ function OrgMenu() {
283275
<DropdownMenuItem asChild>
284276
<Link
285277
href={`/${currentOrg.shortcode}/settings`}
286-
className="text-slate-11 flex w-full flex-row items-center gap-2 font-medium">
278+
className="text-base-11 flex w-full flex-row items-center gap-2 font-medium">
287279
<Gear className={'h-4 w-4'} />
288280
<span>Settings</span>
289281
</Link>
@@ -294,11 +286,11 @@ function OrgMenu() {
294286
}}>
295287
<div
296288
className={
297-
'text-slate-11 flex w-full flex-row items-center justify-between'
289+
'text-base-11 flex w-full flex-row items-center justify-between'
298290
}>
299291
<div
300292
className={
301-
'text-slate-11 flex flex-row items-center gap-2 font-medium'
293+
'text-base-11 flex flex-row items-center gap-2 font-medium'
302294
}>
303295
<Palette className={'h-4 w-4'} />
304296
<span>Theme</span>
@@ -316,17 +308,15 @@ function OrgMenu() {
316308
value="light"
317309
aria-label="Toggle light mode"
318310
className={
319-
theme === 'light'
320-
? 'border-slate-7 rounded-md border'
321-
: ''
311+
theme === 'light' ? 'border-base-7 rounded-md border' : ''
322312
}>
323313
<Sun className={'h-4 w-4'} />
324314
</ToggleGroupItem>
325315
<ToggleGroupItem
326316
value="dark"
327317
aria-label="Toggle dark mode"
328318
className={
329-
theme === 'dark' ? 'border-slate-7 rounded-md border' : ''
319+
theme === 'dark' ? 'border-base-7 rounded-md border' : ''
330320
}>
331321
<MoonStars className={'h-4 w-4'} />
332322
</ToggleGroupItem>
@@ -335,7 +325,7 @@ function OrgMenu() {
335325
aria-label="Toggle system default"
336326
className={
337327
theme === 'system'
338-
? 'border-slate-7 rounded-md border'
328+
? 'border-base-7 rounded-md border'
339329
: ''
340330
}>
341331
<Monitor className={'h-4 w-4'} />
@@ -345,7 +335,7 @@ function OrgMenu() {
345335
</DropdownMenuItem>
346336
<DropdownMenuSub>
347337
<DropdownMenuSubTrigger>
348-
<div className="text-slate-11 flex w-full flex-row items-center gap-2 font-medium">
338+
<div className="text-base-11 flex w-full flex-row items-center gap-2 font-medium">
349339
<Question className={'h-4 w-4'} />
350340
<span>Help</span>
351341
</div>
@@ -355,7 +345,7 @@ function OrgMenu() {
355345
<DropdownMenuItem>
356346
<div
357347
className={
358-
'text-slate-11 flex w-full flex-row items-center gap-2 font-medium'
348+
'text-base-11 flex w-full flex-row items-center gap-2 font-medium'
359349
}>
360350
<Book className={'h-4 w-4'} />
361351
<span>Documentation</span>
@@ -364,7 +354,7 @@ function OrgMenu() {
364354
<DropdownMenuItem>
365355
<div
366356
className={
367-
'text-slate-11 flex w-full flex-row items-center gap-2 font-medium'
357+
'text-base-11 flex w-full flex-row items-center gap-2 font-medium'
368358
}>
369359
<QuestionMark />
370360
<span>Support</span>
@@ -373,7 +363,7 @@ function OrgMenu() {
373363
<DropdownMenuItem>
374364
<div
375365
className={
376-
'text-slate-11 flex w-full flex-row items-center gap-2 font-medium'
366+
'text-base-11 flex w-full flex-row items-center gap-2 font-medium'
377367
}>
378368
<MapPin className={'h-4 w-4'} />
379369
<span>Roadmap</span>
@@ -382,7 +372,7 @@ function OrgMenu() {
382372
<DropdownMenuItem>
383373
<div
384374
className={
385-
'text-slate-11 flex w-full flex-row items-center gap-2 font-medium'
375+
'text-base-11 flex w-full flex-row items-center gap-2 font-medium'
386376
}>
387377
<Activity className={'h-4 w-4'} />
388378
<span>Status</span>
@@ -391,7 +381,7 @@ function OrgMenu() {
391381
<DropdownMenuItem>
392382
<div
393383
className={
394-
'text-slate-11 flex w-full flex-row items-center gap-2 font-medium'
384+
'text-base-11 flex w-full flex-row items-center gap-2 font-medium'
395385
}>
396386
<Megaphone className={'h-4 w-4'} />
397387
<span>Changelog</span>
@@ -408,7 +398,7 @@ function OrgMenu() {
408398
logOut();
409399
}}
410400
disabled={loggingOut}
411-
className="focus:bg-red-9 focus:text-slate-1 text-slate-11">
401+
className="focus:bg-red-9 focus:text-base-1 text-base-11">
412402
<div className={'flex flex-row items-center gap-2 p-2 font-medium'}>
413403
<SignOut className={'h-4 w-4'} />
414404
<span>Log out</span>

‎apps/web/src/app/[orgShortcode]/_components/sidebar.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -59,13 +59,13 @@ export default function Sidebar() {
5959
{!isSidebarAutoCollapsed && (
6060
<div
6161
className={cn(
62-
'bg-slate-3 focus-within:bg-slate-5 border-slate-5 absolute top-[34px] z-[1] flex h-6 w-4 max-w-4 cursor-pointer items-center justify-end overflow-visible rounded-br-[7px] rounded-tr-[7px] border border-l-0 transition-all duration-1000 ease-in-out',
62+
'bg-base-3 focus-within:bg-base-5 border-base-5 absolute top-[34px] z-[1] flex h-6 w-4 max-w-4 cursor-pointer items-center justify-end overflow-visible rounded-br-[7px] rounded-tr-[7px] border border-l-0 transition-all duration-1000 ease-in-out',
6363
sidebarExpanded ? 'visible opacity-100' : 'invisible opacity-0',
6464
sidebarDocked ? '-right-[15px]' : '-right-[3px]'
6565
)}>
6666
<div
6767
className={cn(
68-
'hover:bg-slate-5 flex h-[22px] w-[22px] min-w-[22px] cursor-pointer items-center justify-center rounded-md transition-all duration-1000 ease-in-out',
68+
'hover:bg-base-5 flex h-[22px] w-[22px] min-w-[22px] cursor-pointer items-center justify-center rounded-md transition-all duration-1000 ease-in-out',
6969
sidebarExpanded ? 'visible opacity-100' : 'invisible opacity-0'
7070
)}
7171
onClick={() => setSidebarDocking(!sidebarDocked)}>
@@ -82,12 +82,12 @@ export default function Sidebar() {
8282
{isSidebarAutoCollapsed && (
8383
<div
8484
className={cn(
85-
'bg-slate-3 focus-within:bg-slate-5 border-slate-5 absolute -right-[19px] top-[26px] flex h-10 w-8 max-w-8 cursor-pointer items-center justify-end overflow-visible rounded-br-[7px] rounded-tr-[7px] border border-l-0 transition-all duration-1000 ease-in-out',
85+
'bg-base-3 focus-within:bg-base-5 border-base-5 absolute -right-[19px] top-[26px] flex h-10 w-8 max-w-8 cursor-pointer items-center justify-end overflow-visible rounded-br-[7px] rounded-tr-[7px] border border-l-0 transition-all duration-1000 ease-in-out',
8686
sidebarExpanded ? 'visible opacity-100' : 'invisible opacity-0'
8787
)}>
8888
<div
8989
className={cn(
90-
'hover:bg-slate-5 flex h-[38px] w-[38px] min-w-[38px] cursor-pointer items-center justify-center rounded-md transition-all duration-1000 ease-in-out',
90+
'hover:bg-base-5 flex h-[38px] w-[38px] min-w-[38px] cursor-pointer items-center justify-center rounded-md transition-all duration-1000 ease-in-out',
9191
sidebarExpanded ? 'visible opacity-100' : 'invisible opacity-0'
9292
)}
9393
onClick={() => setSidebarExpanded(false)}>

‎apps/web/src/app/[orgShortcode]/convo/[convoId]/_components/participants.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@ export function Participants({
7272
))}
7373
</div>
7474
</DrawerTrigger>
75-
{/* <DrawerContent className="fixed bottom-0 right-0 mt-24 flex h-full w-[400px] flex-col rounded-t-[10px] bg-white"> */}
75+
{/* <DrawerContent className="fixed bottom-0 right-0 mt-24 flex h-full w-[400px] flex-col rounded-t-[10px] bg-base-1"> */}
7676
<DrawerContent>
7777
<div className="h-full max-w-sm">
7878
<DrawerHeader>

‎apps/web/src/app/[orgShortcode]/settings/org/mail/addresses/external/page.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -156,7 +156,7 @@ export default function Page() {
156156
<Form {...form}>
157157
<div className="my-2 flex w-full flex-col gap-2">
158158
<div className="flex w-fit flex-col gap-2">
159-
<div className="text-muted-foreground font-bold uppercase">
159+
<div className="text-base-11 font-bold uppercase">
160160
Email Address
161161
</div>
162162
<div className="flex gap-1">
@@ -198,7 +198,7 @@ export default function Page() {
198198
</div>
199199

200200
<div className="flex w-fit flex-col gap-2">
201-
<div className="text-muted-foreground font-bold uppercase">
201+
<div className="text-base-11 font-bold uppercase">
202202
SMTP Settings
203203
</div>
204204
<div className="flex gap-1">
@@ -333,7 +333,7 @@ export default function Page() {
333333
</div>
334334
</div>
335335

336-
<div className="text-muted-foreground font-bold uppercase">
336+
<div className="text-base-11 font-bold uppercase">
337337
Deliver Messages To
338338
</div>
339339
<div className="flex flex-col gap-2">

‎apps/web/src/app/[orgShortcode]/settings/org/setup/billing/_components/plans-table.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -92,7 +92,7 @@ const PricingCard = ({
9292
className={cn(
9393
`flex w-72 flex-col justify-between py-1 ${popular ? 'border-accent-9' : 'border-base-6'} mx-auto sm:mx-0`,
9494
{
95-
'animate-background-shine bg-white bg-[length:200%_100%] transition-colors dark:bg-[linear-gradient(110deg,#000103,45%,#1e2631,55%,#000103)]':
95+
'animate-background-shine bg-base-1 bg-[length:200%_100%] transition-colors dark:bg-[linear-gradient(110deg,#000103,45%,#1e2631,55%,#000103)]':
9696
exclusive
9797
}
9898
)}>

‎apps/web/src/app/[orgShortcode]/settings/user/security/_components/reset-modals.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -221,11 +221,11 @@ export function TOTPModal({
221221
<QRCodeSVG
222222
value={twoFaChallenge?.uri ?? ''}
223223
size={200}
224-
className="mx-auto rounded bg-white p-2"
224+
className="bg-base-1 mx-auto rounded p-2"
225225
/>
226226

227227
{qrCodeSecret && (
228-
<div className="border-muted/80 flex w-full rounded border">
228+
<div className="border-base-6 flex w-full rounded border">
229229
<div className="bg-muted text-base-11 text-bold flex w-[32ch] flex-1 items-center overflow-hidden truncate text-clip rounded rounded-r-none p-1 font-mono">
230230
{qrCodeSecret}
231231
</div>

‎apps/web/src/app/join/org/_components/create-org.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -106,7 +106,7 @@ export function CreateOrg() {
106106
/>
107107
<Tooltip>
108108
<TooltipTrigger asChild>
109-
<div className="text-slate-11 w-fit text-xs">
109+
<div className="text-base-11 w-fit text-xs">
110110
{env.NEXT_PUBLIC_WEBAPP_URL}/
111111
<EditableText
112112
value={orgShortcode}

0 commit comments

Comments
 (0)