Opened 7 years ago

Closed 7 years ago

Last modified 7 years ago

#15860 closed defect (fixed)

gradient for buttons inside toolbar too severe

Reported by: gerhard presser Owned by: gerhard presser
Priority: undecided Milestone: 1.8.1
Component: Dijit - LnF Version: 1.8.0
Keywords: Cc:
Blocked By: Blocking:

Description (last modified by bill)

hi all, nested dijit.form.buttons in dijit.toolbars seem to have a strange background since dojo 1.8:

button gradients in toolbar

regards

Attachments (3)

toolbar_button_gradient.PNG (1.9 KB) - added by gerhard presser 7 years ago.
button gradients in toolbar
1.7.gif (7.1 KB) - added by bill 7 years ago.
test_Toolbar.html 1.7
1.8.gif (7.1 KB) - added by bill 7 years ago.
test_Toolbar.html 1.8

Download all attachments as: .zip

Change History (10)

Changed 7 years ago by gerhard presser

Attachment: toolbar_button_gradient.PNG added

button gradients in toolbar

comment:1 Changed 7 years ago by bill

Component: GeneralDijit - LnF
Description: modified (diff)
Owner: set to bill

Changed 7 years ago by bill

Attachment: 1.7.gif added

test_Toolbar.html 1.7

Changed 7 years ago by bill

Attachment: 1.8.gif added

test_Toolbar.html 1.8

comment:2 Changed 7 years ago by bill

Owner: changed from bill to gerhard presser
Status: newpending

Hmm, it doesn't look strange to me. I compared 1.7:

test_Toolbar.html 1.7

to 1.8:

test_Toolbar.html 1.8

and they seem similar. Can you be more specific? If this is something that only occurs for you, not in our test cases, then as usual you will need to attach a test case using the "attach file" button.

Last edited 7 years ago by bill (previous) (diff)

comment:3 Changed 7 years ago by gerhard presser

Status: pendingnew

it seems that in 1.8 every toolbar-item has it's own gradient.

this behavior is visible best if you look at your (notebook-)monitor from left/right (I'm using ff 14.0.1).

http://download.dojotoolkit.org/release-1.8.0/dojo-release-1.8.0/dijit/tests/test_Toolbar.html

vs.

http://download.dojotoolkit.org/release-1.7.0/dojo-release-1.7.0/dijit/tests/test_Toolbar.html

in dojo 1.7 toolbar-buttons used to have commonHighlight.png as background-image which seems to have a smaller gradient

in dojo 1.8 a browser-gradient is used over the whole toolbar-button which makes it more prominent.

comment:4 Changed 7 years ago by gerhard presser

In 1.7, buttons in toolbars didn't have a gradient by default.

.claro .dijitToolbar .dijitButtonNode {
 ...
 background-position: 0 -30px;
 ...
}

caused the commonHighlight.png gradient to disapear.

in dojo 1.8, something like:

.claro .dijitToolbar .dijitButton .dijitButtonNode, .claro .dijitToolbar .dijitDropDownButton .dijitButtonNode, .claro .dijitToolbar .dijitComboButton .dijitButtonNode, .claro .dijitToolbar .dijitToggleButton .dijitButtonNode, .claro .dijitToolbar .dijitComboBox .dijitButtonNode {
    ...
    background-image: none;
    ...
}

.claro .dijitToolbar .dijitButtonHover .dijitButtonNode, .claro .dijitToolbar .dijitDropDownButtonHover .dijitButtonNode, .claro .dijitToolbar .dijitComboButtonHover .dijitButtonNode, .claro .dijitToolbar .dijitToggleButtonHover .dijitButtonNode, .claro .dijitToolbar .dijitComboBoxHover .dijitButtonNode {
    ....
    background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
    ...
}

should do the trick.

comment:5 Changed 7 years ago by bill

Milestone: tbd1.8.1
Summary: gradient for buttons inside toolbargradient for buttons inside toolbar too severe

Ah, that makes sense, thanks, I'll do that

comment:6 Changed 7 years ago by bill

Resolution: fixed
Status: newclosed

In [29528]:

Remove gradient of buttons in Toolbars; they should only have a gradient on hover/active state. Fixes #15860 on trunk.

comment:7 Changed 7 years ago by bill

In [29529]:

Remove gradient of buttons in Toolbars; they should only have a gradient on hover/active state. Fixes #15860 on 1.8 branch.

Note: See TracTickets for help on using tickets.