Prevent itemlist in classic cit and edit bibl dialogs from expanding

Also
- Cleanup the XUL of said dialogs
- Refactor, spearate and clarify custom CSS injection into FX XUL
  elements
This commit is contained in:
Adomas Venčkauskas 2024-04-16 11:44:58 +03:00
parent 76b7f4be4f
commit c9561f1041
12 changed files with 170 additions and 146 deletions

View file

@ -167,13 +167,20 @@ Services.scriptloader.loadSubScript('chrome://zotero/content/elements/librariesC
// inject custom CSS into FF built-in custom elements (currently only <wizard>)
const InjectCSSConfig = {
global: ["wizard"],
global: [
"wizard",
{
element: "dialog",
patchedFunction: "connectedCallback"
}
],
win: [
"wizard",
{
element: "dialog",
// The `attachShadow` are cleared in <dialog>, we need to monkey-patch after `connectedCallback`.
patchee: "connectedCallback"
patchedFunction: "connectedCallback",
filename: "wizard-dialog"
}
],
mac: [],
@ -185,24 +192,24 @@ Services.scriptloader.loadSubScript('chrome://zotero/content/elements/librariesC
if (key == "linux" && !Zotero.isLinux) continue;
let prefix = "";
if (key == "global") {
prefix = "zotero/skin/";
prefix = "zotero/skin/xulElementPatches/";
}
else {
prefix = "zotero-platform/content/";
prefix = "zotero-platform/content/xulElementPatches/";
}
for (let config of configs) {
let element, patchee;
let element, patchedFunction;
// By default, monkey-patch `attachShadow`
if (typeof config === "string") {
element = config;
patchee = "attachShadow";
patchedFunction = "attachShadow";
}
else {
element = config.element;
patchee = config.patchee;
patchedFunction = config.patchedFunction;
}
let oldFunc = customElements.get(element).prototype[patchee];
customElements.get(element).prototype[patchee] = function () {
let oldFunc = customElements.get(element).prototype[patchedFunction];
customElements.get(element).prototype[patchedFunction] = function () {
let ret = oldFunc.apply(this, arguments);
this.shadowRoot.append(MozXULElement.parseXULToFragment(
`<html:link rel="stylesheet" href="chrome://${prefix}${element}.css"/>`

View file

@ -34,6 +34,7 @@
<window
id="add-citation-dialog"
class="contain-richlistbox"
windowtype="zotero:item-selector"
orient="vertical"
title="&zotero.integration.addEditCitation.title;"
@ -61,7 +62,6 @@
<vbox id="zotero-select-items-container" flex="1">
<vbox flex="1">
<hbox flex="1">
<vbox align="stretch" flex="1" style="min-width: 500px">
<hbox align="center" pack="end">
@ -121,7 +121,6 @@
<checkbox oncommand="Zotero_Citation_Dialog.confirmRegenerate(true)" id="suppress-author" label="&zotero.citation.suppressAuthor.label;" tabindex="6" native="true"/>
</vbox>
</hbox>
</vbox>
<iframe id="editor" src="simpleEditor.html" hidden="true" flex="1" type="content" remote="false" maychangeremoteness="false"/>
<description id="zotero-editor-warning" style="margin: 9px 1px 0" hidden="true">&zotero.citation.editorWarning.label;</description>

View file

@ -33,6 +33,7 @@
<window
id="edit-bibliography-dialog"
class="contain-richlistbox"
orient="vertical"
title="&zotero.integration.editBibliography.title;"
onload="Zotero_Bibliography_Dialog.load();"
@ -58,7 +59,6 @@
</script>
<vbox id="zotero-select-items-container" flex="1">
<vbox flex="1">
<hbox flex="1">
<vbox align="stretch" flex="1">
<hbox align="center" pack="end">
@ -68,14 +68,12 @@
<vbox id="zotero-collections-tree-container" class="virtualized-table-container">
<html:div id="zotero-collections-tree" class="edit-bibl"></html:div>
</vbox>
<hbox id="zotero-items-pane-content" class="virtualized-table-container" flex="1">
<html:div id="zotero-items-tree"></html:div>
</hbox>
</hbox>
</vbox>
<hbox id="source-list">
<vbox align="center" pack="center" id="citation-buttons">
<toolbarbutton id="add" oncommand="Zotero_Bibliography_Dialog.add()" disabled="true"/>
<toolbarbutton id="remove" oncommand="Zotero_Bibliography_Dialog.remove()" disabled="true"/>
@ -87,8 +85,6 @@
onchanged="Zotero_Bibliography_Dialog.textChanged()"/>
</vbox>
</hbox>
</hbox>
</vbox>
<iframe id="editor" src="simpleEditor.html" flex="1" type="content" remote="false" maychangeremoteness="false"/>
<description id="zotero-editor-warning" style="margin: 9px 1px 0">&zotero.citation.editorWarning.label;</description>

View file

@ -384,3 +384,7 @@ window.citation-dialog {
window#add-citation-dialog, window#edit-bibliography-dialog {
min-height: 600px;
}
window#add-citation-dialog dialog, window#edit-bibliography-dialog dialog {
max-height: 100vh;
}

View file

@ -37,3 +37,12 @@
margin-bottom: 8px;
}
}
// richlistbox elements are crazy and will expand beyond the window size
// unless all/most elements in the hierarchy that contain that
// richlistbox have a min-height: 0 set
.contain-richlistbox {
vbox, hbox {
min-height: 0;
}
}

View file

@ -1,28 +0,0 @@
// Override/enhance mozilla <dialog> styles on Windows. See customElements.js
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
@namespace html url("http://www.w3.org/1999/xhtml");
@import "abstracts/variables";
@import "abstracts/functions";
@import "abstracts/mixins";
@import "abstracts/placeholders";
@import "abstracts/utilities";
@import "abstracts/split-button";
@import "abstracts/svgicon";
@import "themes/light";
@import "themes/dark";
// Base
// --------------------------------------------------
@import "base/base";
@import "win/abstracts/mixins";
@import "win/components/button";
.dialog-button-box {
margin-top: 8px;
}

View file

@ -1,23 +0,0 @@
// Override/enhance mozilla <wizard> styles on windows. See customElements.js
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
@namespace html url("http://www.w3.org/1999/xhtml");
@import "abstracts/variables";
@import "abstracts/functions";
@import "abstracts/mixins";
@import "abstracts/placeholders";
@import "abstracts/utilities";
@import "abstracts/split-button";
@import "abstracts/svgicon";
@import "themes/light";
@import "themes/dark";
// Base
// --------------------------------------------------
@import "base/base";
@import "win/abstracts/mixins";
@import "win/components/button";

View file

@ -0,0 +1,4 @@
The scss files in this directory are monkey-patch injected into firefox XUL elements with
shadow-doms that cannot be styled directly.
See chrome/content/zotero/customElements.js for how this is implemented and configured

View file

@ -0,0 +1,28 @@
// Override/enhance mozilla <dialog> styles on Windows. See customElements.js
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
@namespace html url("http://www.w3.org/1999/xhtml");
@import "../abstracts/variables";
@import "../abstracts/functions";
@import "../abstracts/mixins";
@import "../abstracts/placeholders";
@import "../abstracts/utilities";
@import "../abstracts/split-button";
@import "../abstracts/svgicon";
@import "../themes/light";
@import "../themes/dark";
// Base
// --------------------------------------------------
@import "../base/base";
@import "../win/abstracts/mixins";
@import "../win/components/button";
.dialog-button-box {
margin-top: 8px;
}

View file

@ -0,0 +1,5 @@
// Without this any richlistboxes within the dialog element will expand vertically
// beyond the limits of the dialog
vbox {
min-height: 0;
}

View file

@ -0,0 +1,23 @@
// Override/enhance mozilla <wizard> styles on windows. See customElements.js
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
@namespace html url("http://www.w3.org/1999/xhtml");
@import "../abstracts/variables";
@import "../abstracts/functions";
@import "../abstracts/mixins";
@import "../abstracts/placeholders";
@import "../abstracts/utilities";
@import "../abstracts/split-button";
@import "../abstracts/svgicon";
@import "../themes/light";
@import "../themes/dark";
// Base
// --------------------------------------------------
@import "../base/base";
@import "../win/abstracts/mixins";
@import "../win/components/button";