Z7: Fix conflict resolution merge window styling

Closes #3090
This commit is contained in:
Dan Stillman 2023-05-05 04:28:07 -04:00
parent 969b782fd0
commit 00703c0b8f
3 changed files with 69 additions and 59 deletions

View file

@ -33,11 +33,9 @@
this._type = null; this._type = null;
this.content = MozXULElement.parseXULToFragment(` this.content = MozXULElement.parseXULToFragment(`
<div id="merge-group" xmlns="http://www.w3.org/1999/xhtml"> <merge-pane id="left-pane" flex="1" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"/>
<merge-pane id="left-pane" flex="1" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"/> <merge-pane id="right-pane" flex="1" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"/>
<merge-pane id="right-pane" flex="1" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"/> <merge-pane id="merge-pane" flex="1" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"/>
<merge-pane id="merge-pane" flex="1" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"/>
</div>
`, ['chrome://zotero/locale/zotero.dtd']); `, ['chrome://zotero/locale/zotero.dtd']);
} }
@ -84,17 +82,17 @@
} }
this._type = val; this._type = val;
this._id('merge-group').setAttribute('mergetype', val); this.setAttribute('mergetype', val);
} }
set leftCaption(val) { set leftCaption(val) {
this._leftPane.caption.label = val; this._leftPane.caption = val;
} }
set rightCaption(val) { set rightCaption(val) {
this._rightPane.caption.label = val; this._rightPane.caption = val;
} }
set mergeCaption(val) { set mergeCaption(val) {
this._mergePane.caption.label = val; this._mergePane.caption = val;
} }
get leftPane() { get leftPane() {
@ -249,17 +247,15 @@
this._deleted = false; this._deleted = false;
this.content = MozXULElement.parseXULToFragment(` this.content = MozXULElement.parseXULToFragment(`
<vbox flex="1"> <groupbox>
<groupbox class="merge-pane" flex="1"> <label><html:h2/></label>
<caption class="caption"/> <html:div class="parent-row" hidden="true"/>
<html:div class="parent-row" hidden="true"/> <box class="object-placeholder"/>
<box class="object-placeholder"/> <hbox class="delete-box" hidden="true" flex="1">
<hbox class="delete-box" hidden="true" flex="1"> <label value="&zotero.merge.deleted;"/>
<label value="&zotero.merge.deleted;"/> </hbox>
</hbox> </groupbox>
</groupbox> <button class="choose-button"/>
<button class="choose-button"/>
</vbox>
`, ['chrome://zotero/locale/zotero.dtd']); `, ['chrome://zotero/locale/zotero.dtd']);
} }
@ -274,7 +270,7 @@
this.isMergePane = this.id == 'merge-pane'; this.isMergePane = this.id == 'merge-pane';
if (!this.isMergePane) { if (!this.isMergePane) {
this.pane.onclick = function () { this.box.onclick = function () {
this.parent.choosePane(this); this.parent.choosePane(this);
}.bind(this); }.bind(this);
} }
@ -284,12 +280,16 @@
return this.parent.type; return this.parent.type;
} }
get pane() { get box() {
return this._class('merge-pane'); return this.querySelector('groupbox');
} }
get caption() { get caption() {
return this._class('caption'); return this.querySelector('h2').textContent;
}
set caption(val) {
this.querySelector('h2').textContent = val;
} }
get parentRow() { get parentRow() {
@ -428,7 +428,7 @@
} }
click() { click() {
this.pane.click(); this.box.click();
} }
_class(className) { _class(className) {

View file

@ -51,7 +51,7 @@
<hbox align="center"> <hbox align="center">
<separator orient="vertical" flex="1"/> <separator orient="vertical" flex="1"/>
<hbox> <hbox>
<checkbox id="resolve-all" <checkbox id="resolve-all" native="true"
oncommand="Zotero_Merge_Window.updateNextFinish()"/> oncommand="Zotero_Merge_Window.updateNextFinish()"/>
</hbox> </hbox>
<separator orient="vertical"/> <separator orient="vertical"/>

View file

@ -61,42 +61,52 @@ wizard > deck {
/* merge.xml */ /* Merge Group */
zoteromergegroup { merge-group {
margin: 0; display: flex;
padding: 0;
overflow-y: auto;
} }
zoteromergepane *[anonid="delete-box"] { merge-pane {
flex: 1;
display: flex;
flex-direction: column;
min-width: 26em;
}
merge-pane groupbox {
flex: 1;
}
merge-pane[selected=true] h2,
merge-pane[selected=true] attachment-box #title {
color: red;
font-weight: bold;
text-decoration: underline;
}
merge-group:not([mergetype="note"]) #left-pane:active h2,
merge-group:not([mergetype="note"]) #right-pane:active h2,
merge-group:not([mergetype="note"]) #left-pane:active attachment-box #title,
merge-group:not([mergetype="note"]) #right-pane:active attachment-box #title {
color: red;
font-weight: bold;
}
#left-pane:hover:not([selected=true]) h2,
#right-pane:hover:not([selected=true]) h2 {
text-decoration: underline;
}
merge-pane .parent-row {
margin: 7px 5px;
}
merge-pane .parent-row span {
font-weight: bold;
}
merge-pane .delete-box {
min-width: 15em; min-width: 15em;
-moz-box-align: center; -moz-box-align: center;
-moz-box-pack: center; -moz-box-pack: center;
} }
zoteromergepane .groupbox-body {
padding: 0;
}
zoteromergepane[selected=true] groupbox caption {
color: red;
font-weight: bold;
}
hbox:not([mergetype=note]) zoteromergepane:active[id=leftpane] groupbox caption,
hbox:not([mergetype=note]) zoteromergepane:active[id=rightpane] groupbox caption {
color: red;
font-weight: bold;
}
zoteromergepane {
min-width: 28em;
}
zoteromergepane div[anonid=parent-row] {
margin: 7px 5px;
}
zoteromergepane div[anonid=parent-row] span {
font-weight: bold;
}