Skip to content

Commit 92ac28f

Browse files
authored
[WEB-5809] refactor: tailwind config inline variables (#8437)
1 parent e3ba7c2 commit 92ac28f

File tree

169 files changed

+1273
-1130
lines changed

Some content is hidden

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

169 files changed

+1273
-1130
lines changed

apps/admin/app/(all)/(dashboard)/email/page.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,7 @@ const InstanceEmailPage = observer(function InstanceEmailPage(_props: Route.Comp
6060
Plane can send useful emails to you and your users from your own instance without talking to the Internet.
6161
<div className="text-13 font-regular text-tertiary">
6262
Set it up below and please test your settings before you save them.&nbsp;
63-
<span className="text-danger">Misconfigs can lead to email bounces and errors.</span>
63+
<span className="text-danger-primary">Misconfigs can lead to email bounces and errors.</span>
6464
</div>
6565
</>
6666
),

apps/admin/app/(all)/(dashboard)/workspace/create/form.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -118,7 +118,7 @@ export function WorkspaceCreateForm() {
118118
/>
119119
)}
120120
/>
121-
<span className="text-11 text-red-500">{errors?.name?.message}</span>
121+
<span className="text-11 text-danger-primary">{errors?.name?.message}</span>
122122
</div>
123123
</div>
124124
<div className="flex flex-col gap-1">
@@ -153,11 +153,11 @@ export function WorkspaceCreateForm() {
153153
)}
154154
/>
155155
</div>
156-
{slugError && <p className="text-13 text-red-500">This URL is taken. Try something else.</p>}
156+
{slugError && <p className="text-13 text-danger-primary">This URL is taken. Try something else.</p>}
157157
{invalidSlug && (
158-
<p className="text-13 text-red-500">{`URLs can contain only ( - ), ( _ ) and alphanumeric characters.`}</p>
158+
<p className="text-13 text-danger-primary">{`URLs can contain only ( - ), ( _ ) and alphanumeric characters.`}</p>
159159
)}
160-
{errors.slug && <span className="text-11 text-red-500">{errors.slug.message}</span>}
160+
{errors.slug && <span className="text-11 text-danger-primary">{errors.slug.message}</span>}
161161
</div>
162162
<div className="flex flex-col gap-1">
163163
<h4 className="text-13 text-tertiary">How many people will use this workspace?</h4>
@@ -187,7 +187,7 @@ export function WorkspaceCreateForm() {
187187
)}
188188
/>
189189
{errors.organization_size && (
190-
<span className="text-13 text-red-500">{errors.organization_size.message}</span>
190+
<span className="text-13 text-danger-primary">{errors.organization_size.message}</span>
191191
)}
192192
</div>
193193
</div>

apps/admin/app/(all)/(home)/sign-in-form.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -129,7 +129,7 @@ export function InstanceSignInForm() {
129129

130130
<div className="w-full space-y-1">
131131
<label className="text-13 text-tertiary font-medium" htmlFor="email">
132-
Email <span className="text-red-500">*</span>
132+
Email <span className="text-danger-primary">*</span>
133133
</label>
134134
<Input
135135
className="w-full border border-subtle !bg-surface-1 placeholder:text-placeholder"
@@ -147,7 +147,7 @@ export function InstanceSignInForm() {
147147

148148
<div className="w-full space-y-1">
149149
<label className="text-13 text-tertiary font-medium" htmlFor="password">
150-
Password <span className="text-red-500">*</span>
150+
Password <span className="text-danger-primary">*</span>
151151
</label>
152152
<div className="relative">
153153
<Input

apps/admin/core/components/common/banner.tsx

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,20 +10,22 @@ export function Banner(props: TBanner) {
1010

1111
return (
1212
<div
13-
className={`rounded-md p-2 w-full border ${type === "error" ? "bg-red-500/5 border-red-400" : "bg-green-500/5 border-green-400"}`}
13+
className={`rounded-md p-2 w-full border ${type === "error" ? "bg-danger-primary border-danger-strong" : "bg-success-primary border-success-strong"}`}
1414
>
1515
<div className="flex items-center justify-center">
1616
<div className="flex-shrink-0">
1717
{type === "error" ? (
1818
<span className="flex items-center justify-center h-6 w-6 rounded-full">
19-
<AlertCircle className="h-5 w-5 text-red-600" aria-hidden="true" />
19+
<AlertCircle className="h-5 w-5 text-danger-primary" aria-hidden="true" />
2020
</span>
2121
) : (
22-
<CheckCircle2 className="h-5 w-5 text-green-600" aria-hidden="true" />
22+
<CheckCircle2 className="h-5 w-5 text-success-primary" aria-hidden="true" />
2323
)}
2424
</div>
2525
<div className="ml-1">
26-
<p className={`text-13 font-medium ${type === "error" ? "text-red-600" : "text-green-600"}`}>{message}</p>
26+
<p className={`text-13 font-medium ${type === "error" ? "text-danger-primary" : "text-success-primary"}`}>
27+
{message}
28+
</p>
2729
</div>
2830
</div>
2931
</div>

apps/admin/core/components/instance/setup-form.tsx

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -157,7 +157,7 @@ export function InstanceSetupForm() {
157157
<div className="flex flex-col sm:flex-row items-center gap-4">
158158
<div className="w-full space-y-1">
159159
<label className="text-13 text-tertiary font-medium" htmlFor="first_name">
160-
First name <span className="text-red-500">*</span>
160+
First name <span className="text-danger-primary">*</span>
161161
</label>
162162
<Input
163163
className="w-full border border-subtle !bg-surface-1 placeholder:text-placeholder"
@@ -174,7 +174,7 @@ export function InstanceSetupForm() {
174174
</div>
175175
<div className="w-full space-y-1">
176176
<label className="text-13 text-tertiary font-medium" htmlFor="last_name">
177-
Last name <span className="text-red-500">*</span>
177+
Last name <span className="text-danger-primary">*</span>
178178
</label>
179179
<Input
180180
className="w-full border border-subtle !bg-surface-1 placeholder:text-placeholder"
@@ -192,7 +192,7 @@ export function InstanceSetupForm() {
192192

193193
<div className="w-full space-y-1">
194194
<label className="text-13 text-tertiary font-medium" htmlFor="email">
195-
Email <span className="text-red-500">*</span>
195+
Email <span className="text-danger-primary">*</span>
196196
</label>
197197
<Input
198198
className="w-full border border-subtle !bg-surface-1 placeholder:text-placeholder"
@@ -207,13 +207,13 @@ export function InstanceSetupForm() {
207207
autoComplete="on"
208208
/>
209209
{errorData.type && errorData.type === EErrorCodes.INVALID_EMAIL && errorData.message && (
210-
<p className="px-1 text-11 text-red-500">{errorData.message}</p>
210+
<p className="px-1 text-11 text-danger-primary">{errorData.message}</p>
211211
)}
212212
</div>
213213

214214
<div className="w-full space-y-1">
215215
<label className="text-13 text-tertiary font-medium" htmlFor="company_name">
216-
Company name <span className="text-red-500">*</span>
216+
Company name <span className="text-danger-primary">*</span>
217217
</label>
218218
<Input
219219
className="w-full border border-subtle !bg-surface-1 placeholder:text-placeholder"
@@ -229,7 +229,7 @@ export function InstanceSetupForm() {
229229

230230
<div className="w-full space-y-1">
231231
<label className="text-13 text-tertiary font-medium" htmlFor="password">
232-
Set a password <span className="text-red-500">*</span>
232+
Set a password <span className="text-danger-primary">*</span>
233233
</label>
234234
<div className="relative">
235235
<Input
@@ -267,14 +267,14 @@ export function InstanceSetupForm() {
267267
)}
268268
</div>
269269
{errorData.type && errorData.type === EErrorCodes.INVALID_PASSWORD && errorData.message && (
270-
<p className="px-1 text-11 text-red-500">{errorData.message}</p>
270+
<p className="px-1 text-11 text-danger-primary">{errorData.message}</p>
271271
)}
272272
<PasswordStrengthIndicator password={formData.password} isFocused={isPasswordInputFocused} />
273273
</div>
274274

275275
<div className="w-full space-y-1">
276276
<label className="text-13 text-tertiary font-medium" htmlFor="confirm_password">
277-
Confirm password <span className="text-red-500">*</span>
277+
Confirm password <span className="text-danger-primary">*</span>
278278
</label>
279279
<div className="relative">
280280
<Input
@@ -311,7 +311,9 @@ export function InstanceSetupForm() {
311311
</div>
312312
{!!formData.confirm_password &&
313313
formData.password !== formData.confirm_password &&
314-
renderPasswordMatchError && <span className="text-13 text-red-500">Passwords don{"'"}t match</span>}
314+
renderPasswordMatchError && (
315+
<span className="text-13 text-danger-primary">Passwords don{"'"}t match</span>
316+
)}
315317
</div>
316318

317319
<div className="relative flex gap-2">

apps/space/core/components/account/auth-forms/email.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@ export const AuthEmailForm = observer(function AuthEmailForm(props: TAuthEmailFo
5252
<div
5353
className={cn(
5454
`relative flex items-center rounded-md bg-surface-1 border`,
55-
!isFocused && Boolean(emailError?.email) ? `border-red-500` : `border-subtle`
55+
!isFocused && Boolean(emailError?.email) ? `border-danger-strong` : `border-subtle`
5656
)}
5757
onFocus={() => {
5858
setIsFocused(true);
@@ -68,7 +68,7 @@ export const AuthEmailForm = observer(function AuthEmailForm(props: TAuthEmailFo
6868
value={email}
6969
onChange={(e) => setEmail(e.target.value)}
7070
placeholder="[email protected]"
71-
className={`disable-autofill-style h-10 w-full placeholder:text-placeholder autofill:bg-red-500 border-0 focus:bg-none active:bg-transparent`}
71+
className={`disable-autofill-style h-10 w-full placeholder:text-placeholder autofill:bg-danger-primary border-0 focus:bg-none active:bg-transparent`}
7272
autoComplete="on"
7373
autoFocus
7474
ref={inputRef}
@@ -88,7 +88,7 @@ export const AuthEmailForm = observer(function AuthEmailForm(props: TAuthEmailFo
8888
)}
8989
</div>
9090
{emailError?.email && !isFocused && (
91-
<p className="flex items-center gap-1 text-11 text-red-600 px-0.5">
91+
<p className="flex items-center gap-1 text-11 text-danger-primary px-0.5">
9292
<CircleAlert height={12} width={12} />
9393
{emailError.email}
9494
</p>

apps/space/core/components/account/auth-forms/password.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -201,7 +201,7 @@ export const AuthPasswordForm = observer(function AuthPasswordForm(props: Props)
201201
</div>
202202
{!!passwordFormData.confirm_password &&
203203
passwordFormData.password !== passwordFormData.confirm_password &&
204-
renderPasswordMatchError && <span className="text-13 text-red-500">Passwords don{"'"}t match</span>}
204+
renderPasswordMatchError && <span className="text-13 text-danger-primary">Passwords don{"'"}t match</span>}
205205
</div>
206206
)}
207207

apps/space/core/components/account/auth-forms/unique-code.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -116,7 +116,7 @@ export function AuthUniqueCodeForm(props: TAuthUniqueCodeForm) {
116116
autoFocus
117117
/>
118118
<div className="flex w-full items-center justify-between px-1 text-11 pt-1">
119-
<p className="flex items-center gap-1 font-medium text-green-700">
119+
<p className="flex items-center gap-1 font-medium text-success-primary">
120120
<CircleCheck height={12} width={12} />
121121
Paste the code sent to your email
122122
</p>

apps/space/core/components/issues/issue-layouts/properties/due-date.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ export const IssueBlockDate = observer(function IssueBlockDate(props: Props) {
2727
<Tooltip tooltipHeading="Due Date" tooltipContent={formattedDate}>
2828
<div
2929
className={cn("flex h-full items-center gap-1 rounded-sm px-2.5 py-1 text-11 text-primary", {
30-
"text-red-500": shouldHighLight && due_date && shouldHighlightIssueDueDate(due_date, state?.group),
30+
"text-danger-primary": shouldHighLight && due_date && shouldHighlightIssueDueDate(due_date, state?.group),
3131
"border-[0.5px] border-strong": shouldShowBorder,
3232
})}
3333
>

apps/space/core/components/issues/navbar/user-avatar.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -100,7 +100,7 @@ export const UserAvatar = observer(function UserAvatar() {
100100
type="submit"
101101
className="flex items-center gap-2 rounded-sm p-2 whitespace-nowrap hover:bg-layer-transparent-hover text-13 min-w-36 cursor-pointer"
102102
>
103-
<LogOut size={12} className="shrink-0 text-red-500" />
103+
<LogOut size={12} className="shrink-0 text-danger-primary" />
104104
<div>Sign out</div>
105105
</button>
106106
</form>

0 commit comments

Comments
 (0)