diff --git a/.changeset/statistics-prompt-layout.md b/.changeset/statistics-prompt-layout.md new file mode 100644 index 000000000..dabe699f7 --- /dev/null +++ b/.changeset/statistics-prompt-layout.md @@ -0,0 +1,5 @@ +--- +"ftw": patch +--- + +Keep the statistics and Cloud terms prompt readable by making it span the full Overview width. diff --git a/web/project-statistics.js b/web/project-statistics.js index 04f19f88f..e6fe8d3f1 100644 --- a/web/project-statistics.js +++ b/web/project-statistics.js @@ -67,7 +67,15 @@ status=v[0];policy=v[1]; if(!policy.cloud_includes_statistics || !policy.standalone)return; var prompt=document.getElementById("project-statistics-prompt"); - if(!prompt){prompt=node("section");prompt.id="project-statistics-prompt";prompt.setAttribute("aria-label","Project statistics choice");var main=document.querySelector("main")||document.body;main.insertBefore(prompt,main.firstChild);} + if(!prompt){ + prompt=node("section"); + prompt.id="project-statistics-prompt"; + prompt.setAttribute("aria-label","Project statistics choice"); + // The Overview grid has twelve columns; the prompt needs the whole row. + prompt.style.gridColumn="1 / -1"; + var main=document.querySelector("main")||document.body; + main.insertBefore(prompt,main.firstChild); + } paint(prompt,false); document.querySelectorAll("[data-project-statistics-settings]").forEach(function(host){paint(host,true);}); }).catch(function(){}); diff --git a/web/project-statistics.test.mjs b/web/project-statistics.test.mjs index 1bf529fd9..55716d0d0 100644 --- a/web/project-statistics.test.mjs +++ b/web/project-statistics.test.mjs @@ -7,7 +7,7 @@ import {setImmediate} from 'node:timers/promises'; const source=readFileSync(new URL('./project-statistics.js',import.meta.url),'utf8'); function page(cloud=false,authorised=true) { class Element { - constructor(tag){this.tag=tag;this.children=[];this.events={};this.ownText='';} + constructor(tag){this.tag=tag;this.children=[];this.events={};this.style={};this.ownText='';} appendChild(e){this.children.push(e);return e;} insertBefore(e){this.children.unshift(e);} set textContent(v){this.ownText=v;this.children=[];}