diff --git a/chrome/content/zotero/elements/zoteroSearch.js b/chrome/content/zotero/elements/zoteroSearch.js
index 674ba729b3..0f35fceff2 100644
--- a/chrome/content/zotero/elements/zoteroSearch.js
+++ b/chrome/content/zotero/elements/zoteroSearch.js
@@ -221,28 +221,27 @@
class ZoteroSearchCondition extends XULElementBase {
content = MozXULElement.parseXULToFragment(`
-
-
+
+
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
`, ['chrome://zotero/locale/zotero.dtd', 'chrome://zotero/locale/searchbox.dtd']);
init() {
@@ -904,34 +903,32 @@
class ZoteroSearchAgeField extends XULElementBase {
content = MozXULElement.parseXULToFragment(`
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
`, ['chrome://zotero/locale/zotero.dtd', 'chrome://zotero/locale/searchbox.dtd']);
get value() {
- var input = this.querySelector('#input');
- var menulist = this.querySelector('#age-list');
+ var input = this.querySelector('.input');
+ var menulist = this.querySelector('.age-list');
return input.value + ' '
+ menulist.firstChild.childNodes[menulist.selectedIndex].getAttribute('value');
}
set value(val) {
- var input = this.querySelector('#input');
+ var input = this.querySelector('.input');
var [num, units] = val.split(' ');
input.setAttribute('value', num);
- var menulist = this.querySelector('#age-list');
+ var menulist = this.querySelector('.age-list');
var menupopup = menulist.firstChild;
var selectThis = 0;
diff --git a/scss/elements/_zoteroSearch.scss b/scss/elements/_zoteroSearch.scss
index c009c40586..ba03373056 100644
--- a/scss/elements/_zoteroSearch.scss
+++ b/scss/elements/_zoteroSearch.scss
@@ -6,6 +6,11 @@ zoterosearch {
groupbox {
margin-top: 0;
padding-top: 0;
+
+ & > #conditions {
+ -moz-appearance: groupbox;
+ padding: 6px;
+ }
}
caption {
@@ -22,6 +27,20 @@ zoterosearch {
margin-right: .5em;
}
+ input {
+ margin-block: 0;
+ }
+
+ .search-condition {
+ -moz-box-flex: 1;
+ display: flex;
+ align-items: center;
+
+ .valuefield, .valuemenu, .value-date-age {
+ flex: 1;
+ }
+ }
+
#operatorsmenu {
width: 15em;
}
@@ -50,8 +69,14 @@ zoterosearch {
align-self: center;
}
- #search-in-the-last input
- {
- min-width: 3em;
+ .search-in-the-last {
+ -moz-box-flex: 1;
+ display: flex;
+ align-items: center;
+
+ .input {
+ min-width: 3em;
+ flex: 1;
+ }
}
}