@thecb/components 8.4.5-beta.5 → 8.4.5-beta.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thecb/components",
-  "version": "8.4.5-beta.5",
+  "version": "8.4.5-beta.7",
   "description": "Common lib for CityBase react components",
   "main": "dist/index.cjs.js",
   "typings": "dist/index.d.ts",

package/src/components/molecules/link-card/LinkCard.js

@@ -1,7 +1,7 @@
 import React, { useContext } from "react";
 import { Box, Stack } from "../../atoms/layouts";
-// import { themeComponent } from "../../../util/themeUtils";
-// import { fallbackValues } from "./LinkCard.theme";
+import { themeComponent } from "../../../util/themeUtils";
+import { fallbackValues } from "./LinkCard.theme";
 import { ThemeContext } from "styled-components";
 import * as Styled from "./LinkCard.styled";
 
@@ -83,5 +83,5 @@ const LinkCard = ({
   );
 };
 
-// export default themeComponent(LinkCard, "LinkCard", fallbackValues, "default");
-export default LinkCard;
+export default themeComponent(LinkCard, "LinkCard", fallbackValues);
+// export default LinkCard;

package/src/components/molecules/link-card/LinkCard.styled.js

@@ -32,13 +32,12 @@ export const Container = styled(Box)`
   }
 
   &:hover:not(:active) {
-    ${({ themeValues }) =>
-      `border: 1px solid rgba(${themeValues.borderColor}, .3);`}
+    ${({ themeValues }) => `border: 1px solid ${themeValues.borderColor};`}
   }
 
   &:active {
     ${({ themeValues }) => `
-      background-color: rgba(${themeValues.activeBackgroundColor}, 0.1);
+      background-color: ${themeValues.activeBackgroundColor};
       border: 1px solid ${themeValues.color};
     ;`}
   }

package/src/components/molecules/link-card/LinkCard.theme.js

@@ -5,10 +5,10 @@ import {
   ROYAL_BLUE_VIVID
 } from "../../../constants/colors";
 
-const activeBackgroundColor = { default: CORNFLOWER_BLUE };
-const backgroundColor = { default: LINK_WATER };
-const borderColor = { default: MOON_RAKER };
-const color = { default: ROYAL_BLUE_VIVID };
+const activeBackgroundColor = CORNFLOWER_BLUE;
+const backgroundColor = LINK_WATER;
+const borderColor = MOON_RAKER;
+const color = ROYAL_BLUE_VIVID;
 
 export const fallbackValues = {
   activeBackgroundColor,