@veracity/vui 2.0.2 → 2.0.3

package/dist/cjs/header/headerNotifications.js

@@ -22,7 +22,7 @@ const utils_1 = require("../utils");
 const context_1 = require("./context");
 const Badge = core_1.styled.spanBox `
   align-items: center;
-  background-color: red.70;
+  background-color: hsl(357, 83%, 60%);
   border-radius: round;
   color: white;
   display: flex;
@@ -41,7 +41,7 @@ exports.HeaderNotifications = (0, core_1.vui)((props, ref) => {
     const { children, className, count = 0, url } = props, rest = __rest(props, ["children", "className", "count", "url"]);
     const { links } = (_a = (0, context_1.useHeaderContext)()) !== null && _a !== void 0 ? _a : {};
     const styles = (0, core_1.useStyleConfig)('Header', (0, context_1.useHeaderContext)()).notifications;
-    return (react_1.default.createElement(button_1.default, Object.assign({ as: "a", className: (0, utils_1.cs)('vui-headerNotifications', className), href: url !== null && url !== void 0 ? url : links.notifications, minW: 0, ml: 1, position: "relative", px: "7px", ref: ref, title: "Notifications", variant: "text" }, styles.container, rest), children !== null && children !== void 0 ? children : (react_1.default.createElement(react_1.default.Fragment, null,
+    return (react_1.default.createElement(button_1.default, Object.assign({ as: "a", className: (0, utils_1.cs)('vui-headerNotifications', className), href: url !== null && url !== void 0 ? url : links.notifications, minW: 0, ml: 1, position: "relative", px: "7px", ref: ref, title: "Notifications", variant: "tertiaryDark" }, styles.container, rest), children !== null && children !== void 0 ? children : (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(button_1.default.Icon, { name: "falBell" }),
         count > 0 && react_1.default.createElement(Badge, null, count < 100 ? count : '99+')))));
 });

package/dist/esm/header/headerNotifications.js

@@ -5,7 +5,7 @@ import { cs } from '../utils';
 import { useHeaderContext } from './context';
 const Badge = styled.spanBox `
   align-items: center;
-  background-color: red.70;
+  background-color: hsl(357, 83%, 60%);
   border-radius: round;
   color: white;
   display: flex;
@@ -23,7 +23,7 @@ export const HeaderNotifications = vui((props, ref) => {
     const { children, className, count = 0, url, ...rest } = props;
     const { links } = useHeaderContext() ?? {};
     const styles = useStyleConfig('Header', useHeaderContext()).notifications;
-    return (React.createElement(Button, { as: "a", className: cs('vui-headerNotifications', className), href: url ?? links.notifications, minW: 0, ml: 1, position: "relative", px: "7px", ref: ref, title: "Notifications", variant: "text", ...styles.container, ...rest }, children ?? (React.createElement(React.Fragment, null,
+    return (React.createElement(Button, { as: "a", className: cs('vui-headerNotifications', className), href: url ?? links.notifications, minW: 0, ml: 1, position: "relative", px: "7px", ref: ref, title: "Notifications", variant: "tertiaryDark", ...styles.container, ...rest }, children ?? (React.createElement(React.Fragment, null,
         React.createElement(Button.Icon, { name: "falBell" }),
         count > 0 && React.createElement(Badge, null, count < 100 ? count : '99+')))));
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@veracity/vui",
-  "version": "2.0.2",
+  "version": "2.0.3",
   "description": "Veracity UI is a React component library crafted for use within Veracity applications and pages. Based on Styled Components and @xstyled.",
   "module": "./dist/esm/index.js",
   "main": "./dist/cjs/index.js",

package/src/header/headerNotifications.tsx

@@ -8,7 +8,7 @@ import { HeaderNotificationsProps } from './header.types'
 
 const Badge = styled.spanBox`
   align-items: center;
-  background-color: red.70;
+  background-color: hsl(357, 83%, 60%);
   border-radius: round;
   color: white;
   display: flex;
@@ -39,7 +39,7 @@ export const HeaderNotifications = vui<'a', HeaderNotificationsProps>((props, re
       px="7px"
       ref={ref}
       title="Notifications"
-      variant="text"
+      variant="tertiaryDark"
       {...styles.container}
       {...rest}
     >