From 5125e9ea28758b56f0c5337614000c50da1fbabe Mon Sep 17 00:00:00 2001
From: Tero Tikkanen <tero.tikkanen@gmail.com>
Date: Wed, 25 Oct 2023 17:04:50 +0300
Subject: [PATCH] Fix id contrast for reverse colour category badges

---
 components/actions/CategoryTags.tsx | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/components/actions/CategoryTags.tsx b/components/actions/CategoryTags.tsx
index f6ca4d0e..5424f2b8 100644
--- a/components/actions/CategoryTags.tsx
+++ b/components/actions/CategoryTags.tsx
@@ -4,6 +4,7 @@ import styled from 'styled-components';
 import { ActionListLink, StaticPageLink } from 'common/links';
 import BadgeTooltip from 'components/common/BadgeTooltip';
 import PopoverTip from 'components/common/PopoverTip';
+import { readableColor } from 'polished';
 import {
   CategoryTagsCategoryFragment,
   CategoryTagsCategoryTypeFragment,
@@ -87,7 +88,12 @@ type CategoryContentProps = {
 };
 
 const Identifier = styled.span`
-  color: ${(props) => props.theme.graphColors.grey060};
+  color: ${(props) =>
+    readableColor(
+      props.theme.neutralLight,
+      props.theme.graphColors.grey070,
+      props.theme.graphColors.grey020
+    )};
 `;
 
 export const CategoryContent = (props: CategoryContentProps) => {