diff options
author | Richard Beales <[email protected]> | 2013-03-18 07:32:01 +0000 |
---|---|---|
committer | Richard Beales <[email protected]> | 2013-03-18 07:32:01 +0000 |
commit | 7c97d17aaf373339a8bcd917ad59ca6018148f0d (patch) | |
tree | 5a3c04f0f9529be392c1263d3feb75806eb43797 /lib/dijit/themes/claro/Toolbar.css | |
parent | 70db7424e7068701e60cc5bcdfe8f858be508179 (diff) | |
parent | c670a80ddd9b03bd4ea6d940a9ed682fd26248d7 (diff) |
Merge remote-tracking branch 'upstream/master'
Diffstat (limited to 'lib/dijit/themes/claro/Toolbar.css')
-rw-r--r-- | lib/dijit/themes/claro/Toolbar.css | 64 |
1 files changed, 40 insertions, 24 deletions
diff --git a/lib/dijit/themes/claro/Toolbar.css b/lib/dijit/themes/claro/Toolbar.css index 18c605c66..da9cc015e 100644 --- a/lib/dijit/themes/claro/Toolbar.css +++ b/lib/dijit/themes/claro/Toolbar.css @@ -20,9 +20,13 @@ .claro .dijitToolbar { border-bottom: 1px solid #b5bcc7; background-color: #efefef; - background-image: url("images/commonHighlight.png"); - background-position: 0 0; + background-image: url("images/standardGradient.png"); background-repeat: repeat-x; + background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%); + background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%); + background-image: -o-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%); + background-image: linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%); + _background-image: none; padding: 2px 0 2px 4px; zoom: 1; } @@ -47,13 +51,13 @@ -webkit-transition-property: background-color; -moz-transition-property: background-color; transition-property: background-color; - -webkit-transition-duration: 0.3s, 0.35s; - -moz-transition-duration: 0.3s, 0.35s; - transition-duration: 0.3s, 0.35s; - background-image: url("images/commonHighlight.png"); - background-position: 0 -30px; - background-repeat: repeat-x; + -webkit-transition-duration: 0.3s; + -moz-transition-duration: 0.3s; + transition-duration: 0.3s; background-color: rgba(171, 214, 255, 0); + background-image: none; + /* cancel gradient for normal buttons, we don't want any gradient besides toolbar's on non-hovered buttons */ + } .dj_ie .claro .dijitToolbar .dijitButton .dijitButtonNode, .dj_ie .claro .dijitToolbar .dijitDropDownButton .dijitButtonNode, @@ -64,15 +68,6 @@ /* for IE, which doesn't understand rgba(...) */ } -.dj_ie6 .claro .dijitToolbar .dijitButton .dijitButtonNode, -.dj_ie6 .claro .dijitToolbar .dijitDropDownButton .dijitButtonNode, -.dj_ie6 .claro .dijitToolbar .dijitComboButton .dijitButtonNode, -.dj_ie6 .claro .dijitToolbar .dijitToggleButton .dijitButtonNode, -.dj_ie6 .claro .dijitToolbar .dijitComboBox .dijitButtonNode { - background: none; - /* because background-color: transparent above doesn't work on IE*/ - -} /* hover status */ .dj_ie .claro .dijitToolbar .dijitButtonHover .dijitButtonNode, .dj_ie .claro .dijitToolbar .dijitDropDownButtonHover .dijitButtonNode, @@ -112,13 +107,18 @@ .claro .dijitToolbar .dijitDropDownButtonHover .dijitButtonNode, .claro .dijitToolbar .dijitToggleButtonHover .dijitButtonNode, .claro .dijitToolbar .dijitComboButtonHover .dijitButtonNode { - background-position: 0 0; border-width: 1px; background-color: #abd6ff; + background-image: url("images/standardGradient.png"); + background-repeat: repeat-x; + background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%); + background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%); + background-image: -o-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%); + background-image: linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%); + _background-image: none; padding: 1px; } .claro .dijitToolbar .dijitComboButtonHover .dijitButtonNode, .claro .dijitToolbar .dijitComboButtonHover .dijitDownArrowButton { - background-position: 0 0; background-color: #f3ffff; } .claro .dijitToolbar .dijitComboButtonHover .dijitButtonNodeHover, .claro .dijitToolbar .dijitComboButtonHover .dijitDownArrowButtonHover { @@ -128,7 +128,13 @@ .claro .dijitToolbar .dijitButtonActive .dijitButtonNode, .claro .dijitToolbar .dijitDropDownButtonActive .dijitButtonNode, .claro .dijitToolbar .dijitToggleButtonActive .dijitButtonNode { border-width: 1px; background-color: #7dbdfa; - background-position: 0 -177px; + background-image: url("images/activeGradient.png"); + background-repeat: repeat-x; + background-image: -moz-linear-gradient(rgba(190, 190, 190, 0.98) 0px, rgba(255, 255, 255, 0.65) 3px, rgba(255, 255, 255, 0) 100%); + background-image: -webkit-linear-gradient(rgba(190, 190, 190, 0.98) 0px, rgba(255, 255, 255, 0.65) 3px, rgba(255, 255, 255, 0) 100%); + background-image: -o-linear-gradient(rgba(190, 190, 190, 0.98) 0px, rgba(255, 255, 255, 0.65) 3px, rgba(255, 255, 255, 0) 100%); + background-image: linear-gradient(rgba(190, 190, 190, 0.98) 0px, rgba(255, 255, 255, 0.65) 3px, rgba(255, 255, 255, 0) 100%); + _background-image: none; padding: 1px; } .claro .dijitToolbar .dijitComboButtonActive { @@ -140,14 +146,27 @@ } .claro .dijitToolbar .dijitComboButtonActive .dijitButtonNode, .claro .dijitToolbar .dijitComboButtonActive .dijitDownArrowButton { background-color: #f3ffff; - background-position: 0 -177px; padding: 2px; } .claro .dijitToolbar .dijitComboButtonActive .dijitButtonNodeActive { background-color: #7dbdfa; + background-image: url("images/activeGradient.png"); + background-repeat: repeat-x; + background-image: -moz-linear-gradient(rgba(190, 190, 190, 0.98) 0px, rgba(255, 255, 255, 0.65) 3px, rgba(255, 255, 255, 0) 100%); + background-image: -webkit-linear-gradient(rgba(190, 190, 190, 0.98) 0px, rgba(255, 255, 255, 0.65) 3px, rgba(255, 255, 255, 0) 100%); + background-image: -o-linear-gradient(rgba(190, 190, 190, 0.98) 0px, rgba(255, 255, 255, 0.65) 3px, rgba(255, 255, 255, 0) 100%); + background-image: linear-gradient(rgba(190, 190, 190, 0.98) 0px, rgba(255, 255, 255, 0.65) 3px, rgba(255, 255, 255, 0) 100%); + _background-image: none; } .claro .dijitToolbar .dijitComboButtonActive .dijitDownArrowButtonActive { background-color: #7dbdfa; + background-image: url("images/activeGradient.png"); + background-repeat: repeat-x; + background-image: -moz-linear-gradient(rgba(190, 190, 190, 0.98) 0px, rgba(255, 255, 255, 0.65) 3px, rgba(255, 255, 255, 0) 100%); + background-image: -webkit-linear-gradient(rgba(190, 190, 190, 0.98) 0px, rgba(255, 255, 255, 0.65) 3px, rgba(255, 255, 255, 0) 100%); + background-image: -o-linear-gradient(rgba(190, 190, 190, 0.98) 0px, rgba(255, 255, 255, 0.65) 3px, rgba(255, 255, 255, 0) 100%); + background-image: linear-gradient(rgba(190, 190, 190, 0.98) 0px, rgba(255, 255, 255, 0.65) 3px, rgba(255, 255, 255, 0) 100%); + _background-image: none; } /* Avoid double border between button and arrow */ .claro .dijitToolbar .dijitComboButtonHover .dijitDownArrowButton, .claro .dijitToolbar .dijitComboButtonActive .dijitDownArrowButton { @@ -170,9 +189,6 @@ background-color: #ffffff; padding: 1px; } -.dj_ie6 .claro .dijitToolbar { - background-image: none; -} .claro .dijitToolbarSeparator { /* separator icon in the editor sprite */ |