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
This commit is contained in:
Dan Stillman 2018-03-02 19:50:11 -05:00
parent 724329d948
commit 44632e2218
3 changed files with 87 additions and 21 deletions

View File

@ -228,8 +228,10 @@ tab {
#zotero-prefs .numberbox-input-box{ #zotero-prefs .numberbox-input-box{
-moz-appearance: textfield; -moz-appearance: textfield;
} }
/* Grippy icon missing anyway */
#zotero-pane splitter{
width: 6px;
}
#zotero-pane splitter {
border: 0;
width: 6px;
background-color: transparent;
background-image: none;
}

View File

@ -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. 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; 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 { #zotero-collections-tree, #zotero-items-tree, #zotero-view-item {
-moz-appearance: none; -moz-appearance: none;
border-style: solid; border-style: solid;
@ -242,6 +297,10 @@ toolbar:not([id="nav-bar"]) #zotero-toolbar-buttons separator {
-moz-border-left-colors: none; -moz-border-left-colors: none;
} }
treechildren::-moz-tree-twisty {
padding: 0 4px;
}
/* Undo tree row spacing change in Fx25 on Windows */ /* Undo tree row spacing change in Fx25 on Windows */
#zotero-collections-tree treechildren::-moz-tree-row, #zotero-collections-tree treechildren::-moz-tree-row,
#zotero-items-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; height: 1.6em;
} }
#zotero-collections-tree { tree {
border-width: 0 1px 1px 0; border-width: 0;
} }
/* Restore row highlighting on drag over, though I'm not sure how we're losing it to begin with. */ /* 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; background-color: Highlight;
} }
#zotero-items-tree { #zotero-tag-selector groupbox {
border-width: 0 1px; -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 { #zotero-view-item {
padding: 0 !important; padding: 0 !important;
-moz-appearance: none; -moz-appearance: none;
background-color: -moz-field; 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 { #zotero-view-tabbox > tabs {
@ -275,10 +350,7 @@ toolbar:not([id="nav-bar"]) #zotero-toolbar-buttons separator {
#zotero-item-pane-groupbox { #zotero-item-pane-groupbox {
-moz-appearance: none !important; -moz-appearance: none !important;
border-radius: 0; border-width: 0;
border-width: 0 0 0 1px;
border-color: #818790;
border-style: solid;
} }
#zotero-editpane-item-box > scrollbox, #zotero-view-item > tabpanel > vbox, #zotero-editpane-item-box > scrollbox, #zotero-view-item > tabpanel > vbox,

View File

@ -50,14 +50,6 @@
background: #FFFF99 !important; background: #FFFF99 !important;
} }
#zotero-pane splitter
{
border: 0;
width: 10px;
background-color: transparent;
background-image: none;
}
#zotero-items-column-hasAttachment, #zotero-items-column-numNotes { #zotero-items-column-hasAttachment, #zotero-items-column-numNotes {
min-width: 21px; min-width: 21px;
} }