diff --git a/app/[locale]/roadmap/tracks/_components/tracks.tsx b/app/[locale]/roadmap/tracks/_components/tracks.tsx index 5b682f379c7..f2bad1b22cf 100644 --- a/app/[locale]/roadmap/tracks/_components/tracks.tsx +++ b/app/[locale]/roadmap/tracks/_components/tracks.tsx @@ -101,61 +101,61 @@ const RoadmapTracksPage = () => { const popoverConfig = { endGoal: { border: "border-primary", - background: "bg-primary-high-contrast-linear-gradient", + background: "bg-gradient-to-b from-primary-high-contrast/10", pillStyles: "bg-primary text-body-inverse", pillText: "END GOAL", }, featureResearch: { border: "border-border", - background: "bg-background-medium-linear-gradient", + background: "bg-gradient-to-b from-background-medium/10", pillStyles: "bg-background-medium", pillText: "RESEARCH", }, featureScheduled: { border: "border-warning", - background: "bg-warning-linear-gradient", + background: "bg-gradient-to-b from-warning/10", pillStyles: "bg-warning", pillText: "SCHEDULED", }, featureShipped: { border: "border-success", - background: "bg-success-linear-gradient", + background: "bg-gradient-to-b from-success/10", pillStyles: "bg-success", pillText: "SHIPPED", }, rollupStage: { border: "border-primary-high-contrast", - background: "bg-primary-high-contrast-linear-gradient", + background: "bg-gradient-to-b from-primary-high-contrast/10", pillStyles: "bg-primary-high-contrast text-body-inverse", pillText: "STAGE", }, taskIdea: { border: "border-background-highlight", - background: "bg-background-high-linear-gradient", + background: "bg-gradient-to-b from-background-high/10", pillStyles: "bg-background-high", pillText: "IDEA", }, taskResearch: { border: "border-border", - background: "bg-background-medium-linear-gradient", + background: "bg-gradient-to-b from-medium/10", pillStyles: "bg-background-medium", pillText: "RESEARCH", }, taskScheduled: { border: "border-warning", - background: "bg-warning-linear-gradient", + background: "bg-gradient-to-b from-warning/10", pillStyles: "bg-warning", pillText: "SCHEDULED", }, taskShipped: { border: "border-success", - background: "bg-success-linear-gradient", + background: "bg-gradient-to-b from-success/10", pillStyles: "bg-success", pillText: "SHIPPED", }, track: { border: "border-primary", - background: "bg-primary-high-contrast-linear-gradient", + background: "bg-gradient-to-b from-primary-high-contrast/10", pillStyles: "bg-primary-high-contrast text-body-inverse", pillText: "TRACK", }, diff --git a/src/styles/semantic-tokens.css b/src/styles/semantic-tokens.css index 5942ccc861f..b8fb9a8be9f 100644 --- a/src/styles/semantic-tokens.css +++ b/src/styles/semantic-tokens.css @@ -89,12 +89,6 @@ --card-gradient-secondary: linear-gradient(95deg, rgba(211, 145, 242, 0.12) 0%, rgba(159, 43, 212, 0.12) 102.78%); --card-gradient-secondary-hover: linear-gradient(95deg, rgba(211, 145, 242, 0.2) 0%, rgba(159, 43, 212, 0.2) 102.78%); - --success-linear-gradient: linear-gradient(to bottom, hsla(var(--green-600), 0.10), hsla(var(--white), 1)); - --warning-linear-gradient: linear-gradient(to bottom, hsla(var(--yellow-300), 0.10), hsla(var(--white), 1)); - --background-medium-linear-gradient: linear-gradient(to bottom, hsla(var(--background-medium), 0.10), hsla(var(--white), 1)); - --background-high-linear-gradient: linear-gradient(to bottom, hsla(var(--background-high), 0.10), hsla(var(--white), 1)); - --primary-high-contrast-linear-gradient: linear-gradient(to bottom, hsla(var(--primary-high-contrast), 0.10), hsla(var(--white), 1)); - /* Shadows */ --shadow-color-a: hsla(var(--purple-800), 0.02); --shadow-color-b: hsla(var(--red-800), 0.04); @@ -210,12 +204,6 @@ --roadmap-card-gradient: linear-gradient(123deg, rgba(34, 34, 34, 0.20) 40.53%, rgba(174, 110, 203, 0.13) 104.05%); - --success-linear-gradient: linear-gradient(to bottom, hsla(var(--green-600), 0.10), hsla(var(--black), 1)); - --warning-linear-gradient: linear-gradient(to bottom, hsla(var(--yellow-300), 0.10), hsla(var(--black), 1)); - --background-medium-linear-gradient: linear-gradient(to bottom, hsla(var(--background-medium), 0.10), hsla(var(--black), 1)); - --background-high-linear-gradient: linear-gradient(to bottom, hsla(var(--background-high), 0.10), hsla(var(--black), 1)); - --primary-high-contrast-linear-gradient: linear-gradient(to bottom, hsla(var(--primary-high-contrast), 0.10), hsla(var(--black), 1)); - /* Shadows (dark mode adjustments) */ --shadow-color: hsla(var(--white), 0.04); --shadow-svg-button-link-1: -2px 2px 12px 1px var(--shadow-color); diff --git a/tailwind.config.ts b/tailwind.config.ts index b6fe5beddcd..268a8425fa4 100644 --- a/tailwind.config.ts +++ b/tailwind.config.ts @@ -234,14 +234,6 @@ const config = { "card-gradient": "var(--card-gradient)", "card-gradient-secondary": "var(--card-gradient-secondary)", "card-gradient-secondary-hover": "var(--card-gradient-secondary-hover)", - "success-linear-gradient": "var(--success-linear-gradient)", - "warning-linear-gradient": "var(--warning-linear-gradient)", - "background-medium-linear-gradient": - "var(--background-medium-linear-gradient)", - "background-high-linear-gradient": - "var(--background-high-linear-gradient)", - "primary-high-contrast-linear-gradient": - "var(--primary-high-contrast-linear-gradient)", }, boxShadow: { "table-box": "var(--table-box-shadow)",