@gooddata/sdk-ui-dashboard 10.33.0-alpha.8 → 10.33.0-alpha.81

package/styles/css/main.css

@@ -886,8 +886,8 @@
 /* allow vendor prefixes and disable max length */
 @font-face {
   font-family: "Indigo";
-  src: url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot");
-  src: url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot?#iefix") format("embedded-opentype"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.woff") format("woff"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.ttf") format("truetype"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.svg#Indigo-v2") format("svg");
+  src: url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot");
+  src: url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot?#iefix") format("embedded-opentype"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.woff") format("woff"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.ttf") format("truetype"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.svg#Indigo-v2") format("svg");
   font-weight: normal;
   font-style: normal;
 }
@@ -3072,8 +3072,8 @@ button.gd-list-item {
 }
 @font-face {
   font-family: "Indigo";
-  src: url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot");
-  src: url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot?#iefix") format("embedded-opentype"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.woff") format("woff"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.ttf") format("truetype"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.svg#Indigo-v2") format("svg");
+  src: url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot");
+  src: url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot?#iefix") format("embedded-opentype"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.woff") format("woff"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.ttf") format("truetype"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.svg#Indigo-v2") format("svg");
   font-weight: normal;
   font-style: normal;
 }
@@ -5666,7 +5666,7 @@ a.gd-button-link:hover .gd-button-text, a.gd-button-link-dimmed:hover .gd-button
 
 .gd-spinner {
   display: inline-block;
-  background-image: url("~@gooddata/sdk-ui-kit/esm/assets/loading.svg");
+  background-image: url("@gooddata/sdk-ui-kit/esm/assets/loading.svg");
   background-repeat: no-repeat;
   background-position: top left;
   background-size: contain;
@@ -7147,8 +7147,8 @@ div.gd-empty-item-bubble {
 
 @font-face {
   font-family: "Indigo";
-  src: url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot");
-  src: url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot?#iefix") format("embedded-opentype"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.woff") format("woff"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.ttf") format("truetype"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.svg#Indigo-v2") format("svg");
+  src: url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot");
+  src: url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot?#iefix") format("embedded-opentype"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.woff") format("woff"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.ttf") format("truetype"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.svg#Indigo-v2") format("svg");
   font-weight: normal;
   font-style: normal;
 }
@@ -14076,8 +14076,8 @@ input[type=search]::-webkit-search-cancel-button {
 }
 @font-face {
   font-family: "Indigo";
-  src: url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot");
-  src: url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot?#iefix") format("embedded-opentype"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.woff") format("woff"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.ttf") format("truetype"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.svg#Indigo-v2") format("svg");
+  src: url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot");
+  src: url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot?#iefix") format("embedded-opentype"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.woff") format("woff"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.ttf") format("truetype"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.svg#Indigo-v2") format("svg");
   font-weight: normal;
   font-style: normal;
 }
@@ -16670,7 +16670,7 @@ a.gd-button-link:hover .gd-button-text, a.gd-button-link-dimmed:hover .gd-button
 
 .gd-spinner {
   display: inline-block;
-  background-image: url("~@gooddata/sdk-ui-kit/esm/assets/loading.svg");
+  background-image: url("@gooddata/sdk-ui-kit/esm/assets/loading.svg");
   background-repeat: no-repeat;
   background-position: top left;
   background-size: contain;
@@ -17612,7 +17612,7 @@ div.gd-empty-item-bubble {
   content: "";
   width: 18px;
   height: 20px;
-  background-image: url("~@gooddata/sdk-ui-kit/styles/icons/attribute.svg");
+  background-image: url("@gooddata/sdk-ui-kit/styles/icons/attribute.svg");
   background-repeat: no-repeat;
   background-position: left center;
   background-size: contain;
@@ -17622,7 +17622,7 @@ div.gd-empty-item-bubble {
   content: "";
   width: 18px;
   height: 20px;
-  background-image: url("~@gooddata/sdk-ui-kit/styles/icons/date.svg");
+  background-image: url("@gooddata/sdk-ui-kit/styles/icons/date.svg");
   background-repeat: no-repeat;
   background-position: left center;
   background-size: contain;
@@ -17653,7 +17653,7 @@ div.gd-empty-item-bubble {
   content: "";
   width: 16px;
   height: 16px;
-  background-image: url("~@gooddata/sdk-ui-ext/esm/internal/assets/icons/attribute-hierarchy.svg");
+  background-image: url("@gooddata/sdk-ui-ext/esm/internal/assets/icons/attribute-hierarchy.svg");
   background-size: 16px 16px;
   background-repeat: no-repeat;
 }
@@ -19162,17 +19162,33 @@ figure {
 .gd-notifications-channels-attachments .gd-attachment-list {
   display: flex;
   flex-direction: row;
-  align-items: end;
+  align-items: center;
   flex: 1;
   overflow: hidden;
   margin: -2px 0;
   flex-wrap: wrap;
+  gap: 5px;
+  scroll-margin-bottom: 40px;
 }
 @media only screen and (max-width: 640px) {
   .gd-notifications-channels-attachments .gd-attachment-list {
     max-width: none;
   }
 }
+.gd-notifications-channels-attachments .gd-attachment-list-old {
+  display: flex;
+  flex-direction: row;
+  align-items: end;
+  flex: 1;
+  overflow: hidden;
+  margin: -2px 0;
+  flex-wrap: wrap;
+}
+@media only screen and (max-width: 640px) {
+  .gd-notifications-channels-attachments .gd-attachment-list-old {
+    max-width: none;
+  }
+}
 .gd-notifications-channels-attachments .gd-attachment-list-message {
   display: flex;
   flex-basis: 100%;
@@ -19315,6 +19331,7 @@ figure {
   display: flex;
   flex-direction: column;
   padding: 15px 10px;
+  gap: var(--gd-spacing-10px);
 }
 .gd-attachment-settings-dropdown .gd-attachment-settings-dropdown-footer {
   display: flex;
@@ -19424,7 +19441,7 @@ figure {
   height: 50px;
   border: none;
   cursor: pointer;
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/ellipsis.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/ellipsis.svg");
   background-color: transparent;
   background-position: center center;
 }
@@ -19815,6 +19832,75 @@ figure {
   min-width: unset;
 }
 
+.gd-attachment-type-label {
+  display: inline-flex;
+  gap: var(--gd-spacing-10px);
+  align-items: center;
+  margin-inline-start: 5px;
+}
+
+.gd-attachment-types-content {
+  padding: var(--gd-spacing-10px);
+}
+
+.gd-attachment-type-item {
+  padding: 3px 0;
+  font-size: 12px;
+}
+
+.gd-attachment-chip {
+  height: 27px;
+  max-width: 245px;
+  display: inline-flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  position: relative;
+  border-radius: 20px;
+  padding-left: var(--gd-spacing-10px);
+  font-size: 12px;
+  border: 1px solid var(--gd-palette-complementary-4);
+  background-color: var(--gd-palette-complementary-0);
+  color: var(--gd-palette-complementary-7);
+}
+.gd-attachment-chip:has(.gd-attachment-chip-delete:hover) {
+  background-color: var(--gd-palette-error-dimmed);
+  color: var(--gd-palette-error-base);
+  border: 1px solid var(--gd-palette-error-base-t85);
+}
+
+.gd-attachment-chip-label {
+  display: inline-flex;
+  gap: var(--gd-spacing-5px);
+  align-items: center;
+}
+
+.gd-attachment-chip-button {
+  background: none;
+  border: none;
+  padding: 0;
+  font: inherit;
+  cursor: pointer;
+  color: var(--gd-palette-complementary-6);
+  display: grid;
+  place-items: center;
+  width: 27px;
+  height: 100%;
+}
+.gd-attachment-chip-button:hover {
+  color: var(--gd-palette-complementary-8);
+}
+
+.gd-attachment-chip-delete:hover {
+  color: var(--gd-palette-error-base);
+}
+
+.gd-attachment-list-error {
+  color: var(--gd-palette-error-base);
+  font-size: 12px;
+}
+
 .gd-recipients-container.gd-input-component--invalid .gd-recipients__control {
   border-color: var(--gd-palette-error-base, #e54d42);
 }
@@ -20298,9 +20384,11 @@ figure {
   box-sizing: border-box;
   display: flex;
   align-items: stretch;
-  min-height: 178px;
   padding: 10px;
 }
+.dash-item.dash-item-height {
+  min-height: 178px;
+}
 @media only screen {
   .dash-item {
     flex: 0 0 100%;
@@ -20430,6 +20518,7 @@ figure {
   flex: 1 1 auto;
   flex-direction: column;
   justify-content: flex-start;
+  width: 100%;
 }
 
 .dash-item-content {
@@ -20662,7 +20751,7 @@ figure {
 }
 
 .dash-item-action.dash-item-action-alert.disabled {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/alert-bell-na.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/alert-bell-na.svg");
   background-repeat: no-repeat;
   background-position: center;
   background-size: 16px;
@@ -20765,7 +20854,7 @@ figure {
   background-color: var(--gd-palette-primary-base, #14b2e2);
 }
 .dash-item-action-delete.gd-icon-trash::before {
-  content: url("~@gooddata/sdk-ui-dashboard/esm/assets/trash.svg");
+  content: url("@gooddata/sdk-ui-dashboard/esm/assets/trash.svg");
   display: inline-block;
   width: 20px;
   height: 20px;
@@ -20916,6 +21005,9 @@ figure {
   bottom: 0;
   right: 0;
 }
+.insight-view-loader.is-invisible {
+  visibility: hidden;
+}
 
 .bubble.options-menu-bubble {
   background-color: #fff;
@@ -20956,6 +21048,9 @@ figure {
 .gd-grid-layout .dash-item .is-dragging-widget.dash-item-content {
   border-color: var(--gd-palette-complementary-2, #ebeff4);
 }
+.gd-grid-layout .dash-item.gd-dashboard-nested-layout-widget .gd-dashboard-nested-layout-widget {
+  padding: 10px 0 0 0;
+}
 .gd-grid-layout .dash-item:not(.gd-dashboard-nested-layout-widget):not(.gd-first-container-row-widget):not(.drag-info-placeholder) {
   padding: 10px 0;
 }
@@ -21122,49 +21217,50 @@ figure {
 
 .add-kpi-placeholder::before,
 .move-kpi-placeholder::before {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/add-kpi-placeholder.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/add-kpi-placeholder.svg");
 }
 
-.add-attribute-filter-placeholder::before {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/add-attribute-filter-placeholder.svg");
+.add-attribute-filter-placeholder.disabled::before {
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/add-attribute-filter-placeholder-disabled.svg");
 }
-.add-attribute-filter-placeholder::before:disabled {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/add-attribute-filter-placeholder-disabled.svg");
+
+.add-attribute-filter-placeholder::before {
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/add-attribute-filter-placeholder.svg");
 }
 
-.dropzone {
+.gd-fluid-layout .dropzone {
   z-index: 99;
 }
-.dropzone.next, .dropzone.prev {
+.gd-fluid-layout .dropzone.next, .gd-fluid-layout .dropzone.prev {
   position: absolute;
   top: 0;
   bottom: 0;
   width: 50%;
 }
-.dropzone.next {
+.gd-fluid-layout .dropzone.next {
   right: 0;
 }
-.dropzone.next .drop-hint {
+.gd-fluid-layout .dropzone.next .drop-hint {
   float: right;
   margin-left: 3px;
 }
-.dropzone.next.full {
+.gd-fluid-layout .dropzone.next.full {
   width: 100%;
 }
-.dropzone.prev {
+.gd-fluid-layout .dropzone.prev {
   left: 0;
 }
-.dropzone.prev .drop-hint {
+.gd-fluid-layout .dropzone.prev .drop-hint {
   float: left;
   margin-left: -3px;
 }
-.dropzone.prev.full {
+.gd-fluid-layout .dropzone.prev.full {
   width: 100%;
 }
-.dropzone.hidden {
+.gd-fluid-layout .dropzone.hidden {
   display: none;
 }
-.dropzone.extended {
+.gd-fluid-layout .dropzone.extended {
   width: 100%;
 }
 
@@ -21317,6 +21413,9 @@ figure {
   background: var(--gd-palette-complementary-1-from-theme, rgba(201, 213, 224, 0.05));
   text-align: center;
 }
+.drag-info-placeholder-box.drag-info-empty-nested-layout {
+  padding: 0;
+}
 .drag-info-placeholder-box h2 {
   font-weight: bold;
   font-size: 20px;
@@ -21331,7 +21430,7 @@ figure {
   color: var(--gd-palette-complementary-6, #94a1ad);
 }
 .drag-info-placeholder-box .gd-icon-insight::before {
-  content: url("~@gooddata/sdk-ui-dashboard/esm/assets/add-insight-placeholder.svg");
+  content: url("@gooddata/sdk-ui-dashboard/esm/assets/add-insight-placeholder.svg");
   display: inline-block;
   margin-right: 10px;
 }
@@ -21433,7 +21532,7 @@ figure {
   cursor: pointer;
 }
 .kpi-placeholder.select-measure {
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/dummy-kpi-simple.svg") no-repeat center center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/dummy-kpi-simple.svg") no-repeat center center;
   background-size: 130px;
 }
 
@@ -21553,9 +21652,6 @@ figure {
   left: 10px;
   align-content: center;
 }
-.gd-grid-layout .dropzone.next .drop-hint {
-  float: unset;
-}
 .gd-grid-layout .row-hotspot-container .row-hotspot {
   top: -20px;
   right: unset;
@@ -21597,6 +21693,9 @@ figure {
   left: unset;
   padding: 10px;
 }
+.gd-grid-layout .gd-fluidlayout-column-dropzone__text--hidden .drop-target-inner {
+  padding: 4px;
+}
 .gd-grid-layout .drop-target-message {
   position: unset;
   top: unset;
@@ -21654,6 +21753,9 @@ figure {
 .gd-grid-layout .gd-fluidlayout-column-row-end-hotspot .drag-info-placeholder-inner {
   padding: 0;
 }
+.gd-grid-layout .gd-fluidlayout-column-row-end-hotspot.gd-fluidlayout-column-row-end-hotspot--direction-column.gd-fluidlayout-column-dropzone__text--hidden .widget-dropzone-box {
+  padding: 0;
+}
 .gd-grid-layout .gd-fluidlayout-column-row-end-hotspot.gd-first-container-row-dropzone .widget-dropzone-box {
   padding-top: 0;
 }
@@ -23144,13 +23246,13 @@ figure {
 .gd-powered-by-logo-img-large {
   width: 165px;
   height: 30px;
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/powered-by-gd-large.svg?v=2022");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/powered-by-gd-large.svg?v=2022");
   background-size: 165px 30px;
 }
 .gd-powered-by-logo-img-small {
   width: 146px;
   height: 16px;
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/powered-by-gd-small.svg?v=2022");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/powered-by-gd-small.svg?v=2022");
   background-size: 146px 16px;
 }
 
@@ -24131,12 +24233,14 @@ figure {
   flex-direction: column;
   align-items: stretch;
   gap: 10px;
-  max-width: 240px;
+  max-width: 260px;
 }
 .gd-container-tooltip__image {
-  width: 100%;
-  aspect-ratio: 3/2;
-  background: fuchsia;
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/flexible-layouts-tooltip.gif");
+  background-repeat: no-repeat;
+  background-position: left top;
+  background-size: contain;
+  aspect-ratio: 44/27;
 }
 .gd-container-tooltip__actions {
   padding-top: 10px;
@@ -24177,7 +24281,7 @@ figure {
 .button-dropdown.gd-button-small.type-growIsGood::before,
 .dropdown-body .gd-list-item.type-growIsGood::before,
 .configuration-category label.type-growIsGood::before {
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/trend-positive.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/trend-positive.svg") no-repeat center;
 }
 .button-dropdown.gd-button-small.type-growIsGood.is-selected,
 .dropdown-body .gd-list-item.type-growIsGood.is-selected,
@@ -24197,7 +24301,7 @@ figure {
 .button-dropdown.gd-button-small.type-growIsBad::before,
 .dropdown-body .gd-list-item.type-growIsBad::before,
 .configuration-category label.type-growIsBad::before {
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/trend-negative.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/trend-negative.svg") no-repeat center;
 }
 .button-dropdown.gd-button-small.type-growIsBad.is-selected,
 .dropdown-body .gd-list-item.type-growIsBad.is-selected,
@@ -24212,23 +24316,23 @@ figure {
 .button-dropdown.gd-button-small.type-measure::before,
 .dropdown-body .gd-list-item.type-measure::before,
 .configuration-category label.type-measure::before {
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/measure.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/measure.svg") no-repeat center;
 }
 .button-dropdown.gd-button-small.type-metric::before,
 .dropdown-body .gd-list-item.type-metric::before,
 .configuration-category label.type-metric::before {
   margin-top: 0;
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/metric.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/metric.svg") no-repeat center;
 }
 .button-dropdown.gd-button-small.type-attribute::before,
 .dropdown-body .gd-list-item.type-attribute::before,
 .configuration-category label.type-attribute::before {
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/attribute.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/attribute.svg") no-repeat center;
 }
 .button-dropdown.gd-button-small.type-date::before,
 .dropdown-body .gd-list-item.type-date::before,
 .configuration-category label.type-date::before {
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/date-dropdown.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/date-dropdown.svg") no-repeat center;
 }
 .button-dropdown.gd-button-small.type-comparison::before,
 .dropdown-body .gd-list-item.type-comparison::before,
@@ -24244,65 +24348,73 @@ figure {
   left: 11px;
 }
 
-.gd-list-item .gd-icon-list::before {
+.gd-icon-list::before {
   content: "";
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/list.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/list.svg") no-repeat center;
   width: 16px;
   height: 16px;
   display: inline-block;
 }
-.gd-list-item .gd-icon-save-as-new::before {
+
+.gd-icon-save-as-new::before {
   content: "";
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/save-as-new.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/save-as-new.svg") no-repeat center;
   width: 16px;
   height: 16px;
   display: inline-block;
 }
-.gd-list-item .gd-icon-filter::before {
+
+.gd-icon-filter::before {
   content: "";
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/filter.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/filter.svg") no-repeat center;
   width: 16px;
   height: 16px;
   display: inline-block;
 }
-.gd-list-item .gd-icon-type-pdf::before {
+
+.gd-icon-type-pdf::before {
   content: "";
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/type-pdf.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/type-pdf.svg") no-repeat center;
   width: 16px;
   height: 16px;
   display: inline-block;
 }
-.gd-list-item .gd-icon-type-sheet::before {
+
+.gd-icon-type-sheet::before {
   content: "";
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/type-sheet.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/type-sheet.svg") no-repeat center;
   width: 16px;
   height: 16px;
   display: inline-block;
 }
-.gd-list-item .gd-icon-type-slides::before {
+
+.gd-icon-type-slides::before {
   content: "";
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/type-slides.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/type-slides.svg") no-repeat center;
   width: 16px;
   height: 16px;
   display: inline-block;
 }
-.gd-list-item .gd-icon-type-image::before {
+
+.gd-icon-type-image::before {
   content: "";
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/type-image.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/type-image.svg") no-repeat center;
   width: 16px;
   height: 16px;
   display: inline-block;
 }
-.gd-list-item .gd-icon-type-csv-raw::before {
+
+.gd-icon-type-csv-raw::before {
   content: "";
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/type-csv-raw.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/type-csv-raw.svg") no-repeat center;
   width: 16px;
   height: 16px;
   display: inline-block;
 }
-.gd-list-item .gd-icon-type-csv-formatted::before {
+
+.gd-icon-type-csv-formatted::before {
   content: "";
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/type-csv-formatted.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/type-csv-formatted.svg") no-repeat center;
   width: 16px;
   height: 16px;
   display: inline-block;
@@ -24716,7 +24828,7 @@ figure {
   display: block;
   width: 18px;
   height: 24px;
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/date-dropdown.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/date-dropdown.svg") no-repeat center;
 }
 
 .dash-width-resizer-container {
@@ -24724,7 +24836,6 @@ figure {
   top: 0;
   right: 20px;
   bottom: 100%;
-  width: 0;
   height: 100%;
 }
 
@@ -24739,8 +24850,8 @@ figure {
 .dash-width-resizer-hotspot,
 .resizer-drag-preview {
   display: flex;
-  width: 40px;
-  padding: 0 0 0 5px;
+  justify-content: center;
+  width: 20px;
   cursor: col-resize;
 }
 
@@ -24897,9 +25008,6 @@ figure {
   background: var(--gd-dashboards-content-backgroundColor-from-theme, var(--gd-palette-complementary-0-from-theme, rgba(255, 255, 255, 0.95)));
 }
 
-.gd-grid-layout-width-resizer-drag-preview {
-  padding: 0 0 0 10px;
-}
 .gd-grid-layout-width-resizer-drag-preview.gd-first-container-row-widget .gd-fluidlayout-width-resizer__container {
   padding-top: 0;
 }
@@ -24911,16 +25019,15 @@ figure {
 }
 .gd-grid-layout-resizer-drag-preview .gd-fluidlayout-width-resizer,
 .gd-grid-layout .gd-fluidlayout-width-resizer {
-  padding: 4px 0;
   display: flex;
   flex-direction: column;
   border-radius: 4px;
+  align-items: center;
 }
 .gd-grid-layout-resizer-drag-preview .gd-fluidlayout-width-resizer .width-resizer-line,
 .gd-grid-layout .gd-fluidlayout-width-resizer .width-resizer-line {
   flex: 1 0 auto;
   width: 0;
-  margin-left: 4px;
   height: unset;
 }
 .gd-grid-layout-resizer-drag-preview .dash-height-resizer-container,
@@ -24975,17 +25082,20 @@ figure {
 }
 
 .gd-grid-layout .dash-width-resizer-container {
-  position: relative;
-  left: -10px;
-  right: 0;
-  width: 0;
+  position: absolute;
+  right: -20px;
+  width: 20px;
+  display: flex;
+  justify-content: center;
 }
 .gd-grid-layout .dash-width-resizer-container.gd-first-container-row-widget .gd-fluidlayout-width-resizer__container {
   padding-top: 0;
 }
 .gd-grid-layout .gd-fluidlayout-width-resizer__container {
   background: var(--gd-dashboards-content-backgroundColor, var(--gd-palette-complementary-0, #fff));
-  width: 100%;
+  width: 20px;
+  display: flex;
+  justify-content: center;
 }
 .gd-grid-layout .dash-height-resizer-hotspot {
   position: absolute;
@@ -25009,9 +25119,10 @@ figure {
 }
 
 .sdk-edit-mode-on .gd-grid-layout .dash-width-resizer-hotspot {
-  position: unset;
+  position: static;
   width: 20px;
-  padding: 0 0 0 10px;
+  display: flex;
+  justify-content: center;
 }
 .sdk-edit-mode-on .gd-grid-layout .gd-resize-overlay-text {
   right: -10px;
@@ -25044,6 +25155,61 @@ figure {
   left: unset;
 }
 
+.gd-grid-layout-ruler {
+  --bullet-size: 6px;
+  --bullet-size-active: 9px;
+  --gap: 20px;
+  padding: 20px 0 20px var(--gap);
+  position: absolute;
+  left: 0;
+  right: 0;
+  display: flex;
+  pointer-events: none;
+}
+.gd-grid-layout-ruler__grid {
+  flex-grow: 1;
+  flex-shrink: 0;
+  display: grid;
+  gap: var(--gap);
+  grid-template-columns: repeat(var(--columns-num), 1fr);
+  grid-template-rows: auto;
+  justify-content: start;
+  align-items: stretch;
+}
+.gd-grid-layout-ruler__bullet-container {
+  width: var(--gap);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: relative;
+  left: calc(var(--gap) * -1);
+}
+.gd-grid-layout-ruler__bullet-container--last {
+  left: 0;
+}
+.gd-grid-layout-ruler__bullet {
+  width: var(--bullet-size);
+  height: var(--bullet-size);
+  border-radius: 100%;
+  background-color: var(--gd-palette-complementary-6-from-theme, #b0beca);
+  position: absolute;
+  opacity: 0;
+  transform: translateY(-20px);
+  transition: transform 0.2s ease-out, opacity 0.1s ease-in, width 0.1s ease-out, height 0.1s ease-out;
+}
+.gd-grid-layout-ruler--active .gd-grid-layout-ruler__bullet {
+  opacity: 1;
+  transform: translateY(0);
+}
+.gd-grid-layout-ruler__bullet--active {
+  background-color: var(--gd-palette-primary-base, #14b2e2);
+  width: var(--bullet-size-active);
+  height: var(--bullet-size-active);
+}
+.gd-grid-layout-ruler__bullet--initial {
+  background-color: var(--gd-palette-complementary-9, #000);
+}
+
 .gd-drill-origin-selector .dropdown-button {
   font-size: 12px;
   display: inline-block;
@@ -25142,7 +25308,7 @@ figure {
   display: block;
   width: 18px;
   height: 24px;
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/measure.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/measure.svg");
   background-repeat: no-repeat;
   background-position: left top;
   background-size: contain;
@@ -25154,20 +25320,20 @@ figure {
   background: var(--gd-palette-primary-dimmed, #e8f7fc);
 }
 .gd-drill-item-selector-dropdown .gd-drill-measure-selector-list-item::before {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/measure.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/measure.svg");
 }
 .gd-drill-item-selector-dropdown .gd-drill-metric-selector-list-item::before {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/metric.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/metric.svg");
   top: 8px;
   height: 18px;
 }
 .gd-drill-item-selector-dropdown .gd-drill-attribute-selector-list-item::before {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/attribute.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/attribute.svg");
 }
 .gd-drill-item-selector-dropdown .gd-drill-attribute-date-selector-list-item::before {
   top: 9px;
   height: 16px;
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/date-dropdown.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/date-dropdown.svg");
 }
 
 .drill-config-empty-hierarchy-target {
@@ -25240,7 +25406,7 @@ figure {
   display: block;
   width: 18px;
   height: 24px;
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/attribute-hierarchy.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/attribute-hierarchy.svg");
   background-repeat: no-repeat;
   background-position: left top;
   background-size: contain;
@@ -25272,16 +25438,16 @@ figure {
   background-repeat: no-repeat;
 }
 .gd-drill-config-measure-item .dm-button-icon-metric {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/metric.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/metric.svg");
 }
 .gd-drill-config-measure-item .dm-button-icon-measure {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/measure.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/measure.svg");
 }
 .gd-drill-config-measure-item .dm-button-icon-attribute {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/attribute.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/attribute.svg");
 }
 .gd-drill-config-measure-item .dm-button-icon-date {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/date-dropdown.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/date-dropdown.svg");
 }
 .gd-drill-config-measure-item .dm-button-title {
   overflow: hidden;
@@ -25421,21 +25587,21 @@ figure {
 }
 .gd-drill-config-panel-target .gd-icon-drill-to-dashboard::before,
 .drill-config-target .gd-icon-drill-to-dashboard::before {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/drill-to-dashboard.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/drill-to-dashboard.svg");
 }
 .gd-drill-config-panel-target .gd-icon-drill-to-insight::before,
 .drill-config-target .gd-icon-drill-to-insight::before {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/drill-to-insight.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/drill-to-insight.svg");
 }
 .gd-drill-config-panel-target .gd-icon-drill-down::before,
 .drill-config-target .gd-icon-drill-down::before {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/drill-down.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/drill-down.svg");
   background-repeat: no-repeat;
   top: 1px;
 }
 .gd-drill-config-panel-target .gd-icon-attribute-hierarchy::before,
 .drill-config-target .gd-icon-attribute-hierarchy::before {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/attribute-hierarchy.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/attribute-hierarchy.svg");
   background-repeat: no-repeat;
   top: 1px;
 }
@@ -26738,7 +26904,7 @@ figure {
 
 .gd-dashboard-nested-layout-widget .gd-dashboard-nested-layout-content.dash-item-content {
   border-radius: 0;
-  padding: 19px 10px 18px 10px;
+  padding: 19px 10px 15px 10px;
 }
 .gd-dashboard-nested-layout-widget .is-selectable.gd-dashboard-nested-layout-content.dash-item-content:not(.is-selected):hover, .gd-dashboard-nested-layout-widget .is-selectable.gd-dashboard-nested-layout-content.dash-item-content.is-dragging-widget {
   border-style: solid;
@@ -26770,10 +26936,6 @@ figure {
   font-size: 18px;
 }
 
-.gd-nested-layout-widget-renderer .gd-nested-layout-hotspot.dropzone {
-  width: 50px;
-}
-
 .gd-dashboard-nested-layout-tab {
   display: none;
   width: auto;
@@ -26814,6 +26976,14 @@ figure {
 .gd-dashboard-nested-layout-widget-visualization-content .drag-info-placeholder {
   padding: 0 0 0 10px;
 }
+.gd-dashboard-nested-layout-widget-visualization-content .drag-info-empty-nested-layout {
+  align-items: center;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  height: 100%;
+  justify-content: center;
+}
 
 .gd-grid-layout .gd-fluidlayout-column-dropzone {
   height: 100%;
@@ -26829,81 +26999,116 @@ figure {
 .gd-grid-layout .gd-empty-dashboard-dropzone .drag-info-placeholder {
   min-height: 300px;
 }
-.gd-grid-layout .gd-hotspot-border__container {
-  display: none;
+
+.gd-grid-layout-dropzone {
+  z-index: 99;
+}
+.gd-grid-layout-dropzone--type-prev, .gd-grid-layout-dropzone--type-next {
   position: absolute;
-  padding: 10px 0;
-  width: 10px;
-  height: 100%;
 }
-.gd-grid-layout .gd-first-container-row-dropzone .gd-hotspot-border__container {
-  padding-top: 0;
+.gd-grid-layout-dropzone--type-prev .drop-hint {
+  float: left;
+  margin-left: -3px;
+}
+.gd-grid-layout-dropzone--type-next .drop-hint {
+  float: right;
+  margin-left: 3px;
+}
+.gd-grid-layout-dropzone--hidden {
+  display: none;
+}
+.gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--type-prev, .gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--type-next {
+  top: 0;
+  bottom: 0;
+  width: 50%;
 }
-.gd-grid-layout .gd-hotspot-border__drop-target {
+.gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--type-prev.gd-grid-layout-dropzone--full, .gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--type-next.gd-grid-layout-dropzone--full {
   width: 100%;
-  height: 100%;
-  padding: 2px;
-  border: 1px dashed var(--gd-palette-primary-base, #14b2e2);
-  border-radius: 15px;
-  background-color: var(--gd-palette-primary-dimmed, #e8f7fc);
 }
-.gd-grid-layout .gd-hotspot-border__drop-target .drop-target-inner {
-  width: 4px;
-  height: 100%;
-  padding: 0;
-  border-radius: 2px;
-  background-color: var(--gd-palette-primary-base, #14b2e2);
+.gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--type-prev {
+  left: 0;
 }
-.gd-grid-layout .dropzone.prev.active .gd-hotspot-border__container {
+.gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--type-prev.gd-grid-layout-dropzone--active .gd-grid-layout-dropzone__drop-target--direction-row {
   left: -15px;
-  display: block;
 }
-.gd-grid-layout .dropzone.next.active .gd-hotspot-border__container {
+.gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--type-next {
+  right: 0;
+}
+.gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--type-next.gd-grid-layout-dropzone--active .gd-grid-layout-dropzone__drop-target--direction-row {
   right: -15px;
-  display: block;
 }
-
-.gd-dashboard-nested-layout-widget--column .dropzone.prev, .gd-dashboard-nested-layout-widget--column .dropzone.next {
-  top: unset;
+.gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--extended {
+  width: 100%;
+}
+.gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--isOverNestedLayout.gd-grid-layout-dropzone--type-prev, .gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--isOverNestedLayout.gd-grid-layout-dropzone--type-next {
+  width: 50px;
+}
+.gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--type-prev, .gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--type-next {
   right: 0;
-  bottom: unset;
   left: 0;
-  width: 100%;
   height: 50%;
 }
-.gd-dashboard-nested-layout-widget--column .dropzone.prev {
-  top: 0;
+.gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--type-prev.gd-grid-layout-dropzone--full, .gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--type-next.gd-grid-layout-dropzone--full {
+  width: 100%;
+  height: 100%;
 }
-.gd-dashboard-nested-layout-widget--column .dropzone.prev.full {
-  width: 50%;
+.gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--type-prev {
+  top: 0;
 }
-.gd-dashboard-nested-layout-widget--column .dropzone.prev.active .gd-hotspot-border__container {
-  left: unset;
+.gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--type-prev.gd-grid-layout-dropzone--active .gd-grid-layout-dropzone__drop-target--direction-column {
   top: -5px;
 }
-.gd-dashboard-nested-layout-widget--column .dropzone.next {
+.gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--type-next {
   bottom: 0;
 }
-.gd-dashboard-nested-layout-widget--column .dropzone.next.full {
-  width: 50%;
-}
-.gd-dashboard-nested-layout-widget--column .dropzone.next.active .gd-hotspot-border__container {
-  right: unset;
+.gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--type-next.gd-grid-layout-dropzone--active .gd-grid-layout-dropzone__drop-target--direction-column {
   bottom: -5px;
 }
-.gd-dashboard-nested-layout-widget--column .dropzone.gd-nested-layout-hotspot.prev, .gd-dashboard-nested-layout-widget--column .dropzone.gd-nested-layout-hotspot.next {
+.gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--isOverNestedLayout.gd-grid-layout-dropzone--type-prev, .gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--isOverNestedLayout.gd-grid-layout-dropzone--type-next {
   height: 50px;
 }
-.gd-dashboard-nested-layout-widget--column .dropzone.gd-first-container-row-dropzone.prev.active .gd-hotspot-border__container {
+.gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--isInFirstRow.gd-grid-layout-dropzone--type-prev.gd-grid-layout-dropzone--active .gd-grid-layout-dropzone__drop-target--direction-column {
   top: -15px;
 }
-.gd-dashboard-nested-layout-widget--column .gd-hotspot-border__container {
+.gd-grid-layout-dropzone__drop-target {
+  display: none;
+  position: absolute;
+}
+.gd-grid-layout-dropzone__drop-target--direction-row {
+  padding: 10px 0;
+  width: 10px;
+  height: 100%;
+}
+.gd-grid-layout-dropzone__drop-target--direction-row .gd-grid-layout-dropzone__drop-target-inner {
+  width: 4px;
+}
+.gd-grid-layout-dropzone__drop-target--direction-column {
   padding: 0;
   width: 100%;
   height: 10px;
 }
-.gd-dashboard-nested-layout-widget--column .gd-hotspot-border__drop-target .drop-target-inner {
+.gd-grid-layout-dropzone__drop-target--direction-column .gd-grid-layout-dropzone__drop-target-inner {
+  width: 100%;
+}
+.gd-grid-layout-dropzone__drop-target.gd-grid-layout-dropzone--isInFirstRow {
+  padding-top: 0;
+}
+.gd-grid-layout-dropzone--active .gd-grid-layout-dropzone__drop-target {
+  display: block;
+}
+.gd-grid-layout-dropzone__drop-target-border {
   width: 100%;
+  height: 100%;
+  padding: 2px;
+  border: 1px dashed var(--gd-palette-primary-base, #14b2e2);
+  border-radius: 15px;
+  background-color: var(--gd-palette-primary-dimmed, #e8f7fc);
+}
+.gd-grid-layout-dropzone__drop-target-inner {
+  height: 100%;
+  padding: 0;
+  border-radius: 2px;
+  background-color: var(--gd-palette-primary-base, #14b2e2);
 }
 
 .gd-dashboard-settings-dialog {