@designsystem-se/af 34.2.0 → 34.2.1-beta.0

package/dist/cjs/typography-variation.enum-2cf77231.js

@@ -0,0 +1,266 @@
+'use strict';
+
+exports.BadgeNotificationType = void 0;
+(function (BadgeNotificationType) {
+    BadgeNotificationType["NUMBER"] = "number";
+    BadgeNotificationType["WORD"] = "word";
+})(exports.BadgeNotificationType || (exports.BadgeNotificationType = {}));
+
+exports.CalendarDatepickerValidation = void 0;
+(function (CalendarDatepickerValidation) {
+    CalendarDatepickerValidation["SUCCESS"] = "success";
+    CalendarDatepickerValidation["ERROR"] = "error";
+    CalendarDatepickerValidation["WARNING"] = "warning";
+    CalendarDatepickerValidation["NEUTRAL"] = "neutral";
+})(exports.CalendarDatepickerValidation || (exports.CalendarDatepickerValidation = {}));
+
+exports.CodeBlockLanguage = void 0;
+(function (CodeBlockLanguage) {
+    CodeBlockLanguage["JSON"] = "json";
+    CodeBlockLanguage["CSS"] = "css";
+    CodeBlockLanguage["SCSS"] = "scss";
+    CodeBlockLanguage["TYPESCRIPT"] = "typescript";
+    CodeBlockLanguage["JAVASCRIPT"] = "javascript";
+    CodeBlockLanguage["BASH"] = "bash";
+    CodeBlockLanguage["HTML"] = "html";
+    CodeBlockLanguage["GIT"] = "git";
+    CodeBlockLanguage["JSX"] = "jsx";
+    CodeBlockLanguage["TSX"] = "tsx";
+})(exports.CodeBlockLanguage || (exports.CodeBlockLanguage = {}));
+
+exports.DialogHeadingLevel = void 0;
+(function (DialogHeadingLevel) {
+    DialogHeadingLevel["H1"] = "h1";
+    DialogHeadingLevel["H2"] = "h2";
+    DialogHeadingLevel["H3"] = "h3";
+    DialogHeadingLevel["H4"] = "h4";
+    DialogHeadingLevel["H5"] = "h5";
+    DialogHeadingLevel["H6"] = "h6";
+})(exports.DialogHeadingLevel || (exports.DialogHeadingLevel = {}));
+
+exports.DialogSize = void 0;
+(function (DialogSize) {
+    DialogSize["SMALL"] = "small";
+    DialogSize["MEDIUM"] = "medium";
+    DialogSize["LARGE"] = "large";
+})(exports.DialogSize || (exports.DialogSize = {}));
+
+exports.DialogVariation = void 0;
+(function (DialogVariation) {
+    DialogVariation["PRIMARY"] = "primary";
+    DialogVariation["SECONDARY"] = "secondary";
+})(exports.DialogVariation || (exports.DialogVariation = {}));
+
+exports.FooterVariation = void 0;
+(function (FooterVariation) {
+    FooterVariation["LARGE"] = "large";
+    FooterVariation["SMALL"] = "small";
+})(exports.FooterVariation || (exports.FooterVariation = {}));
+
+exports.FormErrorListHeadingLevel = void 0;
+(function (FormErrorListHeadingLevel) {
+    FormErrorListHeadingLevel["H1"] = "h1";
+    FormErrorListHeadingLevel["H2"] = "h2";
+    FormErrorListHeadingLevel["H3"] = "h3";
+    FormErrorListHeadingLevel["H4"] = "h4";
+    FormErrorListHeadingLevel["H5"] = "h5";
+    FormErrorListHeadingLevel["H6"] = "h6";
+})(exports.FormErrorListHeadingLevel || (exports.FormErrorListHeadingLevel = {}));
+
+exports.FormInputMode = void 0;
+(function (FormInputMode) {
+    FormInputMode["DEFAULT"] = "";
+    FormInputMode["NONE"] = "none";
+    FormInputMode["TEXT"] = "text";
+    FormInputMode["DECIMAL"] = "decimal";
+    FormInputMode["NUMERIC"] = "numeric";
+    FormInputMode["TEL"] = "tel";
+    FormInputMode["SEARCH"] = "search";
+    FormInputMode["EMAIL"] = "email";
+    FormInputMode["URL"] = "url";
+})(exports.FormInputMode || (exports.FormInputMode = {}));
+
+exports.FormInputValidation = void 0;
+(function (FormInputValidation) {
+    FormInputValidation["SUCCESS"] = "success";
+    FormInputValidation["ERROR"] = "error";
+    FormInputValidation["WARNING"] = "warning";
+    FormInputValidation["NEUTRAL"] = "neutral";
+})(exports.FormInputValidation || (exports.FormInputValidation = {}));
+
+exports.FormInputVariation = void 0;
+(function (FormInputVariation) {
+    FormInputVariation["SMALL"] = "small";
+    FormInputVariation["MEDIUM"] = "medium";
+    FormInputVariation["LARGE"] = "large";
+})(exports.FormInputVariation || (exports.FormInputVariation = {}));
+
+exports.FormRadiobuttonLayout = void 0;
+(function (FormRadiobuttonLayout) {
+    FormRadiobuttonLayout["INLINE"] = "inline";
+    FormRadiobuttonLayout["BLOCK"] = "block";
+})(exports.FormRadiobuttonLayout || (exports.FormRadiobuttonLayout = {}));
+
+exports.FormRadiobuttonValidation = void 0;
+(function (FormRadiobuttonValidation) {
+    FormRadiobuttonValidation["ERROR"] = "error";
+})(exports.FormRadiobuttonValidation || (exports.FormRadiobuttonValidation = {}));
+
+exports.FormRadiobuttonVariation = void 0;
+(function (FormRadiobuttonVariation) {
+    FormRadiobuttonVariation["PRIMARY"] = "primary";
+    FormRadiobuttonVariation["SECONDARY"] = "secondary";
+})(exports.FormRadiobuttonVariation || (exports.FormRadiobuttonVariation = {}));
+
+exports.FormReceiptHeadingLevel = void 0;
+(function (FormReceiptHeadingLevel) {
+    FormReceiptHeadingLevel["H1"] = "h1";
+    FormReceiptHeadingLevel["H2"] = "h2";
+    FormReceiptHeadingLevel["H3"] = "h3";
+    FormReceiptHeadingLevel["H4"] = "h4";
+    FormReceiptHeadingLevel["H5"] = "h5";
+    FormReceiptHeadingLevel["H6"] = "h6";
+})(exports.FormReceiptHeadingLevel || (exports.FormReceiptHeadingLevel = {}));
+
+exports.FormReceiptType = void 0;
+(function (FormReceiptType) {
+    FormReceiptType["CENTER"] = "center";
+    FormReceiptType["START"] = "start";
+})(exports.FormReceiptType || (exports.FormReceiptType = {}));
+
+exports.FormReceiptVariation = void 0;
+(function (FormReceiptVariation) {
+    FormReceiptVariation["FULLWIDTH"] = "fullwidth";
+    FormReceiptVariation["GRID"] = "grid";
+})(exports.FormReceiptVariation || (exports.FormReceiptVariation = {}));
+
+exports.FormSelectFilterValidation = void 0;
+(function (FormSelectFilterValidation) {
+    FormSelectFilterValidation["SUCCESS"] = "success";
+    FormSelectFilterValidation["ERROR"] = "error";
+    FormSelectFilterValidation["WARNING"] = "warning";
+    FormSelectFilterValidation["NEUTRAL"] = "neutral";
+})(exports.FormSelectFilterValidation || (exports.FormSelectFilterValidation = {}));
+
+exports.FormSelectValidation = void 0;
+(function (FormSelectValidation) {
+    FormSelectValidation["SUCCESS"] = "success";
+    FormSelectValidation["ERROR"] = "error";
+    FormSelectValidation["WARNING"] = "warning";
+    FormSelectValidation["NEUTRAL"] = "neutral";
+})(exports.FormSelectValidation || (exports.FormSelectValidation = {}));
+
+exports.FormSelectVariation = void 0;
+(function (FormSelectVariation) {
+    FormSelectVariation["SMALL"] = "small";
+    FormSelectVariation["MEDIUM"] = "medium";
+    FormSelectVariation["LARGE"] = "large";
+})(exports.FormSelectVariation || (exports.FormSelectVariation = {}));
+
+exports.HeaderCenterContentWidth = void 0;
+(function (HeaderCenterContentWidth) {
+    HeaderCenterContentWidth["DEFAULT"] = "none";
+    HeaderCenterContentWidth["WIDTH_1200"] = "1200";
+    HeaderCenterContentWidth["WIDTH_1400"] = "1400";
+})(exports.HeaderCenterContentWidth || (exports.HeaderCenterContentWidth = {}));
+
+exports.InfoCardMultiContainerHeadingLevel = void 0;
+(function (InfoCardMultiContainerHeadingLevel) {
+    InfoCardMultiContainerHeadingLevel["H1"] = "h1";
+    InfoCardMultiContainerHeadingLevel["H2"] = "h2";
+    InfoCardMultiContainerHeadingLevel["H3"] = "h3";
+    InfoCardMultiContainerHeadingLevel["H4"] = "h4";
+    InfoCardMultiContainerHeadingLevel["H5"] = "h5";
+    InfoCardMultiContainerHeadingLevel["H6"] = "h6";
+})(exports.InfoCardMultiContainerHeadingLevel || (exports.InfoCardMultiContainerHeadingLevel = {}));
+
+exports.InfoCardMultiHeadingLevel = void 0;
+(function (InfoCardMultiHeadingLevel) {
+    InfoCardMultiHeadingLevel["H1"] = "h1";
+    InfoCardMultiHeadingLevel["H2"] = "h2";
+    InfoCardMultiHeadingLevel["H3"] = "h3";
+    InfoCardMultiHeadingLevel["H4"] = "h4";
+    InfoCardMultiHeadingLevel["H5"] = "h5";
+    InfoCardMultiHeadingLevel["H6"] = "h6";
+})(exports.InfoCardMultiHeadingLevel || (exports.InfoCardMultiHeadingLevel = {}));
+
+exports.InfoCardMultiVariation = void 0;
+(function (InfoCardMultiVariation) {
+    InfoCardMultiVariation["PRIMARY"] = "primary";
+    InfoCardMultiVariation["SECONDARY"] = "secondary";
+})(exports.InfoCardMultiVariation || (exports.InfoCardMultiVariation = {}));
+
+exports.InfoCardHeadingLevel = void 0;
+(function (InfoCardHeadingLevel) {
+    InfoCardHeadingLevel["H1"] = "h1";
+    InfoCardHeadingLevel["H2"] = "h2";
+    InfoCardHeadingLevel["H3"] = "h3";
+    InfoCardHeadingLevel["H4"] = "h4";
+    InfoCardHeadingLevel["H5"] = "h5";
+    InfoCardHeadingLevel["H6"] = "h6";
+})(exports.InfoCardHeadingLevel || (exports.InfoCardHeadingLevel = {}));
+
+exports.NotificationAlertHeadingLevel = void 0;
+(function (NotificationAlertHeadingLevel) {
+    NotificationAlertHeadingLevel["H1"] = "h1";
+    NotificationAlertHeadingLevel["H2"] = "h2";
+    NotificationAlertHeadingLevel["H3"] = "h3";
+    NotificationAlertHeadingLevel["H4"] = "h4";
+    NotificationAlertHeadingLevel["H5"] = "h5";
+    NotificationAlertHeadingLevel["H6"] = "h6";
+})(exports.NotificationAlertHeadingLevel || (exports.NotificationAlertHeadingLevel = {}));
+
+exports.NotificationAlertSize = void 0;
+(function (NotificationAlertSize) {
+    NotificationAlertSize["LARGE"] = "large";
+    NotificationAlertSize["MEDIUM"] = "medium";
+    NotificationAlertSize["SMALL"] = "small";
+})(exports.NotificationAlertSize || (exports.NotificationAlertSize = {}));
+
+exports.NotificationAlertVariation = void 0;
+(function (NotificationAlertVariation) {
+    NotificationAlertVariation["INFO"] = "info";
+    NotificationAlertVariation["SUCCESS"] = "success";
+    NotificationAlertVariation["WARNING"] = "warning";
+    NotificationAlertVariation["DANGER"] = "danger";
+})(exports.NotificationAlertVariation || (exports.NotificationAlertVariation = {}));
+
+exports.ErrorPageStatusCodes = void 0;
+(function (ErrorPageStatusCodes) {
+    ErrorPageStatusCodes["UNAUTHORIZED"] = "401";
+    ErrorPageStatusCodes["FORBIDDEN"] = "403";
+    ErrorPageStatusCodes["NOT_FOUND"] = "404";
+    ErrorPageStatusCodes["GONE"] = "410";
+    ErrorPageStatusCodes["INTERNAL_SERVER_ERRROR"] = "500";
+    ErrorPageStatusCodes["SERVICE_UNAVAILABLE"] = "503";
+    ErrorPageStatusCodes["GATEWAY_TIMEOUT"] = "504";
+    ErrorPageStatusCodes["BLOCKED"] = "blocked";
+})(exports.ErrorPageStatusCodes || (exports.ErrorPageStatusCodes = {}));
+
+exports.ToolsFeedbackHeadingLevel = void 0;
+(function (ToolsFeedbackHeadingLevel) {
+    ToolsFeedbackHeadingLevel["H1"] = "h1";
+    ToolsFeedbackHeadingLevel["H2"] = "h2";
+    ToolsFeedbackHeadingLevel["H3"] = "h3";
+    ToolsFeedbackHeadingLevel["H4"] = "h4";
+    ToolsFeedbackHeadingLevel["H5"] = "h5";
+    ToolsFeedbackHeadingLevel["H6"] = "h6";
+})(exports.ToolsFeedbackHeadingLevel || (exports.ToolsFeedbackHeadingLevel = {}));
+
+exports.ToolsFeedbackType = void 0;
+(function (ToolsFeedbackType) {
+    ToolsFeedbackType["FULLWIDTH"] = "fullwidth";
+    ToolsFeedbackType["GRID"] = "grid";
+})(exports.ToolsFeedbackType || (exports.ToolsFeedbackType = {}));
+
+exports.FeedbackVariation = void 0;
+(function (FeedbackVariation) {
+    FeedbackVariation["PRIMARY"] = "primary";
+    FeedbackVariation["SECONDARY"] = "secondary";
+})(exports.FeedbackVariation || (exports.FeedbackVariation = {}));
+
+exports.TypographyVariation = void 0;
+(function (TypographyVariation) {
+    TypographyVariation["SMALL"] = "small";
+    TypographyVariation["LARGE"] = "large";
+})(exports.TypographyVariation || (exports.TypographyVariation = {}));

package/dist/collection/collection-manifest.json

@@ -6,7 +6,6 @@
     "components/_calendar/calendar/calendar.js",
     "components/_calendar/calendar-datepicker/calendar-datepicker.js",
     "components/_calendar/week-view/calendar-week-view.js",
-    "components/_card/card/card.js",
     "components/_chart/bar-chart/bar-chart.js",
     "components/_chart/chart-line/chart-line.js",
     "components/_code/code/code.js",
@@ -39,7 +38,6 @@
     "components/_header/header-navigation/header-navigation.js",
     "components/_header/header-navigation-item/header-navigation-item.js",
     "components/_header/header-notification/header-notification.js",
-    "components/_icon/icon/icon.js",
     "components/_icon/icon-accessibility-deaf/icon-accessibility-deaf.js",
     "components/_icon/icon-accessibility-universal/icon-accessibility-universal.js",
     "components/_icon/icon-apple/icon-apple.js",
@@ -250,8 +248,6 @@
     "components/_media/media-image/media-image.js",
     "components/_navigation/navigation-breadcrumbs/navigation-breadcrumbs.js",
     "components/_navigation/navigation-context-menu/navigation-context-menu.js",
-    "components/_navigation/navigation-context-menu-item-legacy/navigation-context-menu-item.js",
-    "components/_navigation/navigation-context-menu-legacy/navigation-context-menu.js",
     "components/_navigation/navigation-pagination/navigation-pagination.js",
     "components/_navigation/navigation-sidebar/navigation-sidebar.js",
     "components/_navigation/navigation-sidebar-button/navigation-sidebar-button.js",
@@ -273,7 +269,7 @@
     "components/_tools/tools-feedback/tools-feedback.js",
     "components/_tools/tools-feedback-banner/tools-feedback-banner.js",
     "components/_tools/tools-feedback-rating/tools-feedback-rating.js",
-    "components/_tools/tools-languagepicker/tools-languagepicker.js",
+    "components/_tools/tools-theme-provider/tools-theme-provider.js",
     "components/_typography/typography/typography.js",
     "components/_typography/typography-heading-jumbo/typography-heading-jumbo.js",
     "components/_typography/typography-meta/typography-meta.js",

package/dist/collection/components/_badge/badge-notification/badge-notification.css

@@ -1,281 +1,18 @@
-/** Do not touch! Autogenerated 
-* @prop --digi--badge-notification--color--text: var(--digi--color--text--inverted);
-* @prop --digi--badge-notification--color--border: var(--digi--color--border--inverted);
-* @prop --digi--badge-notification--background-color: var(--digi--color--background--danger-4);
-* @prop --digi--badge-notification--font-weight:var(--digi--typography--button--font-weight--desktop);
-*/
 /* http://meyerweb.com/eric/tools/css/reset/
 v2.0 | 20110126
 License: none (public domain)
 */
-.digi--util--fs--xs {
-  font-size: var(--digi--global--typography--font-size--small) !important;
-}
-
-.digi--util--fs--s {
-  font-size: calc(var(--digi--global--typography--font-size--small) + 1px) !important;
-}
-
-.digi--util--fs--m {
-  font-size: var(--digi--global--typography--font-size--base) !important;
-}
-
-.digi--util--fs--l {
-  font-size: var(--digi--global--typography--font-size--large) !important;
-}
-
-.digi--util--fw--sb {
-  font-weight: var(--digi--global--typography--font-weight--semibold) !important;
-}
-
-.digi--util--pt--1 {
-  padding-top: var(--digi--global--spacing--smallest-2) !important;
-}
-
-.digi--util--pt--10 {
-  padding-top: var(--digi--global--spacing--smallest) !important;
-}
-
-.digi--util--pt--20 {
-  padding-top: var(--digi--global--spacing--base) !important;
-}
-
-.digi--util--pt--30 {
-  padding-top: var(--digi--global--spacing--largest-2) !important;
-}
-
-.digi--util--pt--40 {
-  padding-top: var(--digi--global--spacing--largest-4) !important;
-}
-
-.digi--util--pt--50 {
-  padding-top: 2.5rem !important;
-}
-
-.digi--util--pt--60 {
-  padding-top: var(--digi--global--spacing--largest-5) !important;
-}
-
-.digi--util--pt--70 {
-  padding-top: var(--digi--global--spacing--largest-6) !important;
-}
-
-.digi--util--pt--80 {
-  padding-top: 4.5rem !important;
-}
-
-.digi--util--pt--90 {
-  padding-top: 5rem !important;
-}
-
-.digi--util--pb--1 {
-  padding-bottom: var(--digi--global--spacing--smallest-2) !important;
-}
-
-.digi--util--pb--10 {
-  padding-bottom: var(--digi--global--spacing--smallest) !important;
-}
-
-.digi--util--pb--20 {
-  padding-bottom: var(--digi--global--spacing--base) !important;
-}
-
-.digi--util--pb--30 {
-  padding-bottom: var(--digi--global--spacing--largest-2) !important;
-}
-
-.digi--util--pb--40 {
-  padding-bottom: var(--digi--global--spacing--largest-4) !important;
-}
-
-.digi--util--pb--50 {
-  padding-bottom: 2.5rem !important;
-}
-
-.digi--util--pb--60 {
-  padding-bottom: var(--digi--global--spacing--largest-5) !important;
-}
-
-.digi--util--pb--70 {
-  padding-bottom: var(--digi--global--spacing--largest-6) !important;
-}
-
-.digi--util--pb--80 {
-  padding-bottom: 4.5rem !important;
-}
-
-.digi--util--pb--90 {
-  padding-bottom: 5rem !important;
-}
-
-.digi--util--p--1 {
-  padding: var(--digi--global--spacing--smallest-2) !important;
-}
-
-.digi--util--p--10 {
-  padding: var(--digi--global--spacing--smallest) !important;
-}
-
-.digi--util--p--20 {
-  padding: var(--digi--global--spacing--base) !important;
-}
-
-.digi--util--p--30 {
-  padding: var(--digi--global--spacing--largest-2) !important;
-}
-
-.digi--util--p--40 {
-  padding: var(--digi--global--spacing--largest-4) !important;
-}
-
-.digi--util--p--50 {
-  padding: 2.5rem !important;
-}
-
-.digi--util--p--60 {
-  padding: var(--digi--global--spacing--largest-5) !important;
-}
-
-.digi--util--p--70 {
-  padding: var(--digi--global--spacing--largest-6) !important;
-}
-
-.digi--util--p--80 {
-  padding: 4.5rem !important;
-}
-
-.digi--util--p--90 {
-  padding: 5rem !important;
-}
-
-.digi--util--ptb--1 {
-  padding-top: var(--digi--global--spacing--smallest-2) !important;
-  padding-bottom: var(--digi--global--spacing--smallest-2) !important;
-}
-
-.digi--util--ptb--10 {
-  padding-top: var(--digi--global--spacing--smallest) !important;
-  padding-bottom: var(--digi--global--spacing--smallest) !important;
-}
-
-.digi--util--ptb--20 {
-  padding-top: var(--digi--global--spacing--base) !important;
-  padding-bottom: var(--digi--global--spacing--base) !important;
-}
-
-.digi--util--ptb--30 {
-  padding-top: var(--digi--global--spacing--largest-2) !important;
-  padding-bottom: var(--digi--global--spacing--largest-2) !important;
-}
-
-.digi--util--ptb--40 {
-  padding-top: var(--digi--global--spacing--largest-4) !important;
-  padding-bottom: var(--digi--global--spacing--largest-4) !important;
-}
-
-.digi--util--ptb--50 {
-  padding-top: 2.5rem !important;
-  padding-bottom: 2.5rem !important;
-}
-
-.digi--util--ptb--60 {
-  padding-top: var(--digi--global--spacing--largest-5) !important;
-  padding-bottom: var(--digi--global--spacing--largest-5) !important;
-}
-
-.digi--util--ptb--70 {
-  padding-top: var(--digi--global--spacing--largest-6) !important;
-  padding-bottom: var(--digi--global--spacing--largest-6) !important;
-}
-
-.digi--util--ptb--80 {
-  padding-top: 4.5rem !important;
-  padding-bottom: 4.5rem !important;
-}
-
-.digi--util--ptb--90 {
-  padding-top: 5rem !important;
-  padding-bottom: 5rem !important;
-}
-
-.digi--util--plr--1 {
-  padding-left: var(--digi--global--spacing--smallest-2) !important;
-  padding-right: var(--digi--global--spacing--smallest-2) !important;
-}
-
-.digi--util--plr--10 {
-  padding-left: var(--digi--global--spacing--smallest) !important;
-  padding-right: var(--digi--global--spacing--smallest) !important;
-}
-
-.digi--util--plr--20 {
-  padding-left: var(--digi--global--spacing--base) !important;
-  padding-right: var(--digi--global--spacing--base) !important;
-}
-
-.digi--util--plr--30 {
-  padding-left: var(--digi--global--spacing--largest-2) !important;
-  padding-right: var(--digi--global--spacing--largest-2) !important;
-}
-
-.digi--util--plr--40 {
-  padding-left: var(--digi--global--spacing--largest-4) !important;
-  padding-right: var(--digi--global--spacing--largest-4) !important;
-}
-
-.digi--util--plr--50 {
-  padding-left: 2.5rem !important;
-  padding-right: 2.5rem !important;
-}
-
-.digi--util--plr--60 {
-  padding-left: var(--digi--global--spacing--largest-5) !important;
-  padding-right: var(--digi--global--spacing--largest-5) !important;
-}
-
-.digi--util--plr--70 {
-  padding-left: var(--digi--global--spacing--largest-6) !important;
-  padding-right: var(--digi--global--spacing--largest-6) !important;
-}
-
-.digi--util--plr--80 {
-  padding-left: 4.5rem !important;
-  padding-right: 4.5rem !important;
-}
-
-.digi--util--plr--90 {
-  padding-left: 5rem !important;
-  padding-right: 5rem !important;
-}
-
-.digi--util--sr-only {
-  border: 0;
-  clip: rect(1px, 1px, 1px, 1px);
-  -webkit-clip-path: inset(50%);
-  clip-path: inset(50%);
-  height: 1px;
-  margin: -1px;
-  overflow: hidden;
-  padding: 0;
-  position: absolute;
-  width: 1px;
-  white-space: nowrap;
-}
-
-.digi--util--hidden {
-  display: none;
-}
-
 :host {
-  --digi--badge-notification--color--text: var(--digi--color--text--inverted);
-  --digi--badge-notification--color--border: var(--digi--color--border--inverted);
-  --digi--badge-notification--background-color: var(--digi--color--background--danger-4);
-  --digi--badge-notification--font-weight:var(--digi--typography--button--font-weight--desktop);
+  --digi--badge-notification--color--text: var(--digi--color--text--secondary);
+  --digi--badge-notification--color--border: var(--digi--color--border--notification);
+  --digi--badge-notification--background-color: var(--digi--color--background--notification);
+  --digi--badge-notification--font-weight:var(--digi--global--typography--font-weight--semibold);
 }
 :host .digi-badge-notification {
   font-size: 0.75rem;
   font-weight: var(--digi--badge-notification--font-weight);
-  border: var(--digi--border-width--secondary) solid;
+  border-width: var(--digi--border-width--secondary);
+  border-style: solid;
   color: var(--digi--badge-notification--color--text);
   background-color: var(--digi--badge-notification--background-color);
   border-color: var(--BORDER-COLOR);