Skip to content

regression: red and green color backgrounds #8456

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
pushya22 merged 2 commits into from
Dec 26, 2025
Merged

regression: red and green color backgrounds #8456

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
0e2bc7e
fix: color backgrounds
aaryan610 Dec 26, 2025
d2d4a92
fix: space app comment edit form
aaryan610 Dec 26, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion apps/admin/core/components/common/banner.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ export function Banner(props: TBanner) {

return (
<div
className={`rounded-md p-2 w-full border ${type === "error" ? "bg-danger-primary border-danger-strong" : "bg-success-primary border-success-strong"}`}
className={`rounded-md p-2 w-full border ${type === "error" ? "bg-danger-subtle border-danger-strong" : "bg-success-subtle border-success-strong"}`}
>
<div className="flex items-center justify-center">
<div className="flex-shrink-0">
Expand Down
2 changes: 1 addition & 1 deletion apps/space/core/components/account/auth-forms/email.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@ export const AuthEmailForm = observer(function AuthEmailForm(props: TAuthEmailFo
value={email}
onChange={(e) => setEmail(e.target.value)}
placeholder="name@company.com"
className={`disable-autofill-style h-10 w-full placeholder:text-placeholder autofill:bg-danger-primary border-0 focus:bg-none active:bg-transparent`}
className={`disable-autofill-style h-10 w-full placeholder:text-placeholder autofill:bg-danger-subtle border-0 focus:bg-none active:bg-transparent`}
autoComplete="on"
autoFocus
ref={inputRef}
Expand Down
12 changes: 3 additions & 9 deletions apps/space/core/components/issues/peek-overview/comment/comment-detail-card.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -132,22 +132,16 @@ export const CommentCard = observer(function CommentCard(props: Props) {
<button
type="submit"
disabled={isSubmitting}
className="group rounded-sm border border-success-strong bg-success-primary p-2 shadow-md duration-300 hover:bg-green-500"
className="group rounded-sm border border-success-strong bg-success-primary p-2 shadow-md duration-300 hover:bg-success-primary"
Comment thread
aaryan610 marked this conversation as resolved.
>
<CheckIcon
className="h-3 w-3 text-success-primary duration-300 group-hover:text-on-color"
strokeWidth={2}
/>
<CheckIcon className="h-3 w-3 text-on-color" strokeWidth={2} />
</button>
<button
type="button"
className="group rounded-sm border border-danger-strong bg-danger-primary p-2 shadow-md duration-300 hover:bg-danger-primary-hover"
onClick={() => setIsEditing(false)}
>
<CloseIcon
className="h-3 w-3 text-danger-primary duration-300 group-hover:text-on-color"
strokeWidth={2}
/>
<CloseIcon className="h-3 w-3 text-on-color" strokeWidth={2} />
</button>
</div>
</form>
Expand Down
2 changes: 1 addition & 1 deletion apps/web/ce/components/relations/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ export const ISSUE_RELATION_OPTIONS: Record<TIssueRelationTypes, TRelationObject
blocked_by: {
key: "blocked_by",
i18n_label: "issue.relation.blocked_by",
className: "bg-danger-primary text-danger-primary",
className: "bg-danger-subtle text-danger-primary",
icon: (size) => <CircleDot size={size} className="text-secondary" />,
placeholder: "None",
},
Expand Down
2 changes: 1 addition & 1 deletion apps/web/core/components/account/auth-forms/email.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@ export const AuthEmailForm = observer(function AuthEmailForm(props: TAuthEmailFo
value={email}
onChange={(e) => setEmail(e.target.value)}
placeholder={t("auth.common.email.placeholder")}
className={`disable-autofill-style h-10 w-full placeholder:text-placeholder autofill:bg-red-500 border-0 focus:bg-none active:bg-transparent`}
className={`disable-autofill-style h-10 w-full placeholder:text-placeholder autofill:bg-danger-primary border-0 focus:bg-none active:bg-transparent`}

@coderabbitai coderabbitai Bot Dec 26, 2025

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

Inconsistency with the space version of this component.

This file uses autofill:bg-danger-primary, but the space version of the same component (apps/space/core/components/account/auth-forms/email.tsx line 71) uses autofill:bg-danger-subtle. Given the PR's objective to standardize on subtle variants, these should match for visual consistency.

🔎 Suggested fix to align with subtle variant pattern 
-            className={`disable-autofill-style h-10 w-full placeholder:text-placeholder autofill:bg-danger-primary border-0 focus:bg-none active:bg-transparent`}
+            className={`disable-autofill-style h-10 w-full placeholder:text-placeholder autofill:bg-danger-subtle border-0 focus:bg-none active:bg-transparent`}
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
className={`disable-autofill-style h-10 w-full placeholder:text-placeholder autofill:bg-danger-primary border-0 focus:bg-none active:bg-transparent`}
className={`disable-autofill-style h-10 w-full placeholder:text-placeholder autofill:bg-danger-subtle border-0 focus:bg-none active:bg-transparent`}
🤖 Prompt for AI Agents 
In apps/web/core/components/account/auth-forms/email.tsx around line 70 the
input uses the utility class autofill:bg-danger-primary which is inconsistent
with the space variant (apps/space/.../email.tsx line 71) that uses
autofill:bg-danger-subtle; change autofill:bg-danger-primary to
autofill:bg-danger-subtle so both components use the subtle variant for visual
consistency and standardization.

autoComplete="on"
autoFocus
ref={inputRef}
Expand Down
13 changes: 7 additions & 6 deletions apps/web/core/components/account/auth-forms/password.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -124,19 +124,20 @@ export const AuthPasswordForm = observer(function AuthPasswordForm(props: Props)
return (
<>
{isBannerMessage && mode === EAuthModes.SIGN_UP && (
<div className="relative flex items-center p-2 rounded-md gap-2 border border-danger-strong/50 bg-danger-primary">
<div className="w-4 h-4 flex-shrink-0 relative flex justify-center items-center">
<div className="relative flex items-center p-2 rounded-md gap-2 border border-danger-strong/50 bg-danger-subtle">
<div className="w-4 h-4 shrink-0 relative flex justify-center items-center">
<Info size={16} className="text-danger-primary" />
</div>
<div className="w-full text-13 font-medium text-danger-primary">
{t("auth.sign_up.errors.password.strength")}
</div>
<div
className="relative ml-auto w-6 h-6 rounded-xs flex justify-center items-center transition-all cursor-pointer hover:bg-danger-primary text-accent-primary/80"
<button
type="button"
className="relative ml-auto w-6 h-6 rounded-xs flex justify-center items-center transition-all cursor-pointer hover:bg-danger-subtle-hover text-accent-primary/80"
onClick={() => setBannerMessage(false)}
>
<CloseIcon className="w-4 h-4 flex-shrink-0 text-danger-primary" />
</div>
<CloseIcon className="w-4 h-4 shrink-0 text-danger-primary" />
</button>
</div>
)}
<form
Expand Down
2 changes: 1 addition & 1 deletion apps/web/core/components/account/deactivate-account-modal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@ export function DeactivateAccountModal(props: Props) {
<div className="px-4 pb-4 pt-5 sm:p-6 sm:pb-4">
<div className="">
<div className="flex items-start gap-x-4">
<div className="mt-3 grid place-items-center rounded-full bg-danger-primary p-2 sm:mt-3 sm:p-2 md:mt-0 md:p-4 lg:mt-0 lg:p-4 ">
<div className="mt-3 grid place-items-center rounded-full bg-danger-subtle p-2 sm:mt-3 sm:p-2 md:mt-0 md:p-4 lg:mt-0 lg:p-4 ">
<TrashIcon
className="h-4 w-4 text-danger-primary sm:h-4 sm:w-4 md:h-6 md:w-6 lg:h-6 lg:w-6"
aria-hidden="true"
Expand Down
4 changes: 2 additions & 2 deletions apps/web/core/components/analytics/trend-piece.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,9 +43,9 @@ const variants: Record<NonNullable<Props["variant"]>, Record<"ontrack" | "offtra
atrisk: "text-danger-primary border border-danger-strong",
},
tinted: {
ontrack: "text-success-primary bg-success-primary",
ontrack: "text-success-primary bg-success-subtle",
offtrack: "text-yellow-500 bg-yellow-500/10",
atrisk: "text-danger-primary bg-danger-primary",
atrisk: "text-danger-primary bg-danger-subtle",
},
} as const;

Expand Down
2 changes: 1 addition & 1 deletion apps/web/core/components/api-token/token-list-item.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ export function ApiTokenListItem(props: Props) {
<h5 className="truncate text-13 font-medium">{token.label}</h5>
<span
className={`${
token.is_active ? "bg-success-primary text-success-primary" : "bg-layer-1 text-placeholder"
token.is_active ? "bg-success-subtle text-success-primary" : "bg-layer-1 text-placeholder"
} ml-2 flex h-4 max-h-fit items-center rounded-xs px-2 text-11 font-medium`}
>
{token.is_active ? "Active" : "Expired"}
Expand Down
28 changes: 7 additions & 21 deletions apps/web/core/components/comments/card/edit-form.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React, { useEffect, useRef } from "react";
import { useEffect, useRef } from "react";
import { observer } from "mobx-react";
import { useForm } from "react-hook-form";
import type { EditorRefApi } from "@plane/editor";
Expand Down Expand Up @@ -111,40 +111,26 @@ export const CommentCardEditForm = observer(function CommentCardEditForm(props:
onClick={handleSubmit(onEnter)}
disabled={isDisabled}
className={cn(
"group rounded-lg border size-7 flex items-center justify-center shadow-md duration-300",
isDisabled
? "cursor-not-allowed border-success-strong/50 bg-success-primary"
: "border-success-strong bg-success-primary hover:bg-green-500"
"group rounded-lg border border-success-subtle size-7 grid place-items-center shadow-raised-100 bg-success-subtle duration-300",
isDisabled ? "" : "hover:bg-success-subtle-1"
)}
>
<CheckIcon
className={cn(
"size-4 duration-300",
isDisabled ? "text-success-primary/50" : "text-success-primary group-hover:text-on-color"
)}
/>
<CheckIcon className="size-4 text-success-primary" />
</button>
)}
<button
type="button"
disabled={isSubmitting}
className={cn(
"group rounded-lg border size-7 flex items-center justify-center shadow-md duration-300",
isSubmitting
? "cursor-not-allowed border-danger-strong/50 bg-danger-primary"
: "border-danger-strong bg-danger-primary hover:bg-red-500"
"group rounded-lg border border-danger-subtle size-7 grid place-items-center shadow-raised-100 bg-danger-subtle duration-300",
isSubmitting ? "" : "hover:bg-danger-subtle-hover"
)}
onClick={() => {
setIsEditing(false);
editorRef.current?.setEditorValue(comment.comment_html ?? "<p></p>");
}}
>
<CloseIcon
className={cn(
"size-5 duration-300",
isSubmitting ? "text-danger-primary/50" : "text-danger-primary group-hover:text-on-color"
)}
/>
<CloseIcon className="size-4 text-danger-primary" />
</button>
Comment on lines 121 to 134

@coderabbitai coderabbitai Bot Dec 26, 2025

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

🧩 Analysis chain

🏁 Script executed:

# First, read the actual file to confirm the code and line numbers
cat -n apps/web/core/components/comments/card/edit-form.tsx | sed -n '100,140p'

Repository: makeplane/plane

Length of output: 1645

🏁 Script executed:

# Search for the submit button code mentioned to verify the line numbers and exact tokens used
rg -A 15 -B 5 "type=\"button\"" apps/web/core/components/comments/card/edit-form.tsx

Repository: makeplane/plane

Length of output: 1215

🏁 Script executed:

# Search for Tailwind config or theme files
fd -t f -e ts -e tsx -e js "tailwind|theme|config" packages/ | head -20

Repository: makeplane/plane

Length of output: 917

🏁 Script executed:

# Search for color token definitions - look for subtle variants
rg -n "subtle.*1|subtle.*hover" --type=ts --type=tsx packages/tailwind-config/ 2>/dev/null | head -30

Repository: makeplane/plane

Length of output: 41

🏁 Script executed:

# Search for usages of both tokens to see if they're used elsewhere
rg "bg-success-subtle-1|bg-danger-subtle-hover" apps/web/

Repository: makeplane/plane

Length of output: 519

🏁 Script executed:

# Search for tailwind config files that define these tokens
find packages/tailwind-config -type f \( -name "*.ts" -o -name "*.tsx" -o -name "*.js" \) | head -20

Repository: makeplane/plane

Length of output: 101

🏁 Script executed:

# Look for the color token definitions
rg -n "success.*subtle|danger.*subtle" packages/tailwind-config/ --type=ts --type=tsx -C 2 | head -50

Repository: makeplane/plane

Length of output: 86

🏁 Script executed:

# Check if there's a theme file or color definitions
cat -n packages/tailwind-config/theme/colors.ts 2>/dev/null | head -100

Repository: makeplane/plane

Length of output: 41

🏁 Script executed:

# List files in tailwind-config directory
ls -la packages/tailwind-config/

Repository: makeplane/plane

Length of output: 628

🏁 Script executed:

# Search for color definitions more broadly
rg -n "subtle-1|subtle-hover" packages/tailwind-config/ -C 2

Repository: makeplane/plane

Length of output: 7936

🏁 Script executed:

# Search for where these color tokens are defined or mapped
rg -n "success-subtle|danger-subtle" packages/ --type=ts -C 2 | head -80

Repository: makeplane/plane

Length of output: 6513

🏁 Script executed:

# Look at theme configuration files
find packages/ -name "*.ts" -o -name "*.js" | xargs grep -l "success-subtle\|danger-subtle" | head -10

Repository: makeplane/plane

Length of output: 159

Align hover state token naming patterns for consistency.

The submit and cancel buttons use inconsistent hover state naming conventions:

  • Submit button (line 115): hover:bg-success-subtle-1
  • Cancel button (line 126): hover:bg-danger-subtle-hover

Both tokens exist in the design system, but success uses a numeric suffix (-1) while danger uses a semantic suffix (-hover). Align the naming pattern across both buttons to match the design system's semantic naming convention for interactive hover states (using -hover suffix).

🤖 Prompt for AI Agents 
In apps/web/core/components/comments/card/edit-form.tsx around lines 121 to 134,
the cancel and submit buttons use inconsistent hover token names; update the
submit button's hover token to use the design system's semantic "-hover" suffix
so both buttons match (replace hover:bg-success-subtle-1 with
hover:bg-success-subtle-hover), ensure className strings reflect the new token
and keep the existing conditional hover logic intact so hover styling remains
consistent across both buttons.

</div>
</form>
Expand Down
4 changes: 2 additions & 2 deletions apps/web/core/components/exporter/column.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -72,11 +72,11 @@ export const useExportColumns = () => {
<span
className={`rounded-sm text-11 px-2 py-1 capitalize ${
rowData.status === "completed"
? "bg-success-primary text-success-primary"
? "bg-success-subtle text-success-primary"
: rowData.status === "processing"
? "bg-yellow-500/20 text-yellow-500"
: rowData.status === "failed"
? "bg-danger-primary text-danger-primary"
? "bg-danger-subtle text-danger-primary"
: rowData.status === "expired"
? "bg-orange-500/20 text-orange-500"
: "bg-gray-500/20 text-gray-500"
Expand Down
4 changes: 2 additions & 2 deletions apps/web/core/components/exporter/single-export.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,11 +38,11 @@ export function SingleExport({ service, refreshing }: Props) {
<span
className={`rounded-sm px-2 py-0.5 text-11 capitalize ${
service.status === "completed"
? "bg-success-primary text-success-primary"
? "bg-success-subtle text-success-primary"
: service.status === "processing"
? "bg-yellow-500/20 text-yellow-500"
: service.status === "failed"
? "bg-danger-primary text-danger-primary"
? "bg-danger-subtle text-danger-primary"
: service.status === "expired"
? "bg-orange-500/20 text-orange-500"
: ""
Expand Down
10 changes: 5 additions & 5 deletions apps/web/core/components/inbox/content/inbox-issue-header.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -270,7 +270,7 @@ export const InboxIssueActionsHeader = observer(function InboxIssueActionsHeader
/>
</>

<Row className="hidden relative lg:flex h-full w-full items-center justify-between gap-2 bg-surface-1 z-[15] border-b border-subtle">
<Row className="hidden relative lg:flex h-full w-full items-center justify-between gap-2 bg-surface-1 z-15 border-b border-subtle">
<div className="flex items-center gap-4">
{isNotificationEmbed && (
<button onClick={embedRemoveCurrentNotification}>
Expand Down Expand Up @@ -310,11 +310,11 @@ export const InboxIssueActionsHeader = observer(function InboxIssueActionsHeader

<div className="flex flex-wrap items-center gap-2">
{canMarkAsAccepted && (
<div className="flex-shrink-0">
<div className="shrink-0">
<Button
variant="secondary"
prependIcon={<CircleCheck className="w-3 h-3" />}
className="text-success-primary border border-success-strong bg-success-primary focus:bg-success-primary focus:text-success-primary hover:bg-success-primary"
className="text-on-color border border-success-strong bg-success-primary focus:bg-success-primary focus:text-success-primary hover:bg-success-primary"

Copilot AI Dec 26, 2025

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The text color for the accept button has been changed from text-success-primary to text-on-color, which indicates white text on a colored background. However, the background is bg-success-primary (a primary green color). This change should be verified to ensure proper contrast and accessibility. The original text-success-primary suggests the background should be a subtle variant, not primary.

Copilot uses AI. Check for mistakes.
onClick={() =>
handleActionWithPermission(
isProjectAdmin,
Expand All @@ -329,11 +329,11 @@ export const InboxIssueActionsHeader = observer(function InboxIssueActionsHeader
)}

{canMarkAsDeclined && (
<div className="flex-shrink-0">
<div className="shrink-0">
<Button
variant="secondary"
prependIcon={<CircleX className="w-3 h-3" />}
className="text-danger-primary border border-danger-strong bg-danger-primary focus:bg-danger-primary focus:text-danger-primary hover:bg-danger-primary-hover"
className="text-on-color border border-danger-strong bg-danger-primary focus:bg-danger-primary focus:text-danger-primary hover:bg-danger-primary-hover"
Comment thread
aaryan610 marked this conversation as resolved.
onClick={() =>
handleActionWithPermission(
isProjectAdmin,
Expand Down
2 changes: 1 addition & 1 deletion apps/web/core/components/inbox/inbox-status-icon.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ export const ICON_PROPERTIES = {
[EInboxIssueStatus.SNOOZED]: {
icon: Clock,
textColor: (snoozeDatePassed: boolean = false) => (snoozeDatePassed ? "text-danger-primary" : "text-placeholder"),
bgColor: (snoozeDatePassed: boolean = false) => (snoozeDatePassed ? "bg-danger-primary" : "bg-[#E0E1E6]"),
bgColor: (snoozeDatePassed: boolean = false) => (snoozeDatePassed ? "bg-danger-subtle" : "bg-[#E0E1E6]"),
},
[EInboxIssueStatus.ACCEPTED]: {
icon: CheckCircle2,
Expand Down
2 changes: 1 addition & 1 deletion apps/web/core/components/integration/delete-import-modal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ export function DeleteImportModal({ isOpen, handleClose, data }: Props) {
<ModalCore isOpen={isOpen} handleClose={handleClose} position={EModalPosition.CENTER} width={EModalWidth.XXL}>
<div className="flex flex-col gap-6 p-6">
<div className="flex w-full items-center justify-start gap-6">
<span className="place-items-center rounded-full bg-danger-primary p-4">
<span className="place-items-center rounded-full bg-danger-subtle p-4">
<AlertTriangle className="h-6 w-6 text-danger-primary" aria-hidden="true" />
</span>
<span className="flex items-center justify-start">
Expand Down
4 changes: 2 additions & 2 deletions apps/web/core/components/integration/single-import.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,11 +36,11 @@ export const SingleImport = observer(function SingleImport({ service, refreshing
<span
className={`rounded-sm px-2 py-0.5 text-11 capitalize ${
service.status === "completed"
? "bg-success-primary text-success-primary"
? "bg-success-subtle text-success-primary"
: service.status === "processing"
? "bg-yellow-500/20 text-yellow-500"
: service.status === "failed"
? "bg-danger-primary text-danger-primary"
? "bg-danger-subtle text-danger-primary"
: ""
}`}
>
Expand Down
8 changes: 6 additions & 2 deletions apps/web/core/components/issues/issue-detail/label/create-label.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -144,13 +144,17 @@ export function LabelCreate(props: ILabelCreate) {
/>
<button
type="button"
className="grid place-items-center rounded-sm bg-red-500 p-1"
className="grid place-items-center rounded-sm bg-danger-primary p-1"
onClick={() => setIsCreateToggle(false)}
disabled={disabled}
>
<CloseIcon className="h-3.5 w-3.5 text-on-color" />
</button>
<button type="submit" className="grid place-items-center rounded-sm bg-green-500 p-1" disabled={isSubmitting}>
<button
type="submit"
className="grid place-items-center rounded-sm bg-success-primary p-1"
disabled={isSubmitting}
>
{isSubmitting ? (
<Loader className="spin h-3.5 w-3.5 text-on-color" />
) : (
Expand Down
4 changes: 2 additions & 2 deletions apps/web/core/components/issues/issue-layouts/group-drag-overlay.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,8 +47,8 @@ export function GroupDragOverlay(props: Props) {
className={cn(
`absolute top-0 left-0 h-full w-full items-center text-13 font-medium text-tertiary rounded-sm bg-layer-1/85 ${dragColumnOrientation}`,
{
"flex flex-col border-[1px] border-strong z-[2]": shouldOverlayBeVisible,
"bg-danger-primary": workflowDisabledSource && isDropDisabled,
"flex flex-col border-[1px] border-strong z-2": shouldOverlayBeVisible,
"bg-danger-subtle": workflowDisabledSource && isDropDisabled,
},
{ hidden: !shouldOverlayBeVisible }
)}
Expand Down
2 changes: 1 addition & 1 deletion apps/web/core/components/issues/issue-layouts/kanban/base-kanban-root.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -258,7 +258,7 @@ export const BaseKanBanRoot = observer(function BaseKanBanRoot(props: IBaseKanBa
className={`${
isDragging ? `opacity-100` : `opacity-0`
} flex w-full items-center justify-center rounded-sm border-2 border-danger-strong/20 bg-surface-1 px-3 py-5 text-11 font-medium italic text-danger-primary ${
isDragOverDelete ? "bg-red-500 opacity-70 blur-2xl" : ""
isDragOverDelete ? "bg-danger-primary blur-2xl" : ""
} transition duration-300`}
>
Drop here to delete the work item.
Expand Down
2 changes: 1 addition & 1 deletion apps/web/core/components/issues/issue-layouts/quick-add/form/gantt.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ export const GanttQuickAddIssueForm = observer(function GanttQuickAddIssueForm(p
const { ref, projectDetail, hasError, register, onSubmit, isEpic } = props;
const { t } = useTranslation();
return (
<div className={cn("shadow-raised-200", hasError && "border border-danger-strong/20 bg-danger-primary")}>
<div className={cn("shadow-raised-200", hasError && "border border-danger-strong/20 bg-danger-subtle")}>
<form
ref={ref}
onSubmit={onSubmit}
Expand Down
2 changes: 1 addition & 1 deletion apps/web/core/components/issues/issue-layouts/quick-add/root.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -151,7 +151,7 @@ export const QuickAddIssueRoot = observer(function QuickAddIssueRoot(props: TQui
<div
className={cn(
containerClassName,
errors && errors?.name && errors?.name?.message ? `border-danger-strong bg-danger-primary` : ``
errors && errors?.name && errors?.name?.message ? `border-danger-strong bg-danger-subtle` : ``
)}
>
{isOpen ? (
Expand Down
2 changes: 1 addition & 1 deletion apps/web/core/components/onboarding/step-indicator.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ export function OnboardingStepIndicator({ currentStep, totalSteps }: OnboardingS
<div
key={`line-${i}`}
className={cn("h-1.5 -ml-0.5 w-full", {
"bg-green-700": isCompleted,
"bg-success-primary": isCompleted,
"bg-surface-1": !isCompleted,
"rounded-l-full": isFirstStep,
"rounded-r-full": isLastStep || isActive,
Expand Down
2 changes: 1 addition & 1 deletion apps/web/core/components/onboarding/switch-account-dropdown.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ export const SwitchAccountDropdown = observer(function SwitchAccountDropdown(pro
<SwitchAccountModal isOpen={showSwitchAccountModal} onClose={() => setShowSwitchAccountModal(false)} />
<Menu as="div" className="relative">
<Menu.Button className="flex items-center gap-x-2.5 px-2 py-1.5 rounded-lg bg-layer-1 z-10">
<div className="size-6 rounded-full bg-green-700 flex items-center justify-center text-on-color font-semibold text-13 capitalize">
<div className="size-6 rounded-full bg-success-primary flex items-center justify-center text-on-color font-semibold text-13 capitalize">
{user?.avatar_url ? (
<img
src={getFileURL(user?.avatar_url)}
Expand Down
4 changes: 2 additions & 2 deletions apps/web/core/components/profile/sidebar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -167,10 +167,10 @@ export const ProfileSidebar = observer(function ProfileSidebar(props: TProfileSi
<div
className={`rounded-sm px-1 py-0.5 text-11 font-medium ${
completedIssuePercentage <= 35
? "bg-danger-primary text-danger-primary"
? "bg-danger-subtle text-danger-primary"
: completedIssuePercentage <= 70
? "bg-yellow-500/10 text-yellow-500"
: "bg-success-primary text-success-primary"
: "bg-success-subtle text-success-primary"
}`}
>
{completedIssuePercentage}%
Expand Down
Loading
Loading