@inera/ids-design 5.1.1 → 5.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (26) hide show
  1. package/components/dropdown/dropdown-lit.js +1 -1
  2. package/components/dropdown/dropdown.css +7 -12
  3. package/components/header-1177/composite-header-1177.css +55 -56
  4. package/components/header-1177/header-1177-nav-item-lit.js +1 -1
  5. package/components/header-1177/header-1177-nav-item-mobile-lit.js +1 -1
  6. package/components/header-1177/header-1177-nav-item-mobile.css +1 -0
  7. package/components/header-1177/header-1177-nav-item.css +52 -56
  8. package/components/header-1177/header-1177-nav-lit.js +1 -1
  9. package/components/header-1177/header-1177-nav.css +2 -0
  10. package/components/header-1177-admin/header-1177-admin-nav-item-lit.js +1 -1
  11. package/components/header-1177-admin/header-1177-admin-nav-item.css +8 -8
  12. package/components/header-1177-pro/header-1177-pro-nav-item-lit.js +1 -1
  13. package/components/header-1177-pro/header-1177-pro-nav-item.css +8 -24
  14. package/components/header-inera/header-inera-nav-item-lit.js +1 -1
  15. package/components/header-inera/header-inera-nav-item.css +1 -1
  16. package/components/header-inera-admin/composite-header-inera-admin.css +1 -1
  17. package/components/header-inera-admin/header-inera-admin-nav-item-lit.js +1 -1
  18. package/components/header-inera-admin/header-inera-admin-nav-item.css +1 -1
  19. package/components/navigation/content/navigation-content-lit.js +1 -1
  20. package/components/navigation/content/navigation-content.css +2 -2
  21. package/global/global.css +25 -46
  22. package/package.json +1 -1
  23. package/themes/1177/1177.css +29 -46
  24. package/themes/1177-pro/1177-pro.css +29 -46
  25. package/themes/inera/inera.css +29 -46
  26. package/themes/inera-admin/inera-admin.css +29 -46
@@ -1,6 +1,6 @@
1
1
  import { css, unsafeCSS } from 'lit';
2
2
 
3
- var css_248z = "@media (max-width:1023px){.ids-desktop{display:none!important}}@media (min-width:1024px){.ids-mobile{display:none!important}}.ids-header-inera-nav-item{display:none}.ids-header-inera-nav-item ::slotted(.ids-link),.ids-header-inera-nav-item ::slotted(a){bottom:0;left:0;opacity:0;position:absolute;right:0;top:0}.ids-header-inera-nav-item .ids-notification-badge,.ids-header-inera-nav-item ids-notification-badge{display:inline-flex;height:0;margin-left:3px;position:relative;top:-2px}.ids-header-inera-nav-item.ids-header-inera-nav-item--unresponsive{display:block}.ids-header-inera-nav-item:focus-within .ids-header-inera-nav-item__link{outline:var(--focus_outline);outline-offset:-5px}.ids-header-inera-nav-item .ids-header-inera-nav-item__button,.ids-header-inera-nav-item .ids-header-inera-nav-item__link{background-color:transparent;border:0;color:var(--IDS-COLOR-NEUTRAL-20);cursor:pointer;display:block;font-family:var(--font-family_2);font-size:18px;font-weight:600;line-height:24px;outline-offset:-2px!important;padding:8px 16px;position:relative;text-decoration:none}.ids-header-inera-nav-item .ids-header-inera-nav-item__button a,.ids-header-inera-nav-item .ids-header-inera-nav-item__link a{color:var(--IDS-COLOR-NEUTRAL-20);font-family:var(--font-family_2);text-decoration:none}.ids-header-inera-nav-item .ids-header-inera-nav-item__button a:focus,.ids-header-inera-nav-item .ids-header-inera-nav-item__link a:focus{outline:none}.ids-header-inera-nav-item .ids-header-inera-nav-item__button.ids-header-inera-nav-item__button--active,.ids-header-inera-nav-item .ids-header-inera-nav-item__button.ids-header-inera-nav-item__link--active,.ids-header-inera-nav-item .ids-header-inera-nav-item__link.ids-header-inera-nav-item__button--active,.ids-header-inera-nav-item .ids-header-inera-nav-item__link.ids-header-inera-nav-item__link--active{background-color:var(--header-nav-item-active_background-color)}.ids-header-inera-nav-item .ids-header-inera-nav-item__button.ids-header-inera-nav-item__button--active:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__button.ids-header-inera-nav-item__link--active:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__link.ids-header-inera-nav-item__button--active:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__link.ids-header-inera-nav-item__link--active:after{right:0;width:auto}.ids-header-inera-nav-item .ids-header-inera-nav-item__button.ids-header-inera-nav-item__button--expanded,.ids-header-inera-nav-item .ids-header-inera-nav-item__link.ids-header-inera-nav-item__button--expanded{background-color:var(--header-nav-item-expanded_background-color);border:var(--header-nav-item-expanded_border)!important;color:var(--header-nav-item-expanded_color)}.ids-header-inera-nav-item .ids-header-inera-nav-item__button.ids-header-inera-nav-item__button--expanded:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__link.ids-header-inera-nav-item__button--expanded:after{right:0;width:auto}.ids-header-inera-nav-item .ids-header-inera-nav-item__button:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__link:after{background:var(--header-nav-item-after_background);bottom:0;content:\"\";display:block;height:5px;left:0;margin-left:10px;margin-right:10px;position:absolute;right:100%;transition:all .3s ease;width:0}.ids-header-inera-nav-item .ids-header-inera-nav-item__button:hover,.ids-header-inera-nav-item .ids-header-inera-nav-item__link:hover{border:var(--header-nav-item-hover_border);text-decoration:none}.ids-header-inera-nav-item .ids-header-inera-nav-item__button:hover:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__link:hover:after{right:0;width:auto}.ids-header-inera-nav-item .ids-header-inera-nav-item__button.focus-within:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__button:focus-visible:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__button:focus:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__link.focus-within:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__link:focus-visible:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__link:focus:after{right:0;width:auto}.ids-header-inera-nav-item .ids-header-inera-nav-item__button:focus-visible:focus,.ids-header-inera-nav-item .ids-header-inera-nav-item__link:focus-visible:focus{outline:var(--IDS-FOCUS_OUTLINE);outline-offset:-2px!important}.ids-header-inera-nav-item .ids-header-inera-nav-item__content{background-color:var(--IDS-COLOR-SECONDARY-95);box-shadow:0 4px 8px 0 rgba(53,53,53,.2);box-sizing:border-box;display:flex;left:0;min-height:173px;overflow:hidden;padding:40px 16px 50px;position:absolute;right:0;top:101%;width:100%;z-index:20}.ids-header-inera-nav-item .ids-header-inera-nav-item__content-inner{display:flex;margin:0 auto;max-width:var(--IDS_MAX-WIDTH);width:100%}.ids-header-inera-nav-item .ids-header-inera-nav-item__content-inner.ids-header-inera-nav-item__content-inner--fluid{max-width:none}.ids-header-inera-nav-item .ids-header-inera-nav-item__content-col{flex:0 25%}.ids-header-inera-nav-item ::slotted([slot=col-1]),.ids-header-inera-nav-item ::slotted([slot=col-2]),.ids-header-inera-nav-item ::slotted([slot=col-3]),.ids-header-inera-nav-item ::slotted([slot=col-4]){border-bottom:var(--header-nav-item-link_border-bottom);display:block;font-size:1rem;line-height:24px;margin-bottom:10px;margin-right:40px;padding-bottom:10px}.ids-header-inera-nav-item ::slotted([slot=col-1]) a,.ids-header-inera-nav-item ::slotted([slot=col-2]) a,.ids-header-inera-nav-item ::slotted([slot=col-3]) a,.ids-header-inera-nav-item ::slotted([slot=col-4]) a{display:block}.ids-header-inera-nav-item .ids-header-inera-nav-item__content-col>div{border-bottom:var(--header-nav-item-link_border-bottom);display:block;font-size:1rem;line-height:24px;margin-bottom:10px;margin-right:40px;padding-bottom:10px}@media only screen and (min-width:1024px){.ids-header-inera-nav-item{display:flex}.ids-header-inera-nav-item .ids-header-inera-nav-item__content{padding:40px 88px 50px}}@media only screen and (max-width:1440){.ids-header-inera-nav-item .nav-item{font-size:1.0625rem!important}}";
3
+ var css_248z = "@media (max-width:1023px){.ids-desktop{display:none!important}}@media (min-width:1024px){.ids-mobile{display:none!important}}.ids-header-inera-nav-item{display:none}.ids-header-inera-nav-item ::slotted(.ids-link),.ids-header-inera-nav-item ::slotted(a){bottom:0;left:0;opacity:0;position:absolute;right:0;top:0}.ids-header-inera-nav-item .ids-notification-badge,.ids-header-inera-nav-item ids-notification-badge{display:inline-flex;height:0;margin-left:3px;position:relative;top:-2px}.ids-header-inera-nav-item.ids-header-inera-nav-item--unresponsive{display:block}.ids-header-inera-nav-item:focus-within .ids-header-inera-nav-item__link{outline:var(--focus_outline);outline-offset:-5px}.ids-header-inera-nav-item .ids-header-inera-nav-item__button,.ids-header-inera-nav-item .ids-header-inera-nav-item__link{background-color:transparent;border:0;color:var(--IDS-COLOR-NEUTRAL-20);cursor:pointer;display:block;font-family:var(--font-family_2);font-size:18px;font-weight:600;line-height:24px;outline-offset:-2px!important;padding:8px 10px;position:relative;text-decoration:none}.ids-header-inera-nav-item .ids-header-inera-nav-item__button a,.ids-header-inera-nav-item .ids-header-inera-nav-item__link a{color:var(--IDS-COLOR-NEUTRAL-20);font-family:var(--font-family_2);text-decoration:none}.ids-header-inera-nav-item .ids-header-inera-nav-item__button a:focus,.ids-header-inera-nav-item .ids-header-inera-nav-item__link a:focus{outline:none}.ids-header-inera-nav-item .ids-header-inera-nav-item__button.ids-header-inera-nav-item__button--active,.ids-header-inera-nav-item .ids-header-inera-nav-item__button.ids-header-inera-nav-item__link--active,.ids-header-inera-nav-item .ids-header-inera-nav-item__link.ids-header-inera-nav-item__button--active,.ids-header-inera-nav-item .ids-header-inera-nav-item__link.ids-header-inera-nav-item__link--active{background-color:var(--header-nav-item-active_background-color)}.ids-header-inera-nav-item .ids-header-inera-nav-item__button.ids-header-inera-nav-item__button--active:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__button.ids-header-inera-nav-item__link--active:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__link.ids-header-inera-nav-item__button--active:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__link.ids-header-inera-nav-item__link--active:after{right:0;width:auto}.ids-header-inera-nav-item .ids-header-inera-nav-item__button.ids-header-inera-nav-item__button--expanded,.ids-header-inera-nav-item .ids-header-inera-nav-item__link.ids-header-inera-nav-item__button--expanded{background-color:var(--header-nav-item-expanded_background-color);border:var(--header-nav-item-expanded_border)!important;color:var(--header-nav-item-expanded_color)}.ids-header-inera-nav-item .ids-header-inera-nav-item__button.ids-header-inera-nav-item__button--expanded:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__link.ids-header-inera-nav-item__button--expanded:after{right:0;width:auto}.ids-header-inera-nav-item .ids-header-inera-nav-item__button:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__link:after{background:var(--header-nav-item-after_background);bottom:0;content:\"\";display:block;height:5px;left:0;margin-left:10px;margin-right:10px;position:absolute;right:100%;transition:all .3s ease;width:0}.ids-header-inera-nav-item .ids-header-inera-nav-item__button:hover,.ids-header-inera-nav-item .ids-header-inera-nav-item__link:hover{border:var(--header-nav-item-hover_border);text-decoration:none}.ids-header-inera-nav-item .ids-header-inera-nav-item__button:hover:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__link:hover:after{right:0;width:auto}.ids-header-inera-nav-item .ids-header-inera-nav-item__button.focus-within:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__button:focus-visible:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__button:focus:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__link.focus-within:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__link:focus-visible:after,.ids-header-inera-nav-item .ids-header-inera-nav-item__link:focus:after{right:0;width:auto}.ids-header-inera-nav-item .ids-header-inera-nav-item__button:focus-visible:focus,.ids-header-inera-nav-item .ids-header-inera-nav-item__link:focus-visible:focus{outline:var(--IDS-FOCUS_OUTLINE);outline-offset:-2px!important}.ids-header-inera-nav-item .ids-header-inera-nav-item__content{background-color:var(--IDS-COLOR-SECONDARY-95);box-shadow:0 4px 8px 0 rgba(53,53,53,.2);box-sizing:border-box;display:flex;left:0;min-height:173px;overflow:hidden;padding:40px 16px 50px;position:absolute;right:0;top:101%;width:100%;z-index:20}.ids-header-inera-nav-item .ids-header-inera-nav-item__content-inner{display:flex;margin:0 auto;max-width:var(--IDS_MAX-WIDTH);width:100%}.ids-header-inera-nav-item .ids-header-inera-nav-item__content-inner.ids-header-inera-nav-item__content-inner--fluid{max-width:none}.ids-header-inera-nav-item .ids-header-inera-nav-item__content-col{flex:0 25%}.ids-header-inera-nav-item ::slotted([slot=col-1]),.ids-header-inera-nav-item ::slotted([slot=col-2]),.ids-header-inera-nav-item ::slotted([slot=col-3]),.ids-header-inera-nav-item ::slotted([slot=col-4]){border-bottom:var(--header-nav-item-link_border-bottom);display:block;font-size:1rem;line-height:24px;margin-bottom:10px;margin-right:40px;padding-bottom:10px}.ids-header-inera-nav-item ::slotted([slot=col-1]) a,.ids-header-inera-nav-item ::slotted([slot=col-2]) a,.ids-header-inera-nav-item ::slotted([slot=col-3]) a,.ids-header-inera-nav-item ::slotted([slot=col-4]) a{display:block}.ids-header-inera-nav-item .ids-header-inera-nav-item__content-col>div{border-bottom:var(--header-nav-item-link_border-bottom);display:block;font-size:1rem;line-height:24px;margin-bottom:10px;margin-right:40px;padding-bottom:10px}@media only screen and (min-width:1024px){.ids-header-inera-nav-item{display:flex}.ids-header-inera-nav-item .ids-header-inera-nav-item__content{padding:40px 88px 50px}}@media only screen and (max-width:1440){.ids-header-inera-nav-item .nav-item{font-size:1.0625rem!important}}";
4
4
 
5
5
  var headerIneraNavItemLit = css`${unsafeCSS(css_248z)}`;
6
6
 
@@ -49,7 +49,7 @@
49
49
  .ids-header-inera-nav-item .ids-header-inera-nav-item__link {
50
50
  display: block;
51
51
  position: relative;
52
- padding: 8px 16px;
52
+ padding: 8px 10px;
53
53
  outline-offset: -2px !important;
54
54
  text-decoration: none;
55
55
  font-size: 18px;
@@ -696,7 +696,7 @@
696
696
  .ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link {
697
697
  display: block;
698
698
  position: relative;
699
- padding: 8px 16px;
699
+ padding: 8px 10px;
700
700
  outline-offset: -2px !important;
701
701
  text-decoration: none;
702
702
  font-size: 18px;
@@ -1,6 +1,6 @@
1
1
  import { css, unsafeCSS } from 'lit';
2
2
 
3
- var css_248z = "@media (max-width:1023px){.ids-desktop{display:none!important}}@media (min-width:1024px){.ids-mobile{display:none!important}}.ids-header-inera-admin-nav-item{display:none}.ids-header-inera-admin-nav-item ::slotted(.ids-link),.ids-header-inera-admin-nav-item ::slotted(a){bottom:0;left:0;opacity:0;position:absolute;right:0;top:0}.ids-header-inera-admin-nav-item .ids-notification-badge,.ids-header-inera-admin-nav-item ids-notification-badge{display:inline-flex;height:0;margin-left:3px;position:relative;top:-2px}.ids-header-inera-admin-nav-item.ids-header-inera-admin-nav-item--unresponsive{display:block}.ids-header-inera-admin-nav-item:focus-within .ids-header-inera-admin-nav-item__link{outline:var(--focus_outline);outline-offset:-5px}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link{background-color:transparent;border:0;color:var(--IDS-COLOR-NEUTRAL-20);cursor:pointer;display:block;font-family:var(--font-family_2);font-size:18px;font-weight:600;line-height:24px;outline-offset:-2px!important;padding:8px 16px;position:relative;text-decoration:none}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button a,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link a{color:var(--IDS-COLOR-NEUTRAL-20);font-family:var(--font-family_2);text-decoration:none}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button a:focus,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link a:focus{outline:none}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button.ids-header-inera-admin-nav-item__button--active,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button.ids-header-inera-admin-nav-item__link--active,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link.ids-header-inera-admin-nav-item__button--active,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link.ids-header-inera-admin-nav-item__link--active{background-color:var(--header-nav-item-active_background-color)}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button.ids-header-inera-admin-nav-item__button--active:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button.ids-header-inera-admin-nav-item__link--active:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link.ids-header-inera-admin-nav-item__button--active:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link.ids-header-inera-admin-nav-item__link--active:after{right:0;width:auto}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button.ids-header-inera-admin-nav-item__button--expanded,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link.ids-header-inera-admin-nav-item__button--expanded{background-color:var(--header-nav-item-expanded_background-color);border:var(--header-nav-item-expanded_border)!important;color:var(--header-nav-item-expanded_color)}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button.ids-header-inera-admin-nav-item__button--expanded:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link.ids-header-inera-admin-nav-item__button--expanded:after{right:0;width:auto}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link:after{background:var(--header-nav-item-after_background);bottom:0;content:\"\";display:block;height:5px;left:0;margin-left:10px;margin-right:10px;position:absolute;right:100%;transition:all .3s ease;width:0}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button:hover,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link:hover{border:var(--header-nav-item-hover_border);text-decoration:none}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button:hover:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link:hover:after{right:0;width:auto}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button.focus-within:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button:focus-visible:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button:focus:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link.focus-within:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link:focus-visible:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link:focus:after{right:0;width:auto}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button:focus-visible:focus,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link:focus-visible:focus{outline:var(--IDS-FOCUS_OUTLINE);outline-offset:-2px!important}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__content{box-shadow:0 4px 8px 0 rgba(53,53,53,.2);box-sizing:border-box;display:flex;left:0;min-height:173px;overflow:hidden;padding:40px 16px 50px;position:absolute;right:0;top:101%;width:100%;z-index:20}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__content-inner{display:flex;margin:0 auto;max-width:var(--IDS_MAX-WIDTH);width:100%}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__content-inner.ids-header-inera-admin-nav-item__content-inner--fluid{max-width:none}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__content-col{flex:0 25%}.ids-header-inera-admin-nav-item ::slotted([slot=col-1]),.ids-header-inera-admin-nav-item ::slotted([slot=col-2]),.ids-header-inera-admin-nav-item ::slotted([slot=col-3]),.ids-header-inera-admin-nav-item ::slotted([slot=col-4]){border-bottom:var(--header-nav-item-link_border-bottom);display:block;font-size:1rem;line-height:24px;margin-bottom:10px;margin-right:40px;padding-bottom:10px}.ids-header-inera-admin-nav-item ::slotted([slot=col-1]) a,.ids-header-inera-admin-nav-item ::slotted([slot=col-2]) a,.ids-header-inera-admin-nav-item ::slotted([slot=col-3]) a,.ids-header-inera-admin-nav-item ::slotted([slot=col-4]) a{display:block}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__content-col>div{border-bottom:var(--header-nav-item-link_border-bottom);display:block;font-size:1rem;line-height:24px;margin-bottom:10px;margin-right:40px;padding-bottom:10px}@media only screen and (min-width:1024px){.ids-header-inera-admin-nav-item{display:flex}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__content{padding:40px 88px 50px}}@media only screen and (max-width:1440){.ids-header-inera-admin-nav-item .nav-item{font-size:1.0625rem!important}}";
3
+ var css_248z = "@media (max-width:1023px){.ids-desktop{display:none!important}}@media (min-width:1024px){.ids-mobile{display:none!important}}.ids-header-inera-admin-nav-item{display:none}.ids-header-inera-admin-nav-item ::slotted(.ids-link),.ids-header-inera-admin-nav-item ::slotted(a){bottom:0;left:0;opacity:0;position:absolute;right:0;top:0}.ids-header-inera-admin-nav-item .ids-notification-badge,.ids-header-inera-admin-nav-item ids-notification-badge{display:inline-flex;height:0;margin-left:3px;position:relative;top:-2px}.ids-header-inera-admin-nav-item.ids-header-inera-admin-nav-item--unresponsive{display:block}.ids-header-inera-admin-nav-item:focus-within .ids-header-inera-admin-nav-item__link{outline:var(--focus_outline);outline-offset:-5px}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link{background-color:transparent;border:0;color:var(--IDS-COLOR-NEUTRAL-20);cursor:pointer;display:block;font-family:var(--font-family_2);font-size:18px;font-weight:600;line-height:24px;outline-offset:-2px!important;padding:8px 10px;position:relative;text-decoration:none}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button a,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link a{color:var(--IDS-COLOR-NEUTRAL-20);font-family:var(--font-family_2);text-decoration:none}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button a:focus,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link a:focus{outline:none}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button.ids-header-inera-admin-nav-item__button--active,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button.ids-header-inera-admin-nav-item__link--active,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link.ids-header-inera-admin-nav-item__button--active,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link.ids-header-inera-admin-nav-item__link--active{background-color:var(--header-nav-item-active_background-color)}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button.ids-header-inera-admin-nav-item__button--active:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button.ids-header-inera-admin-nav-item__link--active:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link.ids-header-inera-admin-nav-item__button--active:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link.ids-header-inera-admin-nav-item__link--active:after{right:0;width:auto}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button.ids-header-inera-admin-nav-item__button--expanded,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link.ids-header-inera-admin-nav-item__button--expanded{background-color:var(--header-nav-item-expanded_background-color);border:var(--header-nav-item-expanded_border)!important;color:var(--header-nav-item-expanded_color)}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button.ids-header-inera-admin-nav-item__button--expanded:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link.ids-header-inera-admin-nav-item__button--expanded:after{right:0;width:auto}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link:after{background:var(--header-nav-item-after_background);bottom:0;content:\"\";display:block;height:5px;left:0;margin-left:10px;margin-right:10px;position:absolute;right:100%;transition:all .3s ease;width:0}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button:hover,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link:hover{border:var(--header-nav-item-hover_border);text-decoration:none}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button:hover:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link:hover:after{right:0;width:auto}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button.focus-within:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button:focus-visible:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button:focus:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link.focus-within:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link:focus-visible:after,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link:focus:after{right:0;width:auto}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__button:focus-visible:focus,.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link:focus-visible:focus{outline:var(--IDS-FOCUS_OUTLINE);outline-offset:-2px!important}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__content{box-shadow:0 4px 8px 0 rgba(53,53,53,.2);box-sizing:border-box;display:flex;left:0;min-height:173px;overflow:hidden;padding:40px 16px 50px;position:absolute;right:0;top:101%;width:100%;z-index:20}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__content-inner{display:flex;margin:0 auto;max-width:var(--IDS_MAX-WIDTH);width:100%}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__content-inner.ids-header-inera-admin-nav-item__content-inner--fluid{max-width:none}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__content-col{flex:0 25%}.ids-header-inera-admin-nav-item ::slotted([slot=col-1]),.ids-header-inera-admin-nav-item ::slotted([slot=col-2]),.ids-header-inera-admin-nav-item ::slotted([slot=col-3]),.ids-header-inera-admin-nav-item ::slotted([slot=col-4]){border-bottom:var(--header-nav-item-link_border-bottom);display:block;font-size:1rem;line-height:24px;margin-bottom:10px;margin-right:40px;padding-bottom:10px}.ids-header-inera-admin-nav-item ::slotted([slot=col-1]) a,.ids-header-inera-admin-nav-item ::slotted([slot=col-2]) a,.ids-header-inera-admin-nav-item ::slotted([slot=col-3]) a,.ids-header-inera-admin-nav-item ::slotted([slot=col-4]) a{display:block}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__content-col>div{border-bottom:var(--header-nav-item-link_border-bottom);display:block;font-size:1rem;line-height:24px;margin-bottom:10px;margin-right:40px;padding-bottom:10px}@media only screen and (min-width:1024px){.ids-header-inera-admin-nav-item{display:flex}.ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__content{padding:40px 88px 50px}}@media only screen and (max-width:1440){.ids-header-inera-admin-nav-item .nav-item{font-size:1.0625rem!important}}";
4
4
 
5
5
  var headerIneraAdminNavItemLit = css`${unsafeCSS(css_248z)}`;
6
6
 
@@ -49,7 +49,7 @@
49
49
  .ids-header-inera-admin-nav-item .ids-header-inera-admin-nav-item__link {
50
50
  display: block;
51
51
  position: relative;
52
- padding: 8px 16px;
52
+ padding: 8px 10px;
53
53
  outline-offset: -2px !important;
54
54
  text-decoration: none;
55
55
  font-size: 18px;
@@ -1,6 +1,6 @@
1
1
  import { css, unsafeCSS } from 'lit';
2
2
 
3
- var css_248z = ".ids-navigation-content{background-color:#fff;border-radius:var(--content-navigation_border-radius);box-shadow:0 0 10px rgba(27,27,27,.2);position:relative;width:100%}.ids-navigation-content:after{background-color:#fff;clip-path:polygon(0 0,0 100%,100% 100%);left:-9px;z-index:1}.ids-navigation-content:after,.ids-navigation-content:before{content:\" \";height:1.4rem;position:absolute;top:20px;transform:rotate(45deg);width:1.4rem}.ids-navigation-content:before{box-shadow:0 0 10px rgba(27,27,27,.2);left:-11px;z-index:-1}.ids-navigation-content .ids-navigation-content__border-top{border-radius:var(--IDS-CARD__BORDER-RADIUS);display:block;height:20px;left:0;overflow:hidden;position:absolute;top:0;width:100%}.ids-navigation-content .ids-navigation-content__border-top div{border-top:var(--IDS-CARD--BORDER-2__INNER__BORDER-TOP)}.ids-navigation-content .ids-navigation-content__inner{border-top:var(--content-navigation_border-top);padding:20px;position:relative}.ids-navigation-content .ids-navigation-content__inner .ids-navigation-content__inner__headline{color:var(--content-navigation_color);font-family:var(--content-navigation_font-family);font-size:var(--content-navigation_font-size);font-weight:var(--content-navigation_font-weight);letter-spacing:-.2px;line-height:var(--content-navigation_line-height);margin:0 0 8px}.ids-navigation-content .ids-navigation-content__inner a{border-top:1px solid var(--content-navigation-separator_background-color);display:flex!important;padding:14px 0}.ids-navigation-content .ids-navigation-content__inner ::slotted(*){border-top:1px solid var(--content-navigation-separator_background-color);display:flex!important;padding:14px 0}";
3
+ var css_248z = ".ids-navigation-content{background-color:#fff;border-radius:var(--content-navigation_border-radius);box-shadow:0 0 10px rgba(27,27,27,.2);position:relative;width:100%}.ids-navigation-content:after{background-color:#fff;clip-path:polygon(0 0,0 100%,100% 100%);left:-9px;z-index:1}.ids-navigation-content:after,.ids-navigation-content:before{content:\" \";height:1.4rem;position:absolute;top:20px;transform:rotate(45deg);width:1.4rem}.ids-navigation-content:before{box-shadow:0 0 10px rgba(27,27,27,.2);left:-11px;z-index:-1}.ids-navigation-content .ids-navigation-content__border-top{border-radius:var(--IDS-CARD__BORDER-RADIUS);display:block;height:20px;left:0;overflow:hidden;position:absolute;top:0;width:100%}.ids-navigation-content .ids-navigation-content__border-top div{border-top:var(--IDS-CARD--BORDER-2__INNER__BORDER-TOP)}.ids-navigation-content .ids-navigation-content__inner{border-top:var(--content-navigation_border-top);padding:20px;position:relative}.ids-navigation-content .ids-navigation-content__inner .ids-navigation-content__inner__headline{color:var(--content-navigation_color);font-family:var(--content-navigation_font-family);font-size:var(--content-navigation_font-size);font-weight:var(--content-navigation_font-weight);letter-spacing:-.2px;line-height:var(--content-navigation_line-height);margin:0 0 8px}.ids-navigation-content .ids-navigation-content__inner a{border-top:1px solid var(--content-navigation-separator_background-color);display:block;padding:14px 0}.ids-navigation-content .ids-navigation-content__inner ::slotted(*){border-top:1px solid var(--content-navigation-separator_background-color);display:block;padding:14px 0}";
4
4
 
5
5
  var navigationContentLit = css`${unsafeCSS(css_248z)}`;
6
6
 
@@ -57,11 +57,11 @@
57
57
  }
58
58
  .ids-navigation-content .ids-navigation-content__inner a {
59
59
  border-top: 1px solid var(--content-navigation-separator_background-color);
60
- display: flex !important;
60
+ display: block;
61
61
  padding: 14px 0px;
62
62
  }
63
63
  .ids-navigation-content .ids-navigation-content__inner ::slotted(*) {
64
64
  border-top: 1px solid var(--content-navigation-separator_background-color);
65
- display: flex !important;
65
+ display: block;
66
66
  padding: 14px 0px;
67
67
  }
package/global/global.css CHANGED
@@ -2327,14 +2327,14 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-inpu
2327
2327
  color: var(--link-colorpreset-1_color);
2328
2328
  text-decoration-color: var(--link-colorpreset-1_color);
2329
2329
  line-height: 1.5rem;
2330
+ gap: 8px;
2330
2331
  cursor: pointer;
2331
2332
  display: inline-flex;
2332
- gap: 8px;
2333
2333
  align-items: flex-start;
2334
2334
  text-decoration: none;
2335
2335
  position: relative;
2336
2336
  }
2337
- .ids-link:not(:has(.ids-link__icon)) {
2337
+ .ids-link:not(:has(.ids-icon)) {
2338
2338
  text-decoration: underline;
2339
2339
  }
2340
2340
  .ids-link:focus:focus {
@@ -2342,7 +2342,7 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-inpu
2342
2342
  outline-offset: var(--IDS-FOCUS_OUTLINE-OFFSET) !important;
2343
2343
  }
2344
2344
  .ids-link:hover, .ids-link:focus {
2345
- text-decoration: underline;
2345
+ text-decoration: underline !important;
2346
2346
  color: var(--link-colorpreset-1-hover_color);
2347
2347
  }
2348
2348
  .ids-link:hover .ids-link__icon:has(+ .ids-link__icon--hover), .ids-link:focus .ids-link__icon:has(+ .ids-link__icon--hover) {
@@ -2360,55 +2360,37 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-inpu
2360
2360
  .ids-link.ids-link--active-icon {
2361
2361
  text-decoration: none !important;
2362
2362
  }
2363
- .ids-link.ids-link--active-icon .ids-link__icon .ids-link__icon__wrap,
2364
- .ids-link.ids-link--active-icon .ids-link__icon--hover .ids-link__icon__wrap {
2363
+ .ids-link.ids-link--active-icon .ids-icon {
2364
+ margin-top: 0.25rem;
2365
+ display: inline-flex;
2365
2366
  border-radius: 100%;
2366
- padding: 3px;
2367
+ width: 1rem;
2368
+ height: 1rem;
2367
2369
  align-items: center;
2368
2370
  justify-content: center;
2371
+ padding: 0.188rem;
2369
2372
  }
2370
- .ids-link.ids-link--active-icon:hover .ids-link__icon .ids-link__icon__wrap, .ids-link.ids-link--active-icon:focus-within .ids-link__icon .ids-link__icon__wrap {
2371
- background-color: var(--link-colorpreset-1-hover_color);
2373
+ .ids-link.ids-link--active-icon.ids-link--active .ids-icon {
2374
+ background-color: var(--link-colorpreset-1--active-icon--active_background-color);
2372
2375
  }
2373
- .ids-link.ids-link--active-icon.ids-link--active .ids-link__icon:has(+ .ids-link__icon--hover) {
2374
- display: none;
2376
+ .ids-link.ids-link--active-icon:hover .ids-icon, .ids-link.ids-link--active-icon:focus-within .ids-icon {
2377
+ background-color: var(--link-colorpreset-1--active-icon--hover_background-color);
2375
2378
  }
2376
- .ids-link.ids-link--active-icon.ids-link--active .ids-link__icon--hover {
2379
+ .ids-link.ids-link--active-icon.ids-link--color-2 .ids-icon {
2380
+ margin-top: 0.25rem;
2377
2381
  display: inline-flex;
2378
- }
2379
- .ids-link.ids-link--active-icon.ids-link--active .ids-link__icon .ids-link__icon__wrap {
2380
- background-color: var(--link-colorpreset-1_color);
2381
- }
2382
- .ids-link.ids-link--active-icon.ids-link--active:hover .ids-link__icon .ids-link__icon__wrap {
2383
- background-color: var(--link-colorpreset-1-hover_color);
2384
- }
2385
- .ids-link.ids-link--active-icon .ids-link__icon--hover .ids-link__icon__wrap {
2386
- background-color: var(--link-colorpreset-1-hover_color);
2387
- }
2388
- .ids-link.ids-link--active-icon.ids-link--color-2 .ids-link__icon .ids-link__icon__wrap,
2389
- .ids-link.ids-link--active-icon.ids-link--color-2 .ids-link__icon--hover .ids-link__icon__wrap {
2390
2382
  border-radius: 100%;
2391
- padding: 3px;
2383
+ width: 1rem;
2384
+ height: 1rem;
2392
2385
  align-items: center;
2393
2386
  justify-content: center;
2387
+ padding: 0.188rem;
2394
2388
  }
2395
- .ids-link.ids-link--active-icon.ids-link--color-2:hover .ids-link__icon .ids-link__icon__wrap, .ids-link.ids-link--active-icon.ids-link--color-2:focus-within .ids-link__icon .ids-link__icon__wrap {
2396
- background-color: var(--link-colorpreset-2-hover_color);
2389
+ .ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active .ids-icon {
2390
+ background-color: var(--link-colorpreset-2--active-icon--active_background-color);
2397
2391
  }
2398
- .ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active .ids-link__icon:has(+ .ids-link__icon--hover) {
2399
- display: none;
2400
- }
2401
- .ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active .ids-link__icon--hover {
2402
- display: inline-flex;
2403
- }
2404
- .ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active .ids-link__icon .ids-link__icon__wrap {
2405
- background-color: var(--link-colorpreset-2_color);
2406
- }
2407
- .ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active:hover .ids-link__icon .ids-link__icon__wrap {
2408
- background-color: var(--link-colorpreset-2-hover_color);
2409
- }
2410
- .ids-link.ids-link--active-icon.ids-link--color-2 .ids-link__icon--hover .ids-link__icon__wrap {
2411
- background-color: var(--link-colorpreset-2-hover_color);
2392
+ .ids-link.ids-link--active-icon.ids-link--color-2:hover .ids-icon, .ids-link.ids-link--active-icon.ids-link--color-2:focus-within .ids-icon {
2393
+ background-color: var(--link-colorpreset-2--active-icon--hover_background-color);
2412
2394
  }
2413
2395
  .ids-link.ids-link--color-2 {
2414
2396
  color: var(--link-colorpreset-2_color);
@@ -2428,16 +2410,12 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-inpu
2428
2410
  .ids-link.ids-link--light:hover {
2429
2411
  color: white !important;
2430
2412
  }
2431
- .ids-link .ids-link__icon,
2432
- .ids-link .ids-link__icon--hover {
2413
+ .ids-link .ids-icon {
2433
2414
  display: inline-flex;
2434
- justify-content: center;
2435
2415
  align-items: center;
2416
+ justify-content: center;
2436
2417
  height: 1.5rem;
2437
2418
  }
2438
- .ids-link .ids-link__text {
2439
- gap: 8px;
2440
- }
2441
2419
  .ids-link .ids-link__icon {
2442
2420
  display: inline-flex;
2443
2421
  }
@@ -2552,6 +2530,7 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-inpu
2552
2530
  background-color: var(--btn_background-color);
2553
2531
  border: var(--btn_border);
2554
2532
  border-radius: var(--btn_border-radius);
2533
+ text-decoration: none;
2555
2534
  box-sizing: border-box;
2556
2535
  color: white;
2557
2536
  cursor: pointer;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "type": "module",
3
3
  "name": "@inera/ids-design",
4
- "version": "5.1.1",
4
+ "version": "5.1.3",
5
5
  "license": "SEE LICENSE IN LICENSE.md",
6
6
  "publishConfig": {
7
7
  "access": "public"
@@ -2388,14 +2388,14 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-inpu
2388
2388
  color: var(--link-colorpreset-1_color);
2389
2389
  text-decoration-color: var(--link-colorpreset-1_color);
2390
2390
  line-height: 1.5rem;
2391
+ gap: 8px;
2391
2392
  cursor: pointer;
2392
2393
  display: inline-flex;
2393
- gap: 8px;
2394
2394
  align-items: flex-start;
2395
2395
  text-decoration: none;
2396
2396
  position: relative;
2397
2397
  }
2398
- .ids-link:not(:has(.ids-link__icon)) {
2398
+ .ids-link:not(:has(.ids-icon)) {
2399
2399
  text-decoration: underline;
2400
2400
  }
2401
2401
  .ids-link:focus:focus {
@@ -2403,7 +2403,7 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-inpu
2403
2403
  outline-offset: var(--IDS-FOCUS_OUTLINE-OFFSET) !important;
2404
2404
  }
2405
2405
  .ids-link:hover, .ids-link:focus {
2406
- text-decoration: underline;
2406
+ text-decoration: underline !important;
2407
2407
  color: var(--link-colorpreset-1-hover_color);
2408
2408
  }
2409
2409
  .ids-link:hover .ids-link__icon:has(+ .ids-link__icon--hover), .ids-link:focus .ids-link__icon:has(+ .ids-link__icon--hover) {
@@ -2421,55 +2421,37 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-inpu
2421
2421
  .ids-link.ids-link--active-icon {
2422
2422
  text-decoration: none !important;
2423
2423
  }
2424
- .ids-link.ids-link--active-icon .ids-link__icon .ids-link__icon__wrap,
2425
- .ids-link.ids-link--active-icon .ids-link__icon--hover .ids-link__icon__wrap {
2424
+ .ids-link.ids-link--active-icon .ids-icon {
2425
+ margin-top: 0.25rem;
2426
+ display: inline-flex;
2426
2427
  border-radius: 100%;
2427
- padding: 3px;
2428
+ width: 1rem;
2429
+ height: 1rem;
2428
2430
  align-items: center;
2429
2431
  justify-content: center;
2432
+ padding: 0.188rem;
2430
2433
  }
2431
- .ids-link.ids-link--active-icon:hover .ids-link__icon .ids-link__icon__wrap, .ids-link.ids-link--active-icon:focus-within .ids-link__icon .ids-link__icon__wrap {
2432
- background-color: var(--link-colorpreset-1-hover_color);
2434
+ .ids-link.ids-link--active-icon.ids-link--active .ids-icon {
2435
+ background-color: var(--link-colorpreset-1--active-icon--active_background-color);
2433
2436
  }
2434
- .ids-link.ids-link--active-icon.ids-link--active .ids-link__icon:has(+ .ids-link__icon--hover) {
2435
- display: none;
2437
+ .ids-link.ids-link--active-icon:hover .ids-icon, .ids-link.ids-link--active-icon:focus-within .ids-icon {
2438
+ background-color: var(--link-colorpreset-1--active-icon--hover_background-color);
2436
2439
  }
2437
- .ids-link.ids-link--active-icon.ids-link--active .ids-link__icon--hover {
2440
+ .ids-link.ids-link--active-icon.ids-link--color-2 .ids-icon {
2441
+ margin-top: 0.25rem;
2438
2442
  display: inline-flex;
2439
- }
2440
- .ids-link.ids-link--active-icon.ids-link--active .ids-link__icon .ids-link__icon__wrap {
2441
- background-color: var(--link-colorpreset-1_color);
2442
- }
2443
- .ids-link.ids-link--active-icon.ids-link--active:hover .ids-link__icon .ids-link__icon__wrap {
2444
- background-color: var(--link-colorpreset-1-hover_color);
2445
- }
2446
- .ids-link.ids-link--active-icon .ids-link__icon--hover .ids-link__icon__wrap {
2447
- background-color: var(--link-colorpreset-1-hover_color);
2448
- }
2449
- .ids-link.ids-link--active-icon.ids-link--color-2 .ids-link__icon .ids-link__icon__wrap,
2450
- .ids-link.ids-link--active-icon.ids-link--color-2 .ids-link__icon--hover .ids-link__icon__wrap {
2451
2443
  border-radius: 100%;
2452
- padding: 3px;
2444
+ width: 1rem;
2445
+ height: 1rem;
2453
2446
  align-items: center;
2454
2447
  justify-content: center;
2448
+ padding: 0.188rem;
2455
2449
  }
2456
- .ids-link.ids-link--active-icon.ids-link--color-2:hover .ids-link__icon .ids-link__icon__wrap, .ids-link.ids-link--active-icon.ids-link--color-2:focus-within .ids-link__icon .ids-link__icon__wrap {
2457
- background-color: var(--link-colorpreset-2-hover_color);
2450
+ .ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active .ids-icon {
2451
+ background-color: var(--link-colorpreset-2--active-icon--active_background-color);
2458
2452
  }
2459
- .ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active .ids-link__icon:has(+ .ids-link__icon--hover) {
2460
- display: none;
2461
- }
2462
- .ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active .ids-link__icon--hover {
2463
- display: inline-flex;
2464
- }
2465
- .ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active .ids-link__icon .ids-link__icon__wrap {
2466
- background-color: var(--link-colorpreset-2_color);
2467
- }
2468
- .ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active:hover .ids-link__icon .ids-link__icon__wrap {
2469
- background-color: var(--link-colorpreset-2-hover_color);
2470
- }
2471
- .ids-link.ids-link--active-icon.ids-link--color-2 .ids-link__icon--hover .ids-link__icon__wrap {
2472
- background-color: var(--link-colorpreset-2-hover_color);
2453
+ .ids-link.ids-link--active-icon.ids-link--color-2:hover .ids-icon, .ids-link.ids-link--active-icon.ids-link--color-2:focus-within .ids-icon {
2454
+ background-color: var(--link-colorpreset-2--active-icon--hover_background-color);
2473
2455
  }
2474
2456
  .ids-link.ids-link--color-2 {
2475
2457
  color: var(--link-colorpreset-2_color);
@@ -2489,16 +2471,12 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-inpu
2489
2471
  .ids-link.ids-link--light:hover {
2490
2472
  color: white !important;
2491
2473
  }
2492
- .ids-link .ids-link__icon,
2493
- .ids-link .ids-link__icon--hover {
2474
+ .ids-link .ids-icon {
2494
2475
  display: inline-flex;
2495
- justify-content: center;
2496
2476
  align-items: center;
2477
+ justify-content: center;
2497
2478
  height: 1.5rem;
2498
2479
  }
2499
- .ids-link .ids-link__text {
2500
- gap: 8px;
2501
- }
2502
2480
  .ids-link .ids-link__icon {
2503
2481
  display: inline-flex;
2504
2482
  }
@@ -2613,6 +2591,7 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-inpu
2613
2591
  background-color: var(--btn_background-color);
2614
2592
  border: var(--btn_border);
2615
2593
  border-radius: var(--btn_border-radius);
2594
+ text-decoration: none;
2616
2595
  box-sizing: border-box;
2617
2596
  color: white;
2618
2597
  cursor: pointer;
@@ -4027,6 +4006,10 @@ select::placeholder {
4027
4006
  --link-colorpreset-1-hover_color: var(--IDS-COLOR-ACCENT-30);
4028
4007
  --link-colorpreset-2_color: var(--IDS-COLOR-PRIMARY-35);
4029
4008
  --link-colorpreset-2-hover_color: var(--IDS-COLOR-PRIMARY-30);
4009
+ --link-colorpreset-1--active-icon--hover_background-color: var(--IDS-COLOR-ACCENT-40);
4010
+ --link-colorpreset-1--active-icon--active_background-color: var(--IDS-COLOR-ACCENT-30);
4011
+ --link-colorpreset-2--active-icon--hover_background-color: var(--IDS-COLOR-PRIMARY-35);
4012
+ --link-colorpreset-2--active-icon--active_background-color: var(--IDS-COLOR-PRIMARY-30);
4030
4013
  /* List */
4031
4014
  --list-heading_color: var(--IDS-COLOR-ACCENT-40);
4032
4015
  --list_border: var(--IDS-COLOR-NEUTRAL-90);
@@ -2388,14 +2388,14 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-inpu
2388
2388
  color: var(--link-colorpreset-1_color);
2389
2389
  text-decoration-color: var(--link-colorpreset-1_color);
2390
2390
  line-height: 1.5rem;
2391
+ gap: 8px;
2391
2392
  cursor: pointer;
2392
2393
  display: inline-flex;
2393
- gap: 8px;
2394
2394
  align-items: flex-start;
2395
2395
  text-decoration: none;
2396
2396
  position: relative;
2397
2397
  }
2398
- .ids-link:not(:has(.ids-link__icon)) {
2398
+ .ids-link:not(:has(.ids-icon)) {
2399
2399
  text-decoration: underline;
2400
2400
  }
2401
2401
  .ids-link:focus:focus {
@@ -2403,7 +2403,7 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-inpu
2403
2403
  outline-offset: var(--IDS-FOCUS_OUTLINE-OFFSET) !important;
2404
2404
  }
2405
2405
  .ids-link:hover, .ids-link:focus {
2406
- text-decoration: underline;
2406
+ text-decoration: underline !important;
2407
2407
  color: var(--link-colorpreset-1-hover_color);
2408
2408
  }
2409
2409
  .ids-link:hover .ids-link__icon:has(+ .ids-link__icon--hover), .ids-link:focus .ids-link__icon:has(+ .ids-link__icon--hover) {
@@ -2421,55 +2421,37 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-inpu
2421
2421
  .ids-link.ids-link--active-icon {
2422
2422
  text-decoration: none !important;
2423
2423
  }
2424
- .ids-link.ids-link--active-icon .ids-link__icon .ids-link__icon__wrap,
2425
- .ids-link.ids-link--active-icon .ids-link__icon--hover .ids-link__icon__wrap {
2424
+ .ids-link.ids-link--active-icon .ids-icon {
2425
+ margin-top: 0.25rem;
2426
+ display: inline-flex;
2426
2427
  border-radius: 100%;
2427
- padding: 3px;
2428
+ width: 1rem;
2429
+ height: 1rem;
2428
2430
  align-items: center;
2429
2431
  justify-content: center;
2432
+ padding: 0.188rem;
2430
2433
  }
2431
- .ids-link.ids-link--active-icon:hover .ids-link__icon .ids-link__icon__wrap, .ids-link.ids-link--active-icon:focus-within .ids-link__icon .ids-link__icon__wrap {
2432
- background-color: var(--link-colorpreset-1-hover_color);
2434
+ .ids-link.ids-link--active-icon.ids-link--active .ids-icon {
2435
+ background-color: var(--link-colorpreset-1--active-icon--active_background-color);
2433
2436
  }
2434
- .ids-link.ids-link--active-icon.ids-link--active .ids-link__icon:has(+ .ids-link__icon--hover) {
2435
- display: none;
2437
+ .ids-link.ids-link--active-icon:hover .ids-icon, .ids-link.ids-link--active-icon:focus-within .ids-icon {
2438
+ background-color: var(--link-colorpreset-1--active-icon--hover_background-color);
2436
2439
  }
2437
- .ids-link.ids-link--active-icon.ids-link--active .ids-link__icon--hover {
2440
+ .ids-link.ids-link--active-icon.ids-link--color-2 .ids-icon {
2441
+ margin-top: 0.25rem;
2438
2442
  display: inline-flex;
2439
- }
2440
- .ids-link.ids-link--active-icon.ids-link--active .ids-link__icon .ids-link__icon__wrap {
2441
- background-color: var(--link-colorpreset-1_color);
2442
- }
2443
- .ids-link.ids-link--active-icon.ids-link--active:hover .ids-link__icon .ids-link__icon__wrap {
2444
- background-color: var(--link-colorpreset-1-hover_color);
2445
- }
2446
- .ids-link.ids-link--active-icon .ids-link__icon--hover .ids-link__icon__wrap {
2447
- background-color: var(--link-colorpreset-1-hover_color);
2448
- }
2449
- .ids-link.ids-link--active-icon.ids-link--color-2 .ids-link__icon .ids-link__icon__wrap,
2450
- .ids-link.ids-link--active-icon.ids-link--color-2 .ids-link__icon--hover .ids-link__icon__wrap {
2451
2443
  border-radius: 100%;
2452
- padding: 3px;
2444
+ width: 1rem;
2445
+ height: 1rem;
2453
2446
  align-items: center;
2454
2447
  justify-content: center;
2448
+ padding: 0.188rem;
2455
2449
  }
2456
- .ids-link.ids-link--active-icon.ids-link--color-2:hover .ids-link__icon .ids-link__icon__wrap, .ids-link.ids-link--active-icon.ids-link--color-2:focus-within .ids-link__icon .ids-link__icon__wrap {
2457
- background-color: var(--link-colorpreset-2-hover_color);
2450
+ .ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active .ids-icon {
2451
+ background-color: var(--link-colorpreset-2--active-icon--active_background-color);
2458
2452
  }
2459
- .ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active .ids-link__icon:has(+ .ids-link__icon--hover) {
2460
- display: none;
2461
- }
2462
- .ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active .ids-link__icon--hover {
2463
- display: inline-flex;
2464
- }
2465
- .ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active .ids-link__icon .ids-link__icon__wrap {
2466
- background-color: var(--link-colorpreset-2_color);
2467
- }
2468
- .ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active:hover .ids-link__icon .ids-link__icon__wrap {
2469
- background-color: var(--link-colorpreset-2-hover_color);
2470
- }
2471
- .ids-link.ids-link--active-icon.ids-link--color-2 .ids-link__icon--hover .ids-link__icon__wrap {
2472
- background-color: var(--link-colorpreset-2-hover_color);
2453
+ .ids-link.ids-link--active-icon.ids-link--color-2:hover .ids-icon, .ids-link.ids-link--active-icon.ids-link--color-2:focus-within .ids-icon {
2454
+ background-color: var(--link-colorpreset-2--active-icon--hover_background-color);
2473
2455
  }
2474
2456
  .ids-link.ids-link--color-2 {
2475
2457
  color: var(--link-colorpreset-2_color);
@@ -2489,16 +2471,12 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-inpu
2489
2471
  .ids-link.ids-link--light:hover {
2490
2472
  color: white !important;
2491
2473
  }
2492
- .ids-link .ids-link__icon,
2493
- .ids-link .ids-link__icon--hover {
2474
+ .ids-link .ids-icon {
2494
2475
  display: inline-flex;
2495
- justify-content: center;
2496
2476
  align-items: center;
2477
+ justify-content: center;
2497
2478
  height: 1.5rem;
2498
2479
  }
2499
- .ids-link .ids-link__text {
2500
- gap: 8px;
2501
- }
2502
2480
  .ids-link .ids-link__icon {
2503
2481
  display: inline-flex;
2504
2482
  }
@@ -2613,6 +2591,7 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-inpu
2613
2591
  background-color: var(--btn_background-color);
2614
2592
  border: var(--btn_border);
2615
2593
  border-radius: var(--btn_border-radius);
2594
+ text-decoration: none;
2616
2595
  box-sizing: border-box;
2617
2596
  color: white;
2618
2597
  cursor: pointer;
@@ -4027,6 +4006,10 @@ select::placeholder {
4027
4006
  --link-colorpreset-1-hover_color: var(--IDS-COLOR-ACCENT-30);
4028
4007
  --link-colorpreset-2_color: var(--IDS-COLOR-PRIMARY-35);
4029
4008
  --link-colorpreset-2-hover_color: var(--IDS-COLOR-PRIMARY-30);
4009
+ --link-colorpreset-1--active-icon--hover_background-color: var(--IDS-COLOR-ACCENT-40);
4010
+ --link-colorpreset-1--active-icon--active_background-color: var(--IDS-COLOR-ACCENT-30);
4011
+ --link-colorpreset-2--active-icon--hover_background-color: var(--IDS-COLOR-PRIMARY-35);
4012
+ --link-colorpreset-2--active-icon--active_background-color: var(--IDS-COLOR-PRIMARY-30);
4030
4013
  /* List */
4031
4014
  --list-heading_color: var(--IDS-COLOR-ACCENT-40);
4032
4015
  --list_border: var(--IDS-COLOR-NEUTRAL-90);