@iamproperty/components 7.2.2--beta3 → 7.4.0

package/assets/sass/_functions/variables.scss

@@ -269,6 +269,8 @@ $theme-colors: map.merge(
     'light': $light,
     'canvas': $canvas,
     'white': #fcfcfc,
+    'activeLink': #e8f9fd,
+    'activeLinkBorder': #1dbde6,
   ),
   $theme-colors
 );
@@ -359,6 +361,8 @@ $dark-mode-functional-colors: (
   'btn-secondary-bg-hover': var(--colour-white),
   'btn-secondary-hover': var(--colour-primary-theme),
   'btn-action-hover-bg': var(--colour-canvas-2),
+  'activeLink': #173c45,
+  'activeLinkBorder': #1dbde6,
 );
 
 $wider-colours: (
@@ -472,11 +476,13 @@ $fonts: map.merge(
   $vars: map.merge((--font-#{$font}: #{$value}), $vars);
 }
 
-
-$vars: map.merge((
-  '--type-scale': 1.2,
-  '--body-fs': 1rem,
-),$vars);
+$vars: map.merge(
+  (
+    '--type-scale': 1.2,
+    '--body-fs': 1rem,
+  ),
+  $vars
+);
 
 /* Headings variables are setup this way so that we can export them into the vue documentation */
 $heading-sizes: (
@@ -760,8 +766,6 @@ $ut-mh-lg-px: 600;
 $ut-mh-lg: #{rem($ut-mh-lg-px)};
 // #endregion
 
-
-
 $chart-colour-1: map.get($wider-colours, '3') !default;
 $chart-colour-2: map.get($wider-colours, '4') !default;
 $chart-colour-3: map.get($wider-colours, '5') !default;
@@ -789,4 +793,3 @@ $chart-colors: map.merge(
   ),
   $chart-colors
 );
-

package/assets/sass/components/actionbar.component.scss

@@ -251,7 +251,7 @@ slot[name='selectall'] {
   }
 }
 
-.dialog__wrapper.dialog-overflow {
+.menu__wrapper .dialog-overflow {
   margin-left: 0.5rem;
   margin-right: -0.5rem;
 }
@@ -359,9 +359,8 @@ slot[name='selectall'] {
   position: relative;
 }
 
-:host([data-filter-columns][data-columns-shown="0"]) .actionbar__wrapper + .no-columns,
-:host([data-filter-columns-save][data-columns-shown="0"]) .actionbar__wrapper + .no-columns {
-
+:host([data-filter-columns][data-columns-shown='0']) .actionbar__wrapper + .no-columns,
+:host([data-filter-columns-save][data-columns-shown='0']) .actionbar__wrapper + .no-columns {
   display: flex;
   padding: 2rem 2rem 0 2rem;
   text-align: center;

package/assets/sass/components/actionbar.global.scss

@@ -69,8 +69,8 @@ iam-actionbar {
   }
 
   // Dialog wrapper
-  .dialog__wrapper[slot='selected-overflow'] > button,
-  .dialog__wrapper[slot='overflow'] > button {
+  .menu__wrapper [slot='selected-overflow'] > button,
+  .menu__wrapper [slot='overflow'] > button {
     background: none;
     border: none;
     text-indent: 0;
@@ -90,8 +90,8 @@ iam-actionbar {
     border: none;
     margin: 0 !important;
   }
-  .dialog__wrapper[slot='selected-overflow'] dialog[open],
-  .dialog__wrapper[slot='overflow'] dialog[open] {
+  .menu__wrapper [slot='selected-overflow'] dialog[open],
+  .menu__wrapper [slot='overflow'] dialog[open] {
     display: contents;
   }
 }

package/assets/sass/components/bento-grid.global.scss

@@ -201,7 +201,6 @@ iam-bento-grid {
 iam-bento-grid {
   @container (width > 54em) {
     details {
-
       overflow: hidden;
 
       summary {