diff --git a/packages/editor/core/src/styles/editor.css b/packages/editor/core/src/styles/editor.css index b0d2a1021..6c76b36f3 100644 --- a/packages/editor/core/src/styles/editor.css +++ b/packages/editor/core/src/styles/editor.css @@ -1,7 +1,7 @@ .ProseMirror p.is-editor-empty:first-child::before { content: attr(data-placeholder); float: left; - color: rgb(var(--color-text-400)); + color: var(--color-neutral-100); pointer-events: none; height: 0; } @@ -20,7 +20,7 @@ .ProseMirror .is-empty::before { content: attr(data-placeholder); float: left; - color: rgb(var(--color-text-400)); + color: var(--color-neutral-100); pointer-events: none; height: 0; } @@ -43,7 +43,7 @@ } .ProseMirror-gapcursor:after { - border-top: 1px solid rgb(var(--color-text-100)) !important; + border-top: 1px solid var(--color-neutral-120) !important; } /* Custom TODO list checkboxes – shoutout to this awesome tutorial: https://moderncss.dev/pure-css-custom-checkbox-style/ */ @@ -62,24 +62,24 @@ ul[data-type="taskList"] li > label { ul[data-type="taskList"] li > label input[type="checkbox"] { -webkit-appearance: none; appearance: none; - background-color: rgb(var(--color-background-100)); + background-color: var(--color-neutral-30); margin: 0; cursor: pointer; width: 0.8rem; height: 0.8rem; position: relative; - border: 1.5px solid rgb(var(--color-text-100)); + border: 1.5px solid var(--color-neutral-120); margin-right: 0.2rem; margin-top: 0.15rem; display: grid; place-content: center; &:hover { - background-color: rgb(var(--color-background-80)); + background-color: var(--color-neutral-50); } &:active { - background-color: rgb(var(--color-background-90)); + background-color: var(--color-neutral-40); } &::before { @@ -99,7 +99,7 @@ ul[data-type="taskList"] li > label input[type="checkbox"] { } ul[data-type="taskList"] li[data-checked="true"] > div > p { - color: rgb(var(--color-text-200)); + color: var(--color-neutral-110); text-decoration: line-through; text-decoration-thickness: 2px; } @@ -158,7 +158,7 @@ ul[data-type="taskList"] li[data-checked="true"] > div > p { width: 20px; height: 20px; border-radius: 50%; - border: 3px solid rgba(var(--color-text-200)); + border: 3px solid var(--color-neutral-110); border-top-color: rgba(var(--color-text-800)); animation: spinning 0.6s linear infinite; } @@ -176,13 +176,13 @@ ul[data-type="taskList"] li[data-checked="true"] > div > p { table-layout: fixed; margin: 0.5em 0 0.5em 0; - border: 1px solid rgb(var(--color-border-200)); + border: 1px solid var(--color-neutral-70); width: 100%; td, th { min-width: 1em; - border: 1px solid rgb(var(--color-border-200)); + border: 1px solid var(--color-neutral-70); padding: 10px 15px; vertical-align: top; box-sizing: border-box; @@ -247,9 +247,9 @@ ul[data-type="taskList"] li[data-checked="true"] > div > p { } .ProseMirror pre { - background: rgba(var(--color-background-80)); + background: var(--color-neutral-50); border-radius: 0.5rem; - color: rgba(var(--color-text-100)); + color: var(--color-neutral-120); font-family: "JetBrainsMono", monospace; padding: 0.75rem 1rem; } @@ -268,7 +268,7 @@ div[data-type="horizontalRule"] { margin-bottom: 0; & > div { - border-bottom: 1px solid rgb(var(--color-text-100)); + border-bottom: 1px solid var(--color-neutral-120); } } diff --git a/packages/editor/core/src/styles/table.css b/packages/editor/core/src/styles/table.css index 8a47a8c59..a682a1746 100644 --- a/packages/editor/core/src/styles/table.css +++ b/packages/editor/core/src/styles/table.css @@ -10,14 +10,14 @@ table-layout: fixed; margin: 0; margin-bottom: 3rem; - border: 1px solid rgba(var(--color-border-200)); + border: 1px solid var(--color-neutral-70); width: 100%; } .tableWrapper table td, .tableWrapper table th { min-width: 1em; - border: 1px solid rgba(var(--color-border-200)); + border: 1px solid var(--color-neutral-70); padding: 10px 15px; vertical-align: top; box-sizing: border-box; @@ -113,7 +113,7 @@ .tableWrapper .tableControls .rowsControlDiv { background-color: rgba(var(--color-primary-100)); - border: 1px solid rgba(var(--color-border-200)); + border: 1px solid var(--color-neutral-70); border-radius: 2px; background-size: 1.25rem; background-repeat: no-repeat; @@ -128,7 +128,7 @@ .tableWrapper .tableControls .columnsControlDiv { background-color: rgba(var(--color-primary-100)); - border: 1px solid rgba(var(--color-border-200)); + border: 1px solid var(--color-neutral-70); border-radius: 2px; background-size: 1.25rem; background-repeat: no-repeat; @@ -142,8 +142,8 @@ } .tableWrapper .tableControls .tableToolbox, .tableWrapper .tableControls .tableColorPickerToolbox { - border: 1px solid rgba(var(--color-border-300)); - background-color: rgba(var(--color-background-100)); + border: 1px solid var(--color-neutral-70); + background-color: var(--color-neutral-30); padding: 0.25rem; display: flex; flex-direction: column; @@ -153,7 +153,7 @@ .tableWrapper .tableControls .tableToolbox .toolboxItem, .tableWrapper .tableControls .tableColorPickerToolbox .toolboxItem { - background-color: rgba(var(--color-background-100)); + background-color: var(--color-neutral-30); display: flex; align-items: center; gap: 0.5rem; @@ -173,7 +173,7 @@ .tableWrapper .tableControls .tableColorPickerToolbox .toolboxItem .iconContainer, .tableWrapper .tableControls .tableToolbox .toolboxItem .colorContainer, .tableWrapper .tableControls .tableColorPickerToolbox .toolboxItem .colorContainer { - border: 1px solid rgba(var(--color-border-300)); + border: 1px solid var(--color-neutral-70); border-radius: 3px; padding: 4px; display: flex; @@ -192,13 +192,13 @@ } .tableToolbox { - background-color: rgba(var(--color-background-100)); + background-color: var(--color-neutral-30); } .tableWrapper .tableControls .tableToolbox .toolboxItem .label, .tableWrapper .tableControls .tableColorPickerToolbox .toolboxItem .label { font-size: 0.85rem; - color: rgba(var(--color-text-300)); + color: var(--color-neutral-110); } .resize-cursor .tableWrapper .tableControls .rowsControl, diff --git a/packages/editor/core/src/ui/extensions/index.tsx b/packages/editor/core/src/ui/extensions/index.tsx index bdca28398..2d3f984dc 100644 --- a/packages/editor/core/src/ui/extensions/index.tsx +++ b/packages/editor/core/src/ui/extensions/index.tsx @@ -59,7 +59,7 @@ export const CoreEditorExtensions = ( }, blockquote: false, dropcursor: { - color: "rgba(var(--color-text-100))", + color: "var(--color-neutral-120)", width: 2, }, }), diff --git a/packages/editor/core/src/ui/extensions/table/table/icons.ts b/packages/editor/core/src/ui/extensions/table/table/icons.ts index c08710ec3..04aa26362 100644 --- a/packages/editor/core/src/ui/extensions/table/table/icons.ts +++ b/packages/editor/core/src/ui/extensions/table/table/icons.ts @@ -1,5 +1,5 @@ export const icons = { - colorPicker: ``, + colorPicker: ``, deleteColumn: ``, deleteRow: ``, insertLeftTableIcon: ` `, @@ -20,7 +20,7 @@ export const icons = { > `, @@ -31,7 +31,7 @@ export const icons = { > `, @@ -42,7 +42,7 @@ export const icons = { > `, diff --git a/packages/editor/core/src/ui/read-only/extensions.tsx b/packages/editor/core/src/ui/read-only/extensions.tsx index 93fa7a3e6..7d76a6959 100644 --- a/packages/editor/core/src/ui/read-only/extensions.tsx +++ b/packages/editor/core/src/ui/read-only/extensions.tsx @@ -54,7 +54,7 @@ export const CoreReadOnlyEditorExtensions = (mentionConfig: { HTMLAttributes: { class: "mt-4 mb-4" }, }, dropcursor: { - color: "rgba(var(--color-text-100))", + color: "var(--color-neutral-120)", width: 2, }, gapcursor: false, diff --git a/packages/editor/extensions/src/styles/drag-drop.css b/packages/editor/extensions/src/styles/drag-drop.css index d95a8654b..30cdb7731 100644 --- a/packages/editor/extensions/src/styles/drag-drop.css +++ b/packages/editor/extensions/src/styles/drag-drop.css @@ -9,11 +9,11 @@ z-index: 10; cursor: grab; border-radius: 2px; - background-color: rgb(var(--color-background-90)); + background-color: var(--color-neutral-40); } .drag-handle:hover { - background-color: rgb(var(--color-background-80)); + background-color: var(--color-neutral-50); transition: background-color 0.2s; } @@ -48,6 +48,6 @@ .drag-handle-dot { height: 2.75px; width: 3px; - background-color: rgba(var(--color-text-200)); + background-color: var(--color-neutral-110); border-radius: 50%; } diff --git a/packages/editor/rich-text-editor/src/ui/menus/bubble-menu/link-selector.tsx b/packages/editor/rich-text-editor/src/ui/menus/bubble-menu/link-selector.tsx index fb6a32a26..1edf54160 100644 --- a/packages/editor/rich-text-editor/src/ui/menus/bubble-menu/link-selector.tsx +++ b/packages/editor/rich-text-editor/src/ui/menus/bubble-menu/link-selector.tsx @@ -66,7 +66,7 @@ export const LinkSelector: FC = ({ editor, isOpen, setIsOpen {editor.getAttributes("link").href ? ( diff --git a/space/components/issues/peek-overview/issue-properties.tsx b/space/components/issues/peek-overview/issue-properties.tsx index 7cabb68a7..de2cbf8f7 100644 --- a/space/components/issues/peek-overview/issue-properties.tsx +++ b/space/components/issues/peek-overview/issue-properties.tsx @@ -82,13 +82,13 @@ export const PeekOverviewIssueProperties: React.FC = ({ issueDetails, mod
diff --git a/space/components/issues/peek-overview/issue-vote-reactions.tsx b/space/components/issues/peek-overview/issue-vote-reactions.tsx index 2d35d6a71..f7f86300d 100644 --- a/space/components/issues/peek-overview/issue-vote-reactions.tsx +++ b/space/components/issues/peek-overview/issue-vote-reactions.tsx @@ -118,7 +118,7 @@ export const IssueVotes: React.FC = observer(() => { }); }} className={`flex items-center justify-center gap-x-1 overflow-hidden rounded border px-2 focus:outline-none ${ - isDownVotedByUser ? "border-red-600 text-red-600" : "border-neutral-border-medium" + isDownVotedByUser ? "border-red-600 text-danger-text-medium" : "border-neutral-border-medium" }`} > arrow_downward_alt diff --git a/space/constants/data.ts b/space/constants/data.ts index 7bdee3743..ead15a262 100644 --- a/space/constants/data.ts +++ b/space/constants/data.ts @@ -27,7 +27,7 @@ export const issuePriorityFilters: IIssuePriorityFilters[] = [ { key: "urgent", title: "Urgent", - className: "bg-red-500 border-red-500 text-white", + className: "bg-danger-solid border-red-500 text-white", icon: "error", }, { @@ -45,7 +45,7 @@ export const issuePriorityFilters: IIssuePriorityFilters[] = [ { key: "low", title: "Low", - className: "text-green-500 border-neutral-border-medium", + className: "text-success-text-medium border-neutral-border-medium", icon: "signal_cellular_alt_1_bar", }, { diff --git a/space/styles/globals.css b/space/styles/globals.css index 92980b0d7..f07c6f147 100644 --- a/space/styles/globals.css +++ b/space/styles/globals.css @@ -257,12 +257,12 @@ } ::-webkit-scrollbar-track { - background-color: rgba(var(--color-background-100)); + background-color: var(--color-neutral-30); } ::-webkit-scrollbar-thumb { border-radius: 5px; - background-color: rgba(var(--color-background-80)); + background-color: var(--color-neutral-50); } .hide-vertical-scrollbar::-webkit-scrollbar { diff --git a/web/components/account/deactivate-account-modal.tsx b/web/components/account/deactivate-account-modal.tsx index b1df7aa6e..de52a4646 100644 --- a/web/components/account/deactivate-account-modal.tsx +++ b/web/components/account/deactivate-account-modal.tsx @@ -89,9 +89,9 @@ export const DeactivateAccountModal: React.FC = (props) => {
-
+
diff --git a/web/components/analytics/custom-analytics/graph/index.tsx b/web/components/analytics/custom-analytics/graph/index.tsx index 51b4089c4..cf0c4c3da 100644 --- a/web/components/analytics/custom-analytics/graph/index.tsx +++ b/web/components/analytics/custom-analytics/graph/index.tsx @@ -115,7 +115,7 @@ export const AnalyticsGraph: React.FC = ({ analytics, barGraphData, param y={datum.y} textAnchor={`${barGraphData.data.length > 7 ? "end" : "middle"}`} fontSize={10} - fill="rgb(var(--color-text-200))" + fill="var(--color-neutral-110)" className={`${barGraphData.data.length > 7 ? "-rotate-45" : ""}`} > {generateDisplayName(datum.value, analytics, params, "x_axis")} diff --git a/web/components/analytics/scope-and-demand/demand.tsx b/web/components/analytics/scope-and-demand/demand.tsx index 696da56f4..d8a38123e 100644 --- a/web/components/analytics/scope-and-demand/demand.tsx +++ b/web/components/analytics/scope-and-demand/demand.tsx @@ -11,7 +11,7 @@ type Props = { export const AnalyticsDemand: React.FC = ({ defaultAnalytics }) => (
-
DEMAND
+
DEMAND

Total open tasks

{defaultAnalytics.open_issues}

diff --git a/web/components/analytics/scope-and-demand/scope.tsx b/web/components/analytics/scope-and-demand/scope.tsx index 886153d37..72a2a56c7 100644 --- a/web/components/analytics/scope-and-demand/scope.tsx +++ b/web/components/analytics/scope-and-demand/scope.tsx @@ -11,7 +11,7 @@ type Props = { export const AnalyticsScope: React.FC = ({ defaultAnalytics }) => (
-
SCOPE
+
SCOPE
Pending issues
diff --git a/web/components/analytics/scope-and-demand/year-wise-issues.tsx b/web/components/analytics/scope-and-demand/year-wise-issues.tsx index 33e07bf6c..3768eb554 100644 --- a/web/components/analytics/scope-and-demand/year-wise-issues.tsx +++ b/web/components/analytics/scope-and-demand/year-wise-issues.tsx @@ -42,7 +42,7 @@ export const AnalyticsYearWiseIssues: React.FC = ({ defaultAnalytics }) =
)} theme={{ - background: "rgb(var(--color-background-100))", + background: "var(--color-neutral-30)", }} enableArea /> diff --git a/web/components/api-token/modal/form.tsx b/web/components/api-token/modal/form.tsx index c13d501b1..89d5966ee 100644 --- a/web/components/api-token/modal/form.tsx +++ b/web/components/api-token/modal/form.tsx @@ -140,7 +140,7 @@ export const CreateApiTokenForm: React.FC = (props) => { /> )} /> - {errors.label && {errors.label.message}} + {errors.label && {errors.label.message}}
= (props) => { onClick={() => setDeleteModalOpen(true)} className="absolute right-4 hidden place-items-center group-hover:grid" > - +
@@ -35,7 +35,7 @@ export const ApiTokenListItem: React.FC = (props) => { diff --git a/web/components/automation/auto-close-automation.tsx b/web/components/automation/auto-close-automation.tsx index 6e66b8faf..7dbc702f2 100644 --- a/web/components/automation/auto-close-automation.tsx +++ b/web/components/automation/auto-close-automation.tsx @@ -69,7 +69,7 @@ export const AutoCloseAutomation: React.FC = observer((props) => {
- +

Auto-close issues

diff --git a/web/components/automation/select-month-modal.tsx b/web/components/automation/select-month-modal.tsx index f18834e08..28df69ac2 100644 --- a/web/components/automation/select-month-modal.tsx +++ b/web/components/automation/select-month-modal.tsx @@ -107,7 +107,9 @@ export const SelectMonthModal: React.FC = ({ type, initialValues, isOpen, /> {errors.close_in && ( - Select a month between 1 and 12. + + Select a month between 1 and 12. + )} ) : ( @@ -140,7 +142,9 @@ export const SelectMonthModal: React.FC = ({ type, initialValues, isOpen, )} /> {errors.archive_in && ( - Select a month between 1 and 12. + + Select a month between 1 and 12. + )} )} diff --git a/web/components/command-palette/actions/help-actions.tsx b/web/components/command-palette/actions/help-actions.tsx index ae5554805..050975b9d 100644 --- a/web/components/command-palette/actions/help-actions.tsx +++ b/web/components/command-palette/actions/help-actions.tsx @@ -50,7 +50,7 @@ export const CommandPaletteHelpActions: React.FC = (props) => { className="focus:outline-none" >
- + Join our Discord
@@ -62,7 +62,7 @@ export const CommandPaletteHelpActions: React.FC = (props) => { className="focus:outline-none" >
- + Report a bug
diff --git a/web/components/core/image-picker-popover.tsx b/web/components/core/image-picker-popover.tsx index 906e2e8e6..478e9a72e 100644 --- a/web/components/core/image-picker-popover.tsx +++ b/web/components/core/image-picker-popover.tsx @@ -326,7 +326,7 @@ export const ImagePickerPopover: React.FC = observer((props) => {
{fileRejections.length > 0 && ( -

+

{fileRejections[0].errors[0].code === "file-too-large" ? "The image size cannot exceed 5 MB." : "Please upload a file in a valid format."} diff --git a/web/components/core/modals/gpt-assistant-popover.tsx b/web/components/core/modals/gpt-assistant-popover.tsx index a2d552404..d3b9cb13f 100644 --- a/web/components/core/modals/gpt-assistant-popover.tsx +++ b/web/components/core/modals/gpt-assistant-popover.tsx @@ -226,7 +226,7 @@ export const GptAssistantPopover: React.FC = (props) => {

)} {invalidResponse && ( -
+
No response could be generated. This may be due to insufficient content or task information. Please try again.
diff --git a/web/components/core/modals/user-image-upload-modal.tsx b/web/components/core/modals/user-image-upload-modal.tsx index 100d818e9..5e0ed48db 100644 --- a/web/components/core/modals/user-image-upload-modal.tsx +++ b/web/components/core/modals/user-image-upload-modal.tsx @@ -153,7 +153,7 @@ export const UserImageUploadModal: React.FC = observer((props) => {
{fileRejections.length > 0 && ( -

+

{fileRejections[0].errors[0].code === "file-too-large" ? "The image size cannot exceed 5 MB." : "Please upload a file in a valid format."} diff --git a/web/components/core/modals/workspace-image-upload-modal.tsx b/web/components/core/modals/workspace-image-upload-modal.tsx index ec35d3562..39e70cf42 100644 --- a/web/components/core/modals/workspace-image-upload-modal.tsx +++ b/web/components/core/modals/workspace-image-upload-modal.tsx @@ -160,7 +160,7 @@ export const WorkspaceImageUploadModal: React.FC = observer((props) => {

{fileRejections.length > 0 && ( -

+

{fileRejections[0].errors[0].code === "file-too-large" ? "The image size cannot exceed 5 MB." : "Please upload a file in a valid format."} diff --git a/web/components/core/theme/custom-theme-selector.tsx b/web/components/core/theme/custom-theme-selector.tsx index 1cc69ccfd..f58504964 100644 --- a/web/components/core/theme/custom-theme-selector.tsx +++ b/web/components/core/theme/custom-theme-selector.tsx @@ -101,7 +101,9 @@ export const CustomThemeSelector: React.FC = observer(() => { /> )} /> - {errors.background &&

{errors.background.message}

} + {errors.background && ( +

{errors.background.message}

+ )}
@@ -127,7 +129,7 @@ export const CustomThemeSelector: React.FC = observer(() => { /> )} /> - {errors.text &&

{errors.text.message}

} + {errors.text &&

{errors.text.message}

}
@@ -153,7 +155,7 @@ export const CustomThemeSelector: React.FC = observer(() => { /> )} /> - {errors.primary &&

{errors.primary.message}

} + {errors.primary &&

{errors.primary.message}

}
@@ -180,7 +182,7 @@ export const CustomThemeSelector: React.FC = observer(() => { )} /> {errors.sidebarBackground && ( -

{errors.sidebarBackground.message}

+

{errors.sidebarBackground.message}

)} @@ -207,7 +209,9 @@ export const CustomThemeSelector: React.FC = observer(() => { /> )} /> - {errors.sidebarText &&

{errors.sidebarText.message}

} + {errors.sidebarText && ( +

{errors.sidebarText.message}

+ )} diff --git a/web/components/cycles/active-cycle-details.tsx b/web/components/cycles/active-cycle-details.tsx index d7e33e8ec..d7a21bbd6 100644 --- a/web/components/cycles/active-cycle-details.tsx +++ b/web/components/cycles/active-cycle-details.tsx @@ -185,7 +185,7 @@ export const ActiveCycleDetails: React.FC = observer((props handleAddToFavorites(e); }} > - + )} diff --git a/web/components/cycles/delete-modal.tsx b/web/components/cycles/delete-modal.tsx index 05078797d..32440c52a 100644 --- a/web/components/cycles/delete-modal.tsx +++ b/web/components/cycles/delete-modal.tsx @@ -101,8 +101,8 @@ export const CycleDeleteModal: React.FC = observer((props) => {
-
- +
+
Delete Cycle
diff --git a/web/components/cycles/gantt-chart/blocks.tsx b/web/components/cycles/gantt-chart/blocks.tsx index 855f93eca..d74ed5c8a 100644 --- a/web/components/cycles/gantt-chart/blocks.tsx +++ b/web/components/cycles/gantt-chart/blocks.tsx @@ -23,7 +23,7 @@ export const CycleGanttBlock = ({ data }: { data: ICycle }) => { : cycleStatus === "completed" ? "#3f76ff" : cycleStatus === "draft" - ? "rgb(var(--color-text-200))" + ? "var(--color-neutral-110)" : "", }} onClick={() => router.push(`/${workspaceSlug}/projects/${data?.project}/cycles/${data?.id}`)} @@ -67,7 +67,7 @@ export const CycleGanttSidebarBlock = ({ data }: { data: ICycle }) => { : cycleStatus === "completed" ? "#3f76ff" : cycleStatus === "draft" - ? "rgb(var(--color-text-200))" + ? "var(--color-neutral-110)" : "" }`} /> diff --git a/web/components/dropdowns/module.tsx b/web/components/dropdowns/module.tsx index 5c07890cf..0c44ed166 100644 --- a/web/components/dropdowns/module.tsx +++ b/web/components/dropdowns/module.tsx @@ -108,7 +108,7 @@ const ButtonContent: React.FC = (props) => { onChange(newModuleIds); }} > - + )} diff --git a/web/components/dropdowns/priority.tsx b/web/components/dropdowns/priority.tsx index 8bfbc727a..e357c3548 100644 --- a/web/components/dropdowns/priority.tsx +++ b/web/components/dropdowns/priority.tsx @@ -54,7 +54,7 @@ const BorderButton = (props: ButtonProps) => { const priorityDetails = ISSUE_PRIORITIES.find((p) => p.key === priority); const priorityClasses = { - urgent: "bg-red-500/20 text-red-950 border-red-500", + urgent: "bg-danger-component-surface-dark text-red-950 border-red-500", high: "bg-orange-500/20 text-orange-950 border-orange-500", medium: "bg-yellow-500/20 text-yellow-950 border-yellow-500", low: "bg-custom-primary-100/20 text-custom-primary-950 border-custom-primary-100", @@ -71,7 +71,7 @@ const BorderButton = (props: ButtonProps) => { // compact the icons if text is hidden "px-0.5": hideText, // highlight the whole button if text is hidden and priority is urgent - "bg-red-500 border-red-500": priority === "urgent" && hideText && highlightUrgent, + "bg-danger-solid border-red-500": priority === "urgent" && hideText && highlightUrgent, }, className )} @@ -80,7 +80,7 @@ const BorderButton = (props: ButtonProps) => {
{ const priorityDetails = ISSUE_PRIORITIES.find((p) => p.key === priority); const priorityClasses = { - urgent: "bg-red-500/20 text-red-950", + urgent: "bg-danger-component-surface-dark text-red-950", high: "bg-orange-500/20 text-orange-950", medium: "bg-yellow-500/20 text-yellow-950", low: "bg-blue-500/20 text-blue-950", @@ -140,7 +140,7 @@ const BackgroundButton = (props: ButtonProps) => { // compact the icons if text is hidden "px-0.5": hideText, // highlight the whole button if text is hidden and priority is urgent - "bg-red-500 border-red-500": priority === "urgent" && hideText && highlightUrgent, + "bg-danger-solid border-red-500": priority === "urgent" && hideText && highlightUrgent, }, className )} @@ -149,7 +149,7 @@ const BackgroundButton = (props: ButtonProps) => {
{ // compact the icons if text is hidden "px-0.5": hideText, // highlight the whole button if text is hidden and priority is urgent - "bg-red-500 border-red-500": priority === "urgent" && hideText && highlightUrgent, + "bg-danger-solid border-red-500": priority === "urgent" && hideText && highlightUrgent, "bg-neutral-component-surface-dark": isActive, }, className @@ -220,7 +220,7 @@ const TransparentButton = (props: ButtonProps) => {
= (props) => { // states const [isOpen, setIsOpen] = useState(false); const [openColorPicker, setOpenColorPicker] = useState(false); - const [activeColor, setActiveColor] = useState("rgb(var(--color-text-200))"); + const [activeColor, setActiveColor] = useState("var(--color-neutral-110)"); const [recentEmojis, setRecentEmojis] = useState([]); const buttonRef = useRef(null); diff --git a/web/components/estimates/delete-estimate-modal.tsx b/web/components/estimates/delete-estimate-modal.tsx index 7fc861112..e89f44de5 100644 --- a/web/components/estimates/delete-estimate-modal.tsx +++ b/web/components/estimates/delete-estimate-modal.tsx @@ -89,8 +89,8 @@ export const DeleteEstimateModal: React.FC = observer((props) => {
- -
); diff --git a/web/components/gantt-chart/chart/bi-week.tsx b/web/components/gantt-chart/chart/bi-week.tsx index 907d27f95..d3fc51bb2 100644 --- a/web/components/gantt-chart/chart/bi-week.tsx +++ b/web/components/gantt-chart/chart/bi-week.tsx @@ -30,7 +30,7 @@ export const BiWeekChartView: FC = () => { >
{_item.title}
diff --git a/web/components/gantt-chart/chart/day.tsx b/web/components/gantt-chart/chart/day.tsx index 3ca1e0b8f..769d64344 100644 --- a/web/components/gantt-chart/chart/day.tsx +++ b/web/components/gantt-chart/chart/day.tsx @@ -30,7 +30,7 @@ export const DayChartView: FC = () => { >
{_item.title}
diff --git a/web/components/gantt-chart/chart/hours.tsx b/web/components/gantt-chart/chart/hours.tsx index a367c56dd..b42c62245 100644 --- a/web/components/gantt-chart/chart/hours.tsx +++ b/web/components/gantt-chart/chart/hours.tsx @@ -30,7 +30,7 @@ export const HourChartView: FC = () => { >
{_item.title}
diff --git a/web/components/gantt-chart/chart/month.tsx b/web/components/gantt-chart/chart/month.tsx index 530a2c51f..a117f7faa 100644 --- a/web/components/gantt-chart/chart/month.tsx +++ b/web/components/gantt-chart/chart/month.tsx @@ -60,7 +60,7 @@ export const MonthChartView: FC = () => { }`} > {/* {monthDay?.today && ( -
+
)} */}
diff --git a/web/components/gantt-chart/chart/quarter.tsx b/web/components/gantt-chart/chart/quarter.tsx index 7a7cbac79..a3887cdb4 100644 --- a/web/components/gantt-chart/chart/quarter.tsx +++ b/web/components/gantt-chart/chart/quarter.tsx @@ -30,7 +30,7 @@ export const QuarterChartView: FC = () => { >
{_item.title}
diff --git a/web/components/gantt-chart/chart/week.tsx b/web/components/gantt-chart/chart/week.tsx index 6042b3ccd..da0cae0d7 100644 --- a/web/components/gantt-chart/chart/week.tsx +++ b/web/components/gantt-chart/chart/week.tsx @@ -30,7 +30,7 @@ export const WeekChartView: FC = () => { >
{_item.title}
diff --git a/web/components/gantt-chart/chart/year.tsx b/web/components/gantt-chart/chart/year.tsx index 96e96bcfa..6c621e392 100644 --- a/web/components/gantt-chart/chart/year.tsx +++ b/web/components/gantt-chart/chart/year.tsx @@ -30,7 +30,7 @@ export const YearChartView: FC = () => { >
{_item.title}
diff --git a/web/components/headers/workspace-dashboard.tsx b/web/components/headers/workspace-dashboard.tsx index 5724ffe1e..deb74a532 100644 --- a/web/components/headers/workspace-dashboard.tsx +++ b/web/components/headers/workspace-dashboard.tsx @@ -39,7 +39,7 @@ export const WorkspaceDashboardHeader = () => { rel="noopener noreferrer" className="flex flex-shrink-0 items-center gap-1.5 rounded bg-neutral-component-surface-dark px-3 py-1.5" > - + {"What's new?"} = ({ width = "24", height = "24", // eslint-disable-next-line @typescript-eslint/no-unused-vars - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", className, }) => ( = ({ width = "24", height = "24", - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", className, }) => ( = ({ width = "24", height = "24", - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", className, }) => ( = ({ width = "24", height = "24", - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", className, }) => ( = ({ width = "24", height = "24" diff --git a/web/components/icons/calendar-before-icon.tsx b/web/components/icons/calendar-before-icon.tsx index abcbfb3e9..a9729f87e 100644 --- a/web/components/icons/calendar-before-icon.tsx +++ b/web/components/icons/calendar-before-icon.tsx @@ -14,13 +14,13 @@ export const CalendarBeforeIcon: React.FC = ({ width = "24", height = "24 diff --git a/web/components/icons/calendar-month-icon.tsx b/web/components/icons/calendar-month-icon.tsx index cf541d4dc..82323fb0f 100644 --- a/web/components/icons/calendar-month-icon.tsx +++ b/web/components/icons/calendar-month-icon.tsx @@ -13,7 +13,7 @@ export const CalendarMonthIcon: React.FC = ({ width = "24", height = "24" > ); diff --git a/web/components/icons/check.tsx b/web/components/icons/check.tsx index e62e4e46a..08cc35f7e 100644 --- a/web/components/icons/check.tsx +++ b/web/components/icons/check.tsx @@ -5,7 +5,7 @@ import type { Props } from "./types"; export const CheckIcon: React.FC = ({ width = "24", height = "24", - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", className, }) => ( = ({ width = "24", height = "24", - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", className, }) => ( = ({ width = "24", height = "24", - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", className, }) => ( = ({ width = "20", height = "20", className, - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", }) => ( = ({ width = "81", height = "80", // eslint-disable-next-line @typescript-eslint/no-unused-vars - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", className, }) => ( = ({ width = "24", height = "24", - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", className, }) => ( = ({ width = "24", height = "24", className, - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", }) => ( = ({ width = "24", height = "24", clas > diff --git a/web/components/icons/github-icon.tsx b/web/components/icons/github-icon.tsx index c2bf8f491..ebe35fc61 100644 --- a/web/components/icons/github-icon.tsx +++ b/web/components/icons/github-icon.tsx @@ -16,7 +16,7 @@ export const GithubIcon: React.FC = ({ width = "24", height = "24", class fillRule="evenodd" clipRule="evenodd" d="M10 0C4.475 0 0 4.475 0 10C0 14.425 2.8625 18.1625 6.8375 19.4875C7.3375 19.575 7.525 19.275 7.525 19.0125C7.525 18.775 7.5125 17.9875 7.5125 17.15C5 17.6125 4.35 16.5375 4.15 15.975C4.0375 15.6875 3.55 14.8 3.125 14.5625C2.775 14.375 2.275 13.9125 3.1125 13.9C3.9 13.8875 4.4625 14.625 4.65 14.925C5.55 16.4375 6.9875 16.0125 7.5625 15.75C7.65 15.1 7.9125 14.6625 8.2 14.4125C5.975 14.1625 3.65 13.3 3.65 9.475C3.65 8.3875 4.0375 7.4875 4.675 6.7875C4.575 6.5375 4.225 5.5125 4.775 4.1375C4.775 4.1375 5.6125 3.875 7.525 5.1625C8.325 4.9375 9.175 4.825 10.025 4.825C10.875 4.825 11.725 4.9375 12.525 5.1625C14.4375 3.8625 15.275 4.1375 15.275 4.1375C15.825 5.5125 15.475 6.5375 15.375 6.7875C16.0125 7.4875 16.4 8.375 16.4 9.475C16.4 13.3125 14.0625 14.1625 11.8375 14.4125C12.2 14.725 12.5125 15.325 12.5125 16.2625C12.5125 17.6 12.5 18.675 12.5 19.0125C12.5 19.275 12.6875 19.5875 13.1875 19.4875C15.1726 18.8173 16.8976 17.5414 18.1197 15.8395C19.3418 14.1375 19.9994 12.0952 20 10C20 4.475 15.525 0 10 0Z" - fill={color ? color : "rgb(var(--color-text-200))"} + fill={color ? color : "var(--color-neutral-110)"} /> diff --git a/web/components/icons/grid-view-icons.tsx b/web/components/icons/grid-view-icons.tsx index a4a3a9aec..89f1db78c 100644 --- a/web/components/icons/grid-view-icons.tsx +++ b/web/components/icons/grid-view-icons.tsx @@ -5,7 +5,7 @@ import type { Props } from "./types"; export const GridViewIcon: React.FC = ({ width = "24", height = "24", - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", className, }) => ( = ({ width = "24", height = "24", - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", className, }) => ( = ({ width = "24", height = "24", - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", className, }) => ( = ({ width = "24", height = "24", - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", className, }) => ( = ({ width = "24", height = "24", className, - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", }) => ( = ({ width = "24", height = "16", - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", className, }) => ( = ({ width = "24", height = "24", - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", className, }) => ( = ({ width = "24", height = "24", - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", className, }) => ( = ({ width = "24", height = "24", className, - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", }) => ( = ({ width = "24", height = "24", className, - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", }) => ( = ({ width = "24", height = "24", className, - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", }) => ( = ({ width = "24", height = "24", - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", className, }) => ( = ({ width = "24", height = "24", cl > ); diff --git a/web/components/icons/users.tsx b/web/components/icons/users.tsx index ffff9fc73..4df3d7646 100644 --- a/web/components/icons/users.tsx +++ b/web/components/icons/users.tsx @@ -5,7 +5,7 @@ import type { Props } from "./types"; export const UsersIcon: React.FC = ({ width = "24", height = "24", - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", className, }) => ( = ({ width = "24", height = "24", className, - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", }) => ( = ({ width = "24", height = "24", className, - color = "rgb(var(--color-text-200))", + color = "var(--color-neutral-110)", }) => ( = observer((p } + prependIcon={} onClick={() => setAcceptIssueModal(true)} > Accept @@ -335,7 +335,7 @@ export const InboxIssueActionsHeader: FC = observer((p } + prependIcon={} onClick={() => setDeclineIssueModal(true)} > Decline @@ -348,7 +348,7 @@ export const InboxIssueActionsHeader: FC = observer((p } + prependIcon={} onClick={() => setDeleteIssueModal(true)} > Delete diff --git a/web/components/inbox/modals/accept-issue-modal.tsx b/web/components/inbox/modals/accept-issue-modal.tsx index 0f07bc5ec..04d1dd749 100644 --- a/web/components/inbox/modals/accept-issue-modal.tsx +++ b/web/components/inbox/modals/accept-issue-modal.tsx @@ -59,7 +59,7 @@ export const AcceptIssueModal: React.FC = ({ isOpen, onClose, data, onSub
- + diff --git a/web/components/inbox/modals/decline-issue-modal.tsx b/web/components/inbox/modals/decline-issue-modal.tsx index ee1c1d5e3..da3329c0b 100644 --- a/web/components/inbox/modals/decline-issue-modal.tsx +++ b/web/components/inbox/modals/decline-issue-modal.tsx @@ -59,8 +59,8 @@ export const DeclineIssueModal: React.FC = ({ isOpen, onClose, data, onSu
- -
@@ -148,7 +150,7 @@ export const JiraGetImportDetail: React.FC = observer(() => { )} /> {errors.metadata?.cloud_hostname && ( -

{errors.metadata.cloud_hostname.message}

+

{errors.metadata.cloud_hostname.message}

)}
diff --git a/web/components/integration/single-import.tsx b/web/components/integration/single-import.tsx index 6c13565ef..f2f6e9106 100644 --- a/web/components/integration/single-import.tsx +++ b/web/components/integration/single-import.tsx @@ -27,11 +27,11 @@ export const SingleImport: React.FC = ({ service, refreshing, handleDelet diff --git a/web/components/integration/single-integration-card.tsx b/web/components/integration/single-integration-card.tsx index 3e21673d2..82368c646 100644 --- a/web/components/integration/single-integration-card.tsx +++ b/web/components/integration/single-integration-card.tsx @@ -116,7 +116,7 @@ export const SingleIntegrationCard: React.FC = observer(({ integration })

{integration.title} {workspaceIntegrations - ? isInstalled && + ? isInstalled && : null}

diff --git a/web/components/issues/attachment/attachment-upload.tsx b/web/components/issues/attachment/attachment-upload.tsx index 9aaf1fc13..3d28ecb11 100644 --- a/web/components/issues/attachment/attachment-upload.tsx +++ b/web/components/issues/attachment/attachment-upload.tsx @@ -70,7 +70,7 @@ export const IssueAttachmentUpload: React.FC = observer((props) => { {isDragActive ? (

Drop here...

) : fileError ? ( -

{fileError}

+

{fileError}

) : isLoading ? (

Uploading...

) : ( diff --git a/web/components/issues/attachment/delete-attachment-confirmation-modal.tsx b/web/components/issues/attachment/delete-attachment-confirmation-modal.tsx index 03b4d8e17..e015bfe09 100644 --- a/web/components/issues/attachment/delete-attachment-confirmation-modal.tsx +++ b/web/components/issues/attachment/delete-attachment-confirmation-modal.tsx @@ -65,7 +65,7 @@ export const IssueAttachmentDeleteModal: FC = (props) => {
-
diff --git a/web/components/issues/delete-archived-issue-modal.tsx b/web/components/issues/delete-archived-issue-modal.tsx index a6029aa5e..9a9773594 100644 --- a/web/components/issues/delete-archived-issue-modal.tsx +++ b/web/components/issues/delete-archived-issue-modal.tsx @@ -97,8 +97,8 @@ export const DeleteArchivedIssueModal: React.FC = observer((props) => {
- -