www

commit 44632e22180dce36dc94c7089e7bdb7123c13e38
parent 724329d94865acfc16bbd5665385d75de4dca371
Author: Dan Stillman <dstillman@zotero.org>
Date:   Fri,  2 Mar 2018 19:50:11 -0500

Make the Windows UI somewhat less unpleasant

- Get rid of the hideous blue effect in the menubar and toolbar
- Slim down splitters
- Get rid of awful grippies except when collapsed (and make them
  slightly less ugly in the collapsed state)
- Reduce spacing of tags in tag selector
- Tweak twisty spacing
- Get rid of stray line to the right of item pane tabs

We may still want to get rid of the menubar (#366), and we can do better
than the ugly gray backgrounds (#365), but this is a start.

I'm not sure if everything will look the same on all Windows versions,
so this will need a little testing.

Closes #367

Diffstat:
M
chrome/content/zotero-platform/unix/overlay.css
 | 
8
+++++---
M
chrome/content/zotero-platform/win/overlay.css
 | 
90
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++--------
M
chrome/skin/default/zotero/overlay.css
 | 
8
--------

3 files changed, 86 insertions(+), 20 deletions(-)
diff --git a/chrome/content/zotero-platform/unix/overlay.css b/chrome/content/zotero-platform/unix/overlay.css
@@ -228,8 +228,10 @@ tab {
 #zotero-prefs .numberbox-input-box{
 	-moz-appearance: textfield;
 }
-/* Grippy icon missing anyway */
-#zotero-pane splitter{
+
+#zotero-pane splitter {
+	border: 0;
 	width: 6px;
+	background-color: transparent;
+	background-image: none;
 }
-
diff --git a/chrome/content/zotero-platform/win/overlay.css b/chrome/content/zotero-platform/win/overlay.css
@@ -1,3 +1,18 @@
+:root {
+	--theme-border-color: #cecece;
+}
+
+/* Hide horrible blue effect for menu bar and toolbar */
+#navigator-toolbox {
+	-moz-appearance: none;
+}
+
+#zotero-pane #zotero-toolbar {
+	-moz-appearance: none !important;
+	margin-top: -4px;
+	border-bottom-color: var(--theme-border-color);
+}
+
 /*
  As of Fx36, the built-in styles don't properly handle a menu-button within combined buttons.
  
@@ -230,6 +245,46 @@ toolbar:not([id="nav-bar"]) #zotero-toolbar-buttons separator {
 	border-color: #818790;
 }
 
+#zotero-collections-splitter:not([state=collapsed]),
+#zotero-items-splitter:not([state=collapsed]),
+#zotero-tags-splitter:not([state=collapsed]) {
+	border: 0;
+	background-color: transparent;
+	position: relative;
+	/* Positive z-index positions the splitter on top of its siblings and makes
+	it clickable on both sides. */
+	z-index: 1;
+}
+
+#zotero-collections-splitter:not([state=collapsed]),
+#zotero-items-splitter:not([state=collapsed]):not([orient=vertical]),
+#zotero-tags-splitter:not([state=collapsed]) {
+	border-inline-end: 1px solid var(--theme-border-color);
+	min-width: 0;
+	width: 3px;
+	margin-inline-start: -3px;
+}
+
+#zotero-tags-splitter:not([state=collapsed]),
+#zotero-items-splitter:not([state=collapsed])[orient=vertical] {
+	border-block-end: 1px solid var(--theme-border-color);
+	min-height: 0;
+	height: 3px;
+	margin-block-start: -3px;
+}
+
+#zotero-collections-splitter > grippy,
+#zotero-items-splitter > grippy,
+#zotero-tags-splitter > grippy {
+	border: 0;
+}
+
+#zotero-collections-splitter:not([state=collapsed]) > grippy,
+#zotero-items-splitter:not([state=collapsed]) > grippy,
+#zotero-tags-splitter:not([state=collapsed]) > grippy {
+	display: none;
+}
+
 #zotero-collections-tree, #zotero-items-tree, #zotero-view-item {
 	-moz-appearance: none;
 	border-style: solid;
@@ -242,6 +297,10 @@ toolbar:not([id="nav-bar"]) #zotero-toolbar-buttons separator {
 	-moz-border-left-colors: none;
 }
 
+treechildren::-moz-tree-twisty {
+	padding: 0 4px;
+}
+
 /* Undo tree row spacing change in Fx25 on Windows */
 #zotero-collections-tree treechildren::-moz-tree-row,
 #zotero-items-tree treechildren::-moz-tree-row,
@@ -249,8 +308,8 @@ toolbar:not([id="nav-bar"]) #zotero-toolbar-buttons separator {
 	height: 1.6em;
 }
 
-#zotero-collections-tree {
-	border-width: 0 1px 1px 0;
+tree {
+	border-width: 0;
 }
 
 /* Restore row highlighting on drag over, though I'm not sure how we're losing it to begin with. */
@@ -258,15 +317,31 @@ toolbar:not([id="nav-bar"]) #zotero-toolbar-buttons separator {
 	background-color: Highlight;
 }
 
-#zotero-items-tree {
-	border-width: 0 1px;
+#zotero-tag-selector groupbox {
+	-moz-appearance: none;
+	padding: 0;
+	border: 0;
+}
+
+#tags-box {
+	padding-top: 0.1em;
+	padding-left: 0.05em;
+}
+
+#tags-box button {
+	margin: .04em 0 0 .15em !important;
+}
+
+#zotero-editpane-tabs spacer {
+	border: 0;
 }
 
 #zotero-view-item {
 	padding: 0 !important;
 	-moz-appearance: none;
 	background-color: -moz-field;
-	border-width: 1px 0 0  1px;
+	border-width: 1px 0 0  0;
+	border-color: var(--theme-border-color);
 }
 
 #zotero-view-tabbox > tabs {
@@ -275,10 +350,7 @@ toolbar:not([id="nav-bar"]) #zotero-toolbar-buttons separator {
 
 #zotero-item-pane-groupbox {
 	-moz-appearance: none !important;
-	border-radius: 0;
-	border-width: 0 0 0 1px;
-	border-color: #818790;
-	border-style: solid;
+	border-width: 0;
 }
 
 #zotero-editpane-item-box > scrollbox, #zotero-view-item > tabpanel > vbox, 
diff --git a/chrome/skin/default/zotero/overlay.css b/chrome/skin/default/zotero/overlay.css
@@ -50,14 +50,6 @@
 	background: #FFFF99 !important;
 }
 
-#zotero-pane splitter
-{
-	border: 0;
-	width: 10px;
-	background-color: transparent;
-	background-image: none;
-}
-
 #zotero-items-column-hasAttachment, #zotero-items-column-numNotes {
 	min-width: 21px;
 }