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

Stop the board overflowing a short pane and taking the tabs with 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 root carried min-height:640px alongside height:100%. In a pane shorter than
that the element is taller than its host, so the host scrolls the whole plugin —
tab strip included — and the reader gets a second scrollbar that hides the tabs
it is meant to reach. That is the scrollbar on DX Life's research page.

The floor becomes min-height:0, which is what every inner grid area already
carries for exactly this reason; the root was the one that did not. Nothing
collapses without it: the standalone leaf gives the element a definite height
with position:fixed and inset:0, and the pixel floor was unique to this plugin
rather than a house pattern.
This commit is contained in:
Doxa Maps 2026-09-28 14:35:27 +00:00
parent 43d290312d
commit 45c2ce9bcc
11 changed files with 18 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
plugin-designs/gospel-internet/board.vue
View file

@ -171,7 +171,12 @@ const sourcesLine = computed(() => (board.meta.value.sources || []).join(' · ')
useShadowStyles(
':host{display:block}' +
'.gb{--gb-bg:#f3f3f1;position:relative;box-sizing:border-box;width:100%;height:100%;min-height:640px;display:grid;background:var(--gb-bg);color:#3b463d;' +
// min-height:0, NOT a pixel floor. With height:100% a floor taller than the pane makes the
// element overflow its host, so the HOST scrolls the whole plugin — tab strip included — and
// the reader gets a second scrollbar that hides the tabs. Every inner grid area already
// carries min-height:0 for the same reason; the root was the one that did not. The standalone
// leaf gives the element a definite height (position:fixed; inset:0), so nothing collapses.
'.gb{--gb-bg:#f3f3f1;position:relative;box-sizing:border-box;width:100%;height:100%;min-height:0;display:grid;background:var(--gb-bg);color:#3b463d;' +
'grid-template-columns:var(--facet-w,264px) minmax(0,1fr) var(--rail-w,360px);' +
'grid-template-rows:auto auto auto minmax(0,1fr) var(--table-h,38%);' +
// The charts rail runs the full height beside the map AND the table: sized to the map row alone it was

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

@ -615,7 +615,7 @@
"bundle": "gospel-internet",
"scriptUrl": "./gospel-internet/gospel-internet.js",
"output": "dx-maps/gospel-internet/gospel-internet.js",
"integrity": "sha384-vKM3Vo1mB+V2JNdKy3PxTOgszcgJqji0wwEIw+Lve1g3xfg1b6RKy5VkVUqCZ0rY",
"integrity": "sha384-pOsEqDURkoCiKPeAro9zdVMTmreY20+N9lqU8piXhEgQEOV+snCxvTG0rXWheAOJ",
"elements": [
"gospel-internet-board"
],
@ -635,7 +635,7 @@
"scriptUrl": "./gospel-internet/gospel-internet.js",
"embed": {
"iframe": "<iframe src=\"./gospel-internet/board/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=\"./gospel-internet/gospel-internet.js\" integrity=\"sha384-vKM3Vo1mB+V2JNdKy3PxTOgszcgJqji0wwEIw+Lve1g3xfg1b6RKy5VkVUqCZ0rY\" crossorigin=\"anonymous\"></script>\n<gospel-internet-board profile-config='{\"profile\":\"board\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></gospel-internet-board>"
"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=\"./gospel-internet/gospel-internet.js\" integrity=\"sha384-pOsEqDURkoCiKPeAro9zdVMTmreY20+N9lqU8piXhEgQEOV+snCxvTG0rXWheAOJ\" crossorigin=\"anonymous\"></script>\n<gospel-internet-board profile-config='{\"profile\":\"board\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></gospel-internet-board>"
},
"instances": [
{

2
public/dx-maps/gospel-internet/board/board/index.html
View file

@ -36,7 +36,7 @@
<script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
<!-- Bundle IIFE — registers the <gospel-internet-board> custom element. -->
<script src="../../gospel-internet.js" integrity="sha384-vKM3Vo1mB+V2JNdKy3PxTOgszcgJqji0wwEIw+Lve1g3xfg1b6RKy5VkVUqCZ0rY" crossorigin="anonymous"></script>
<script src="../../gospel-internet.js" integrity="sha384-pOsEqDURkoCiKPeAro9zdVMTmreY20+N9lqU8piXhEgQEOV+snCxvTG0rXWheAOJ" crossorigin="anonymous"></script>
<script>
// Mapbox token resolution — the A3 ladder, in precedence order:

2
public/dx-maps/gospel-internet/board/index.html
View file

@ -36,7 +36,7 @@
<script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
<!-- Bundle IIFE — registers the <gospel-internet-board> custom element. -->
<script src="../gospel-internet.js" integrity="sha384-vKM3Vo1mB+V2JNdKy3PxTOgszcgJqji0wwEIw+Lve1g3xfg1b6RKy5VkVUqCZ0rY" crossorigin="anonymous"></script>
<script src="../gospel-internet.js" integrity="sha384-pOsEqDURkoCiKPeAro9zdVMTmreY20+N9lqU8piXhEgQEOV+snCxvTG0rXWheAOJ" crossorigin="anonymous"></script>
<script>
// Mapbox token resolution — the A3 ladder, in precedence order:

2
public/dx-maps/gospel-internet/board/india-china/index.html
View file

@ -36,7 +36,7 @@
<script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
<!-- Bundle IIFE — registers the <gospel-internet-board> custom element. -->
<script src="../../gospel-internet.js" integrity="sha384-vKM3Vo1mB+V2JNdKy3PxTOgszcgJqji0wwEIw+Lve1g3xfg1b6RKy5VkVUqCZ0rY" crossorigin="anonymous"></script>
<script src="../../gospel-internet.js" integrity="sha384-pOsEqDURkoCiKPeAro9zdVMTmreY20+N9lqU8piXhEgQEOV+snCxvTG0rXWheAOJ" crossorigin="anonymous"></script>
<script>
// Mapbox token resolution — the A3 ladder, in precedence order:

2
public/dx-maps/gospel-internet/board/language-tree/index.html
View file

@ -36,7 +36,7 @@
<script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
<!-- Bundle IIFE — registers the <gospel-internet-board> custom element. -->
<script src="../../gospel-internet.js" integrity="sha384-vKM3Vo1mB+V2JNdKy3PxTOgszcgJqji0wwEIw+Lve1g3xfg1b6RKy5VkVUqCZ0rY" crossorigin="anonymous"></script>
<script src="../../gospel-internet.js" integrity="sha384-pOsEqDURkoCiKPeAro9zdVMTmreY20+N9lqU8piXhEgQEOV+snCxvTG0rXWheAOJ" crossorigin="anonymous"></script>
<script>
// Mapbox token resolution — the A3 ladder, in precedence order:

2
public/dx-maps/gospel-internet/board/platforms/index.html
View file

@ -36,7 +36,7 @@
<script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
<!-- Bundle IIFE — registers the <gospel-internet-board> custom element. -->
<script src="../../gospel-internet.js" integrity="sha384-vKM3Vo1mB+V2JNdKy3PxTOgszcgJqji0wwEIw+Lve1g3xfg1b6RKy5VkVUqCZ0rY" crossorigin="anonymous"></script>
<script src="../../gospel-internet.js" integrity="sha384-pOsEqDURkoCiKPeAro9zdVMTmreY20+N9lqU8piXhEgQEOV+snCxvTG0rXWheAOJ" crossorigin="anonymous"></script>
<script>
// Mapbox token resolution — the A3 ladder, in precedence order:

2
public/dx-maps/gospel-internet/board/project-700/index.html
View file

@ -36,7 +36,7 @@
<script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
<!-- Bundle IIFE — registers the <gospel-internet-board> custom element. -->
<script src="../../gospel-internet.js" integrity="sha384-vKM3Vo1mB+V2JNdKy3PxTOgszcgJqji0wwEIw+Lve1g3xfg1b6RKy5VkVUqCZ0rY" crossorigin="anonymous"></script>
<script src="../../gospel-internet.js" integrity="sha384-pOsEqDURkoCiKPeAro9zdVMTmreY20+N9lqU8piXhEgQEOV+snCxvTG0rXWheAOJ" crossorigin="anonymous"></script>
<script>
// Mapbox token resolution — the A3 ladder, in precedence order:

2
public/dx-maps/gospel-internet/board/zero/index.html
View file

@ -36,7 +36,7 @@
<script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
<!-- Bundle IIFE — registers the <gospel-internet-board> custom element. -->
<script src="../../gospel-internet.js" integrity="sha384-vKM3Vo1mB+V2JNdKy3PxTOgszcgJqji0wwEIw+Lve1g3xfg1b6RKy5VkVUqCZ0rY" crossorigin="anonymous"></script>
<script src="../../gospel-internet.js" integrity="sha384-pOsEqDURkoCiKPeAro9zdVMTmreY20+N9lqU8piXhEgQEOV+snCxvTG0rXWheAOJ" crossorigin="anonymous"></script>
<script>
// Mapbox token resolution — the A3 ladder, in precedence order:

2
public/dx-maps/gospel-internet/gospel-internet.js
View file

File diff suppressed because one or more lines are too long

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

@ -615,7 +615,7 @@
"bundle": "gospel-internet",
"scriptUrl": "./gospel-internet/gospel-internet.js",
"output": "dx-maps/gospel-internet/gospel-internet.js",
"integrity": "sha384-vKM3Vo1mB+V2JNdKy3PxTOgszcgJqji0wwEIw+Lve1g3xfg1b6RKy5VkVUqCZ0rY",
"integrity": "sha384-pOsEqDURkoCiKPeAro9zdVMTmreY20+N9lqU8piXhEgQEOV+snCxvTG0rXWheAOJ",
"elements": [
"gospel-internet-board"
],
@ -635,7 +635,7 @@
"scriptUrl": "./gospel-internet/gospel-internet.js",
"embed": {
"iframe": "<iframe src=\"./gospel-internet/board/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=\"./gospel-internet/gospel-internet.js\" integrity=\"sha384-vKM3Vo1mB+V2JNdKy3PxTOgszcgJqji0wwEIw+Lve1g3xfg1b6RKy5VkVUqCZ0rY\" crossorigin=\"anonymous\"></script>\n<gospel-internet-board profile-config='{\"profile\":\"board\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></gospel-internet-board>"
"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=\"./gospel-internet/gospel-internet.js\" integrity=\"sha384-pOsEqDURkoCiKPeAro9zdVMTmreY20+N9lqU8piXhEgQEOV+snCxvTG0rXWheAOJ\" crossorigin=\"anonymous\"></script>\n<gospel-internet-board profile-config='{\"profile\":\"board\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></gospel-internet-board>"
},
"instances": [
{