fix: updated text and background colors (#1496)
* fix: custom colors opacity * chore: update text colors for dark mode * fix: dropdown text colors, datepicker bg color * chore: update text colors * chore: updated primary bg color
This commit is contained in:
parent
7554988164
commit
253edebb93
29 changed files with 158 additions and 139 deletions
|
|
@ -8,6 +8,7 @@ import { findHowManyDaysLeft, renderShortDateWithYearFormat } from "helpers/date
|
|||
import trackEventServices from "services/track-event.service";
|
||||
// types
|
||||
import { ICurrentUserResponse, IIssue } from "types";
|
||||
import useIssuesView from "hooks/use-issues-view";
|
||||
|
||||
type Props = {
|
||||
issue: IIssue;
|
||||
|
|
@ -29,6 +30,8 @@ export const ViewDueDateSelect: React.FC<Props> = ({
|
|||
const router = useRouter();
|
||||
const { workspaceSlug } = router.query;
|
||||
|
||||
const { issueView } = useIssuesView();
|
||||
|
||||
return (
|
||||
<Tooltip
|
||||
tooltipHeading="Due Date"
|
||||
|
|
@ -71,7 +74,9 @@ export const ViewDueDateSelect: React.FC<Props> = ({
|
|||
user
|
||||
);
|
||||
}}
|
||||
className={issue?.target_date ? "w-[6.5rem]" : "w-[5rem] text-center"}
|
||||
className={`${issue?.target_date ? "w-[6.5rem]" : "w-[5rem] text-center"} ${
|
||||
issueView === "kanban" ? "bg-custom-background-90" : "bg-custom-background-100"
|
||||
}`}
|
||||
noBorder={noBorder}
|
||||
disabled={isNotAllowed}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -71,9 +71,15 @@ export const ViewLabelSelect: React.FC<Props> = ({
|
|||
position={tooltipPosition}
|
||||
tooltipHeading="Labels"
|
||||
tooltipContent={
|
||||
issue.label_details.length > 0
|
||||
? issue.label_details.map((label) => label.name ?? "").join(", ")
|
||||
: "No Label"
|
||||
issue.labels.length > 0
|
||||
? issue.labels
|
||||
.map((labelId) => {
|
||||
const label = issueLabels?.find((l) => l.id === labelId);
|
||||
|
||||
return label?.name ?? "";
|
||||
})
|
||||
.join(", ")
|
||||
: "No label"
|
||||
}
|
||||
>
|
||||
<div
|
||||
|
|
@ -81,20 +87,23 @@ export const ViewLabelSelect: React.FC<Props> = ({
|
|||
isNotAllowed ? "cursor-not-allowed" : "cursor-pointer"
|
||||
} items-center gap-2 text-custom-text-200`}
|
||||
>
|
||||
{issue.label_details.length > 0 ? (
|
||||
{issue.labels.length > 0 ? (
|
||||
<>
|
||||
{issue.label_details.slice(0, 4).map((label, index) => (
|
||||
<div className={`flex h-4 w-4 rounded-full ${index ? "-ml-3.5" : ""}`}>
|
||||
<span
|
||||
className={`h-4 w-4 flex-shrink-0 rounded-full border group-hover:bg-custom-background-80 border-custom-border-100
|
||||
`}
|
||||
style={{
|
||||
backgroundColor: label?.color && label.color !== "" ? label.color : "#000000",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
{issue.label_details.length > 4 ? <span>+{issue.label_details.length - 4}</span> : null}
|
||||
{issue.labels.slice(0, 4).map((labelId, index) => {
|
||||
const label = issueLabels?.find((l) => l.id === labelId);
|
||||
|
||||
return (
|
||||
<div className={`flex h-4 w-4 rounded-full ${index ? "-ml-3.5" : ""}`}>
|
||||
<span
|
||||
className={`h-4 w-4 flex-shrink-0 rounded-full border group-hover:bg-custom-background-80 border-custom-border-100`}
|
||||
style={{
|
||||
backgroundColor: label?.color ?? "#000000",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
{issue.labels.length > 4 ? <span>+{issue.labels.length - 4}</span> : null}
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
|
|
|
|||
|
|
@ -10,7 +10,6 @@ import { CustomSearchSelect, Tooltip } from "components/ui";
|
|||
// icons
|
||||
import { getStateGroupIcon } from "components/icons";
|
||||
// helpers
|
||||
import { addSpaceIfCamelCase } from "helpers/string.helper";
|
||||
import { getStatesList } from "helpers/state.helper";
|
||||
// types
|
||||
import { ICurrentUserResponse, IIssue } from "types";
|
||||
|
|
@ -67,7 +66,7 @@ export const ViewStateSelect: React.FC<Props> = ({
|
|||
const stateLabel = (
|
||||
<Tooltip
|
||||
tooltipHeading="State"
|
||||
tooltipContent={addSpaceIfCamelCase(selectedOption?.name ?? "")}
|
||||
tooltipContent={selectedOption?.name ?? ""}
|
||||
position={tooltipPosition}
|
||||
>
|
||||
<div className="flex items-center cursor-pointer w-full gap-2 text-custom-text-200">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue