SideBySide2: Add preferences button in header

Replace the unicode arrows for previous/up/next with arrows from the
Tango Icon Library[1].  These are green arrows 16x16 and are installed
into the DOM using CSS sprites managed by GWT.

Add to the right of the navigation cluster a new gear icon that opens
the panel.  This icon lets mouse driven users adjust values quickly.

[1] http://tango.freedesktop.org/Tango_Icon_Library

Bug: issue 2225
Change-Id: Iaaea288990ed80431a4e44374530facffac4b842
This commit is contained in:
Shawn Pearce
2013-12-12 19:55:29 -08:00
parent cb4b96e315
commit 5257208045
10 changed files with 63 additions and 6 deletions

View File

@@ -18,9 +18,12 @@ limitations under the License.
xmlns:ui='urn:ui:com.google.gwt.uibinder'
xmlns:g='urn:import:com.google.gwt.user.client.ui'
xmlns:x='urn:import:com.google.gerrit.client.ui'>
<ui:with field='res' type='com.google.gerrit.client.diff.Resources'/>
<ui:style>
.header {
position: relative;
height: 16px;
line-height: 16px;
max-width: 1484px;
}
.reviewed input {
@@ -35,6 +38,7 @@ limitations under the License.
position: absolute;
top: 0;
right: 15px;
height: 16px;
font-family: Arial Unicode MS, sans-serif;
}
.nodiff {
@@ -56,12 +60,18 @@ limitations under the License.
</span>
<div class='{style.navigation}'>
<x:InlineHyperlink ui:field='prev'>&#x21e6;</x:InlineHyperlink>
<x:InlineHyperlink ui:field='up' title='Up to change (Shortcut: u)'>
<x:InlineHyperlink ui:field='prev' styleName='{res.style.go_prev}'/>
<x:InlineHyperlink ui:field='up'
styleName='{res.style.go_up}'
title='Up to change (Shortcut: u)'>
<ui:attribute name='title'/>
&#x21e7;
</x:InlineHyperlink>
<x:InlineHyperlink ui:field='next'>&#x21e8;</x:InlineHyperlink>
<x:InlineHyperlink ui:field='next' styleName='{res.style.go_next}'/>
<g:Image ui:field='preferences'
resource='{res.gear}'
title='Diff preferences (Shortcut: ,)'>
<ui:attribute name='title'/>
</g:Image>
</div>
</g:HTMLPanel>
</ui:UiBinder>