@thecb/components 5.2.3 → 5.3.3-beta.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thecb/components",
-  "version": "5.2.3",
+  "version": "5.3.3-beta.0",
   "description": "Common lib for CityBase react components",
   "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",

package/src/components/molecules/terms-and-conditions-modal/TermsAndConditionsModal.js

@@ -47,11 +47,6 @@ const TermsAndConditionsModal = ({
       color={themeValues.linkColor}
       weight={themeValues.fontWeight}
       hoverStyles={themeValues.modalLinkHoverFocus}
-      extraStyles={`cursor: pointer;    
-      &:focus { 
-        outline: 3px solid ${themeValues.accessibilityColor}; 
-        outline-offset: 2px; 
-      }`}
     >
       {link}
     </Text>

package/src/components/molecules/terms-and-conditions-modal/TermsAndConditionsModal.theme.js

@@ -12,11 +12,20 @@ const fontWeight = {
   default: FONT_WEIGHT_REGULAR,
   footer: FONT_WEIGHT_SEMIBOLD
 };
+const standardInteractionStyles = `
+    &:hover {
+      outline: none; 
+      text-decoration: underline;
+    }
+    &:focus {
+      outline: 3px solid #3181E3;
+      outline-offset: 2px;
+    }
+`;
 const modalLinkHoverFocus = {
-  default: `outline: none; text-decoration: underline;`,
-  footer: `outline: none; text-decoration: underline;`
+  default: standardInteractionStyles,
+  footer: standardInteractionStyles
 };
-const accessibilityColor = { default: "#3181E3", footer: "#3181E3" };
 
 export const fallbackValues = {
   backgroundColor,
@@ -25,6 +34,5 @@ export const fallbackValues = {
   fontSize,
   lineHeight,
   fontWeight,
-  modalLinkHoverFocus,
-  accessibilityColor
+  modalLinkHoverFocus
 };