doxa-life/doxa-maps
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Big Picture: the share button fits its 38px header instead of overflowing it
Some checks are pending
Deploy to GitHub Pages / build (push) Waiting to run
Details
Deploy to GitHub Pages / deploy (push) Blocked by required conditions
Details

Browse source 
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.
This commit is contained in:
Doxa Maps 2026-09-28 15:27:03 +00:00
parent 246b3d46e1
commit 3c3bde71e4
8 changed files with 21 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
plugin-designs/research-dashboard/src/components/dashboards/DashboardTopBar.vue
View file

@ -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.

2
public/dx-maps/dashboard-plus-grid/dashboard-plus-grid.js
View file

@ -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); }

2
public/dx-maps/dashboard-plus-grid/dashboard-plus-grid/default/index.html
View file

@ -47,7 +47,7 @@
<script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
<!-- Bundle IIFE — registers the <dashboard-plus-grid> custom element. -->
<script src="../../dashboard-plus-grid.js" integrity="sha384-gnLnFU1o+rZZG6uon6FBI7c9TKL5FGVp+LqJLS6VjotwyBdNQ9RDhiJmM2xw2EGm" crossorigin="anonymous"></script>
<script src="../../dashboard-plus-grid.js" integrity="sha384-cidQP7qNgwbAu0H2/AjyKRNuyovwEPWFHcr6/uuQxmiUVVwTwZIIHc5rBCu5Smp6" crossorigin="anonymous"></script>
<script>
// Mapbox token resolution — the A3 ladder, in precedence order:

2
public/dx-maps/dashboard-plus-grid/dashboard-plus-grid/index.html
View file

@ -47,7 +47,7 @@
<script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
<!-- Bundle IIFE — registers the <dashboard-plus-grid> custom element. -->
<script src="../dashboard-plus-grid.js" integrity="sha384-gnLnFU1o+rZZG6uon6FBI7c9TKL5FGVp+LqJLS6VjotwyBdNQ9RDhiJmM2xw2EGm" crossorigin="anonymous"></script>
<script src="../dashboard-plus-grid.js" integrity="sha384-cidQP7qNgwbAu0H2/AjyKRNuyovwEPWFHcr6/uuQxmiUVVwTwZIIHc5rBCu5Smp6" crossorigin="anonymous"></script>
<script>
// Mapbox token resolution — the A3 ladder, in precedence order:

8
public/dx-maps/doxa-maps-spa/manifest.json
View file

@ -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": "<iframe src=\"./dashboard-plus-grid/dashboard-plus-grid/index.html?utm_source=YOUR_SOURCE\" width=\"100%\" height=\"600\" style=\"border:none;border-radius:12px;\" allowfullscreen></iframe>",
"script": "<!-- Mapbox engine, fetched early. Keep it only with a real Mapbox token in \"tk\": without one (or with \"provider\":\"maplibre\") the map draws with MapLibre and this line must go -->\n<link rel=\"preload\" as=\"script\" href=\"https://api.mapbox.com/mapbox-gl-js/v3.24.0/mapbox-gl.js\" integrity=\"sha384-tO0clamXONKwbiz7O6xJpUeyJbTSPugC+xM9clvfFvKTH3i8SmCawHGdf5quMWmZ\" crossorigin=\"anonymous\">\n<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./dashboard-plus-grid/dashboard-plus-grid.js\" integrity=\"sha384-gnLnFU1o+rZZG6uon6FBI7c9TKL5FGVp+LqJLS6VjotwyBdNQ9RDhiJmM2xw2EGm\" crossorigin=\"anonymous\"></script>\n<dashboard-plus-grid profile-config='{\"profile\":\"dashboard-plus-grid\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></dashboard-plus-grid>"
"script": "<!-- Mapbox engine, fetched early. Keep it only with a real Mapbox token in \"tk\": without one (or with \"provider\":\"maplibre\") the map draws with MapLibre and this line must go -->\n<link rel=\"preload\" as=\"script\" href=\"https://api.mapbox.com/mapbox-gl-js/v3.24.0/mapbox-gl.js\" integrity=\"sha384-tO0clamXONKwbiz7O6xJpUeyJbTSPugC+xM9clvfFvKTH3i8SmCawHGdf5quMWmZ\" crossorigin=\"anonymous\">\n<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./dashboard-plus-grid/dashboard-plus-grid.js\" integrity=\"sha384-cidQP7qNgwbAu0H2/AjyKRNuyovwEPWFHcr6/uuQxmiUVVwTwZIIHc5rBCu5Smp6\" crossorigin=\"anonymous\"></script>\n<dashboard-plus-grid profile-config='{\"profile\":\"dashboard-plus-grid\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></dashboard-plus-grid>"
},
"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": "<iframe src=\"./research-dashboard/research-dashboard/index.html?utm_source=YOUR_SOURCE\" width=\"100%\" height=\"600\" style=\"border:none;border-radius:12px;\" allowfullscreen></iframe>",
"script": "<!-- Mapbox engine, fetched early. Keep it only with a real Mapbox token in \"tk\": without one (or with \"provider\":\"maplibre\") the map draws with MapLibre and this line must go -->\n<link rel=\"preload\" as=\"script\" href=\"https://api.mapbox.com/mapbox-gl-js/v3.24.0/mapbox-gl.js\" integrity=\"sha384-tO0clamXONKwbiz7O6xJpUeyJbTSPugC+xM9clvfFvKTH3i8SmCawHGdf5quMWmZ\" crossorigin=\"anonymous\">\n<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./research-dashboard/research-dashboard.js\" integrity=\"sha384-vW2sW8IK08D2TFtd5mg5tENJUqDt7rHDmGnP7ko6iTJhPZjut1gN4bINRt2NoWxN\" crossorigin=\"anonymous\"></script>\n<research-dashboard-map profile-config='{\"profile\":\"research-dashboard\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></research-dashboard-map>"
"script": "<!-- Mapbox engine, fetched early. Keep it only with a real Mapbox token in \"tk\": without one (or with \"provider\":\"maplibre\") the map draws with MapLibre and this line must go -->\n<link rel=\"preload\" as=\"script\" href=\"https://api.mapbox.com/mapbox-gl-js/v3.24.0/mapbox-gl.js\" integrity=\"sha384-tO0clamXONKwbiz7O6xJpUeyJbTSPugC+xM9clvfFvKTH3i8SmCawHGdf5quMWmZ\" crossorigin=\"anonymous\">\n<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./research-dashboard/research-dashboard.js\" integrity=\"sha384-ez8yQPTOdett70yKc10hfOzCJcE0Qcf4nxDNacqoknNZRbp1esY+LdqUeyGyaQeF\" crossorigin=\"anonymous\"></script>\n<research-dashboard-map profile-config='{\"profile\":\"research-dashboard\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></research-dashboard-map>"
},
"bundle": "research-dashboard"
}

8
public/dx-maps/manifest.json
View file

@ -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": "<iframe src=\"./dashboard-plus-grid/dashboard-plus-grid/index.html?utm_source=YOUR_SOURCE\" width=\"100%\" height=\"600\" style=\"border:none;border-radius:12px;\" allowfullscreen></iframe>",
"script": "<!-- Mapbox engine, fetched early. Keep it only with a real Mapbox token in \"tk\": without one (or with \"provider\":\"maplibre\") the map draws with MapLibre and this line must go -->\n<link rel=\"preload\" as=\"script\" href=\"https://api.mapbox.com/mapbox-gl-js/v3.24.0/mapbox-gl.js\" integrity=\"sha384-tO0clamXONKwbiz7O6xJpUeyJbTSPugC+xM9clvfFvKTH3i8SmCawHGdf5quMWmZ\" crossorigin=\"anonymous\">\n<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./dashboard-plus-grid/dashboard-plus-grid.js\" integrity=\"sha384-gnLnFU1o+rZZG6uon6FBI7c9TKL5FGVp+LqJLS6VjotwyBdNQ9RDhiJmM2xw2EGm\" crossorigin=\"anonymous\"></script>\n<dashboard-plus-grid profile-config='{\"profile\":\"dashboard-plus-grid\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></dashboard-plus-grid>"
"script": "<!-- Mapbox engine, fetched early. Keep it only with a real Mapbox token in \"tk\": without one (or with \"provider\":\"maplibre\") the map draws with MapLibre and this line must go -->\n<link rel=\"preload\" as=\"script\" href=\"https://api.mapbox.com/mapbox-gl-js/v3.24.0/mapbox-gl.js\" integrity=\"sha384-tO0clamXONKwbiz7O6xJpUeyJbTSPugC+xM9clvfFvKTH3i8SmCawHGdf5quMWmZ\" crossorigin=\"anonymous\">\n<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./dashboard-plus-grid/dashboard-plus-grid.js\" integrity=\"sha384-cidQP7qNgwbAu0H2/AjyKRNuyovwEPWFHcr6/uuQxmiUVVwTwZIIHc5rBCu5Smp6\" crossorigin=\"anonymous\"></script>\n<dashboard-plus-grid profile-config='{\"profile\":\"dashboard-plus-grid\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></dashboard-plus-grid>"
},
"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": "<iframe src=\"./research-dashboard/research-dashboard/index.html?utm_source=YOUR_SOURCE\" width=\"100%\" height=\"600\" style=\"border:none;border-radius:12px;\" allowfullscreen></iframe>",
"script": "<!-- Mapbox engine, fetched early. Keep it only with a real Mapbox token in \"tk\": without one (or with \"provider\":\"maplibre\") the map draws with MapLibre and this line must go -->\n<link rel=\"preload\" as=\"script\" href=\"https://api.mapbox.com/mapbox-gl-js/v3.24.0/mapbox-gl.js\" integrity=\"sha384-tO0clamXONKwbiz7O6xJpUeyJbTSPugC+xM9clvfFvKTH3i8SmCawHGdf5quMWmZ\" crossorigin=\"anonymous\">\n<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./research-dashboard/research-dashboard.js\" integrity=\"sha384-vW2sW8IK08D2TFtd5mg5tENJUqDt7rHDmGnP7ko6iTJhPZjut1gN4bINRt2NoWxN\" crossorigin=\"anonymous\"></script>\n<research-dashboard-map profile-config='{\"profile\":\"research-dashboard\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></research-dashboard-map>"
"script": "<!-- Mapbox engine, fetched early. Keep it only with a real Mapbox token in \"tk\": without one (or with \"provider\":\"maplibre\") the map draws with MapLibre and this line must go -->\n<link rel=\"preload\" as=\"script\" href=\"https://api.mapbox.com/mapbox-gl-js/v3.24.0/mapbox-gl.js\" integrity=\"sha384-tO0clamXONKwbiz7O6xJpUeyJbTSPugC+xM9clvfFvKTH3i8SmCawHGdf5quMWmZ\" crossorigin=\"anonymous\">\n<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./research-dashboard/research-dashboard.js\" integrity=\"sha384-ez8yQPTOdett70yKc10hfOzCJcE0Qcf4nxDNacqoknNZRbp1esY+LdqUeyGyaQeF\" crossorigin=\"anonymous\"></script>\n<research-dashboard-map profile-config='{\"profile\":\"research-dashboard\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></research-dashboard-map>"
},
"bundle": "research-dashboard"
}

2
public/dx-maps/research-dashboard/research-dashboard.js
View file

@ -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); }

2
public/dx-maps/research-dashboard/research-dashboard/index.html
View file

@ -36,7 +36,7 @@
<script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
<!-- Bundle IIFE — registers the <research-dashboard-map> custom element. -->
<script src="../research-dashboard.js" integrity="sha384-vW2sW8IK08D2TFtd5mg5tENJUqDt7rHDmGnP7ko6iTJhPZjut1gN4bINRt2NoWxN" crossorigin="anonymous"></script>
<script src="../research-dashboard.js" integrity="sha384-ez8yQPTOdett70yKc10hfOzCJcE0Qcf4nxDNacqoknNZRbp1esY+LdqUeyGyaQeF" crossorigin="anonymous"></script>
<script>
// Mapbox token resolution — the A3 ladder, in precedence order: