From 3c3bde71e48ae8ec367e8eaa16fa960164f98960 Mon Sep 17 00:00:00 2001 From: Doxa Maps Date: Mon, 28 Sep 2026 15:27:03 +0000 Subject: [PATCH] Big Picture: the share button fits its 38px header instead of overflowing it The Driver: the share button at the top right of the Big Picture dashboard is too large. Measured: the research-dashboard topbar is 38px tall, but ShareButton is the map toolbar's 40px round button (36px under 768px) plus a 2px rainbow ring, so 44px, taller than the bar it sits in, and clipped top and bottom. In this bar only (.rd-topbar), the button is 28px and its icon 15px: with the ring it is 32px, the height of the bar's own search box, centred with 5px above and below. Measured after, at 1440 and 390, on the Big Picture (dashboard-plus-grid) and research-dashboard leaves: the bar stays 38px; the title, search box and Align button keep their sizes. Map toolbars keep their 40px share button. Rebuilt research-dashboard + dashboard-plus-grid, tree regenerated. --- .../src/components/dashboards/DashboardTopBar.vue | 6 ++++++ public/dx-maps/dashboard-plus-grid/dashboard-plus-grid.js | 2 ++ .../dashboard-plus-grid/default/index.html | 2 +- .../dashboard-plus-grid/dashboard-plus-grid/index.html | 2 +- public/dx-maps/doxa-maps-spa/manifest.json | 8 ++++---- public/dx-maps/manifest.json | 8 ++++---- public/dx-maps/research-dashboard/research-dashboard.js | 2 ++ .../research-dashboard/research-dashboard/index.html | 2 +- 8 files changed, 21 insertions(+), 11 deletions(-) diff --git a/plugin-designs/research-dashboard/src/components/dashboards/DashboardTopBar.vue b/plugin-designs/research-dashboard/src/components/dashboards/DashboardTopBar.vue index 5eef991a4..48cf58bec 100644 --- a/plugin-designs/research-dashboard/src/components/dashboards/DashboardTopBar.vue +++ b/plugin-designs/research-dashboard/src/components/dashboards/DashboardTopBar.vue @@ -214,6 +214,12 @@ useShadowStyles(` .rd-topbar .rd-ttl{ font-weight:800; font-size:var(--fs-lg,13px); letter-spacing:.2px; color:var(--rd-header-ink,#f3f3f1); } .rd-topbar .rd-ttl .dot{ color:var(--rd-accent,#e67e22); } .rd-topbar .rd-spacer{ flex:1; } + /* SHARE in this bar (Driver 2026-09-28: "too large"). ShareButton is the map toolbar's 40px round button + (36px under 768px) + a 2px rainbow ring, so it measured 44px in a 38px bar: taller than the bar itself. + Here it takes the bar's own control scale instead: 28px + the ring = 32px, the search box's height, with the + icon at the search icon's 15px. Scoped to .rd-topbar, so the map toolbars keep their 40px button. */ + .rd-topbar .share-wrap .mcb{ width:28px; height:28px; } + .rd-topbar .share-wrap .mcb svg{ width:15px; height:15px; } /* primary FILTER search bar (shared SearchBar → bus.setSearch), lifted into the topbar row so it sits ABOVE the filters-dropdowns band (card BUG-RESEARCH-DASHBOARD-HEADER-STACK-WRONG). Compact it for the 52px bar: shrink the primitive's padding/height so the white box fits. diff --git a/public/dx-maps/dashboard-plus-grid/dashboard-plus-grid.js b/public/dx-maps/dashboard-plus-grid/dashboard-plus-grid.js index d20a6df82..ee851aff8 100644 --- a/public/dx-maps/dashboard-plus-grid/dashboard-plus-grid.js +++ b/public/dx-maps/dashboard-plus-grid/dashboard-plus-grid.js @@ -462,6 +462,8 @@ .rd-topbar .rd-ttl{ font-weight:800; font-size:var(--fs-lg,13px); letter-spacing:.2px; color:var(--rd-header-ink,#f3f3f1); } .rd-topbar .rd-ttl .dot{ color:var(--rd-accent,#e67e22); } .rd-topbar .rd-spacer{ flex:1; } + .rd-topbar .share-wrap .mcb{ width:28px; height:28px; } + .rd-topbar .share-wrap .mcb svg{ width:15px; height:15px; } .rd-topbar .rd-filter-search{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:2; width:360px; max-width:var(--rd-search-w); min-width:150px; } .rd-topbar .rd-filter-search .search-box{ margin:0; color:var(--rd-header-muted,#cbc5b9); } diff --git a/public/dx-maps/dashboard-plus-grid/dashboard-plus-grid/default/index.html b/public/dx-maps/dashboard-plus-grid/dashboard-plus-grid/default/index.html index 5a5d0a790..0949ca70c 100644 --- a/public/dx-maps/dashboard-plus-grid/dashboard-plus-grid/default/index.html +++ b/public/dx-maps/dashboard-plus-grid/dashboard-plus-grid/default/index.html @@ -47,7 +47,7 @@ - + - + \n\n" + "script": "\n\n\n\n" }, "instances": [ { @@ -1144,7 +1144,7 @@ "bundle": "research-dashboard", "scriptUrl": "./research-dashboard/research-dashboard.js", "output": "dx-maps/research-dashboard/research-dashboard.js", - "integrity": "sha384-vW2sW8IK08D2TFtd5mg5tENJUqDt7rHDmGnP7ko6iTJhPZjut1gN4bINRt2NoWxN", + "integrity": "sha384-ez8yQPTOdett70yKc10hfOzCJcE0Qcf4nxDNacqoknNZRbp1esY+LdqUeyGyaQeF", "elements": [ "research-dashboard-map" ], @@ -1163,7 +1163,7 @@ "scriptUrl": "./research-dashboard/research-dashboard.js", "embed": { "iframe": "", - "script": "\n\n\n\n" + "script": "\n\n\n\n" }, "bundle": "research-dashboard" } diff --git a/public/dx-maps/manifest.json b/public/dx-maps/manifest.json index e5226845b..aa12aad4e 100644 --- a/public/dx-maps/manifest.json +++ b/public/dx-maps/manifest.json @@ -233,7 +233,7 @@ "bundle": "dashboard-plus-grid", "scriptUrl": "./dashboard-plus-grid/dashboard-plus-grid.js", "output": "dx-maps/dashboard-plus-grid/dashboard-plus-grid.js", - "integrity": "sha384-gnLnFU1o+rZZG6uon6FBI7c9TKL5FGVp+LqJLS6VjotwyBdNQ9RDhiJmM2xw2EGm", + "integrity": "sha384-cidQP7qNgwbAu0H2/AjyKRNuyovwEPWFHcr6/uuQxmiUVVwTwZIIHc5rBCu5Smp6", "elements": [ "dashboard-plus-grid" ], @@ -256,7 +256,7 @@ "scriptUrl": "./dashboard-plus-grid/dashboard-plus-grid.js", "embed": { "iframe": "", - "script": "\n\n\n\n" + "script": "\n\n\n\n" }, "instances": [ { @@ -1144,7 +1144,7 @@ "bundle": "research-dashboard", "scriptUrl": "./research-dashboard/research-dashboard.js", "output": "dx-maps/research-dashboard/research-dashboard.js", - "integrity": "sha384-vW2sW8IK08D2TFtd5mg5tENJUqDt7rHDmGnP7ko6iTJhPZjut1gN4bINRt2NoWxN", + "integrity": "sha384-ez8yQPTOdett70yKc10hfOzCJcE0Qcf4nxDNacqoknNZRbp1esY+LdqUeyGyaQeF", "elements": [ "research-dashboard-map" ], @@ -1163,7 +1163,7 @@ "scriptUrl": "./research-dashboard/research-dashboard.js", "embed": { "iframe": "", - "script": "\n\n\n\n" + "script": "\n\n\n\n" }, "bundle": "research-dashboard" } diff --git a/public/dx-maps/research-dashboard/research-dashboard.js b/public/dx-maps/research-dashboard/research-dashboard.js index 36bdf77f0..b5bd8ed68 100644 --- a/public/dx-maps/research-dashboard/research-dashboard.js +++ b/public/dx-maps/research-dashboard/research-dashboard.js @@ -467,6 +467,8 @@ .rd-topbar .rd-ttl{ font-weight:800; font-size:var(--fs-lg,13px); letter-spacing:.2px; color:var(--rd-header-ink,#f3f3f1); } .rd-topbar .rd-ttl .dot{ color:var(--rd-accent,#e67e22); } .rd-topbar .rd-spacer{ flex:1; } + .rd-topbar .share-wrap .mcb{ width:28px; height:28px; } + .rd-topbar .share-wrap .mcb svg{ width:15px; height:15px; } .rd-topbar .rd-filter-search{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:2; width:360px; max-width:var(--rd-search-w); min-width:150px; } .rd-topbar .rd-filter-search .search-box{ margin:0; color:var(--rd-header-muted,#cbc5b9); } diff --git a/public/dx-maps/research-dashboard/research-dashboard/index.html b/public/dx-maps/research-dashboard/research-dashboard/index.html index 34c3c05c6..85f0dc642 100644 --- a/public/dx-maps/research-dashboard/research-dashboard/index.html +++ b/public/dx-maps/research-dashboard/research-dashboard/index.html @@ -36,7 +36,7 @@ - +