Skip to content

Commit

Permalink
Make the Windows UI somewhat less unpleasant
Browse files Browse the repository at this point in the history
- 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 (zotero#366), and we can do better
than the ugly gray backgrounds (zotero#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 zotero#367
  • Loading branch information
dstillman committed Mar 3, 2018
1 parent 724329d commit 44632e2
Show file tree
Hide file tree
Showing 3 changed files with 86 additions and 20 deletions.
8 changes: 5 additions & 3 deletions chrome/content/zotero-platform/unix/overlay.css
Expand Up @@ -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;
}

90 changes: 81 additions & 9 deletions 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.
Expand Down Expand Up @@ -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;
Expand All @@ -242,31 +297,51 @@ 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,
#zotero-prefs treechildren::-moz-tree-row {
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. */
#zotero-collections-tree treechildren::-moz-tree-row(dropOn) {
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 {
Expand All @@ -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,
Expand Down
8 changes: 0 additions & 8 deletions chrome/skin/default/zotero/overlay.css
Expand Up @@ -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;
}
Expand Down

0 comments on commit 44632e2

Please sign in to comment.