Web: Files: fixed badge theme

packages/client/src/pages/Home/InfoPanel/Body/views/Members/sub-components/LinkRow.js

@@ -169,7 +169,6 @@ const LinkRow = (props) => {
   return (
     <StyledLinkRow {...rest} isExpired={isExpired}>
       <Avatar
-        className="avatar"
         size="min"
         source={EyeReactSvgUrl}
         roleIcon={expiryDate ? <ClockReactSvg /> : null}

packages/client/src/pages/Home/InfoPanel/Body/views/Members/sub-components/StyledPublicRoom.js

@@ -90,12 +90,13 @@ const StyledLinkRow = styled.div`
   }
 
   .avatar_role-wrapper {
-    ${({ isExpired }) =>
-      isExpired &&
+    ${({ isExpired, theme }) =>
       css`
         svg {
           path {
-            fill: #f98e86;
+            fill: ${isExpired
+              ? theme.infoPanel.links.iconErrorColor
+              : theme.infoPanel.links.iconColor};
           }
         }
       `}

packages/components/themes/base.js

@@ -2013,6 +2013,11 @@ const Base = {
     closeButtonSize: "17px",
     closeButtonBg: "transparent",
 
+    links: {
+      iconColor: "#3B72A7",
+      iconErrorColor: "rgba(242, 28, 14, 0.5)", //"#F21C0E",
+    },
+
     members: {
       iconColor: "#A3A9AE",
       iconHoverColor: "#657077",

packages/components/themes/dark.js

@@ -2009,6 +2009,11 @@ const Dark = {
     closeButtonSize: "12px",
     closeButtonBg: "#a2a2a2",
 
+    links: {
+      iconColor: "#858585",
+      iconErrorColor: "rgba(242, 28, 14, 0.5)", //"#F21C0E",
+    },
+
     members: {
       iconColor: "#A3A9AE",
       iconHoverColor: "#ffffff",