testing

vaadin · Aug 22, 2024 · dccd199 · dccd199
1 parent 2be720f
commit dccd199
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 3 deletions.
diff --git a/packages/dashboard/src/vaadin-dashboard-layout-mixin.js b/packages/dashboard/src/vaadin-dashboard-layout-mixin.js
@@ -36,10 +36,13 @@ export const DashboardLayoutMixin = (superClass) =>
             var(--_vaadin-dashboard-default-col-max-width)
           );
 
+          /* Effective maxcolumn count */
+          --_vaadin-dashboard-col-max-count: var(--vaadin-dashboard-col-max-count, 6);
+
           /* Effective column count */
           --_vaadin-dashboard-effective-col-count: min(
             var(--_vaadin-dashboard-col-count),
-            var(--vaadin-dashboard-col-max-count)
+            var(--_vaadin-dashboard-col-max-count)
           );
 
           display: grid;

diff --git a/packages/dashboard/src/vaadin-dashboard-section.js b/packages/dashboard/src/vaadin-dashboard-section.js
@@ -34,7 +34,8 @@ class DashboardSection extends ControllerMixin(ElementMixin(PolylitMixin(LitElem
       :host {
         display: grid;
         grid-template-columns: subgrid;
-        grid-column: 1 / -1 !important;
+        --_vaadin-dashboard-section-column: 1 / calc(var(--_vaadin-dashboard-effective-col-count) + 1);
+        grid-column: var(--_vaadin-dashboard-section-column) !important;
         gap: var(--vaadin-dashboard-gap, 1rem);
       }
 
@@ -44,7 +45,7 @@ class DashboardSection extends ControllerMixin(ElementMixin(PolylitMixin(LitElem
 
       header {
         display: flex;
-        grid-column: 1 / -1;
+        grid-column: var(--_vaadin-dashboard-section-column);
         justify-content: space-between;
         align-items: center;
       }

diff --git a/packages/dashboard/test/dashboard-layout.test.ts b/packages/dashboard/test/dashboard-layout.test.ts
@@ -14,6 +14,9 @@ import {
   setMinimumColumnWidth,
 } from './helpers.js';
 
+// eslint-disable-next-line no-console
+console.log(navigator.userAgent);
+
 /**
  * Validates the given grid layout.
  *

diff --git a/packages/dashboard/test/dashboard.test.ts b/packages/dashboard/test/dashboard.test.ts
@@ -7,6 +7,9 @@ import { getElementFromCell, setGap, setMaximumColumnWidth, setMinimumColumnWidt
 
 type TestDashboardItem = DashboardItem & { id: string };
 
+// eslint-disable-next-line no-console
+console.log(navigator.userAgent);
+
 describe('dashboard', () => {
   let dashboard: Dashboard<TestDashboardItem>;
   const columnWidth = 100;