]> git.wh0rd.org - tt-rss.git/blame - lib/dijit/themes/claro/Toolbar.css
git.wh0rd.org / tt-rss.git / blame
? search:
summary | shortlog | log | commit | commitdiff | tree
blob | blame (incremental) | history | HEAD
upgrade dojo to 1.8.3 (refs #570)
[tt-rss.git] / lib / dijit / themes / claro / Toolbar.css
CommitLineData
81bea17a
AD		 1/* Toolbar
2 *
3 * Styling Toolbar means styling the toolbar container and the widget inside toolbar (dijitToolbar)
4 *
5 * 1. toolbar (default styling):
6 * .dijitToolbar - styles for outer container
7 *
8 * 2. widget inside toolbar
9 * .dijitToolbar .dijitButtonNode - Button widget
10 * .dijitComboButton - ComboButton widget
11 * .dijitDropDownButton - DropDownButton widget
12 * .dijitToggleButton - ToggleButton widget
13 *
14 * 3. hovered widget inside toolbar (ie, mouse hover on the widget inside)
15 * .dijitToolbar .dijitButtonNodeHover - styles for hovered Button widget
16 *
17 * 4. actived widget inside toolbar (ie, mouse down on the widget inside)
18 * .dijitToolbar .dijitButtonNodeActive - mouse down on Button widget
19 */
2f01fe57 20.claro .dijitToolbar {
81bea17a
AD		 21 border-bottom: 1px solid #b5bcc7;
22 background-color: #efefef;
f0cfe83e 23 background-image: url("images/standardGradient.png");
81bea17a 24 background-repeat: repeat-x;
f0cfe83e
AD		 25 background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
26 background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
27 background-image: -o-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
28 background-image: linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
29 _background-image: none;
81bea17a
AD		 30 padding: 2px 0 2px 4px;
31 zoom: 1;
2f01fe57
AD		 32}
33.claro .dijitToolbar label {
81bea17a 34 padding: 0 3px 0 6px;
2f01fe57 35}
1354d172
AD		 36/** override claro/form/Button.css, and also ComboBox down arrow **/
37.claro .dijitToolbar .dijitButton .dijitButtonNode,
38.claro .dijitToolbar .dijitDropDownButton .dijitButtonNode,
39.claro .dijitToolbar .dijitComboButton .dijitButtonNode,
40.claro .dijitToolbar .dijitToggleButton .dijitButtonNode,
41.claro .dijitToolbar .dijitComboBox .dijitButtonNode {
81bea17a
AD		 42 border-width: 0;
43 /* on hover/active, border-->1px, padding-->1px */
44
45 padding: 2px;
46 -moz-border-radius: 2px;
47 border-radius: 2px;
48 -webkit-box-shadow: none;
49 -moz-box-shadow: none;
50 box-shadow: none;
51 -webkit-transition-property: background-color;
52 -moz-transition-property: background-color;
53 transition-property: background-color;
f0cfe83e
AD		 54 -webkit-transition-duration: 0.3s;
55 -moz-transition-duration: 0.3s;
56 transition-duration: 0.3s;
81bea17a 57 background-color: rgba(171, 214, 255, 0);
f0cfe83e
AD		 58 background-image: none;
59 /* cancel gradient for normal buttons, we don't want any gradient besides toolbar's on non-hovered buttons */
60
2f01fe57 61}
1354d172
AD		 62.dj_ie .claro .dijitToolbar .dijitButton .dijitButtonNode,
63.dj_ie .claro .dijitToolbar .dijitDropDownButton .dijitButtonNode,
64.dj_ie .claro .dijitToolbar .dijitComboButton .dijitButtonNode,
65.dj_ie .claro .dijitToolbar .dijitToggleButton .dijitButtonNode,
66.dj_ie .claro .dijitToolbar .dijitComboBox .dijitButtonNode {
81bea17a
AD		 67 background-color: transparent;
68 /* for IE, which doesn't understand rgba(...) */
69
2f01fe57 70}
1354d172
AD		 71/* hover status */
72.dj_ie .claro .dijitToolbar .dijitButtonHover .dijitButtonNode,
73.dj_ie .claro .dijitToolbar .dijitDropDownButtonHover .dijitButtonNode,
74.dj_ie .claro .dijitToolbar .dijitComboButton .dijitButtonNodeHover,
75.dj_ie .claro .dijitToolbar .dijitComboButton .dijitDownArrowButtonHover,
76.dj_ie .claro .dijitToolbar .dijitToggleButtonHover .dijitButtonNode {
77 /* button should still turn blue on hover, so need to override .dj_ie rules above */
78
79 background-color: #abd6ff;
80}
81/* active status */
82.dj_ie .claro .dijitToolbar .dijitButtonActive .dijitButtonNode,
83.dj_ie .claro .dijitToolbar .dijitDropDownButtonActive .dijitButtonNode,
84.dj_ie .claro .dijitToolbar .dijitComboButtonActive .dijitButtonNode,
85.dj_ie .claro .dijitToolbar .dijitToggleButtonActive .dijitButtonNode {
86 /* button should still turn blue on press, so need to override .dj_ie rules above */
87
88 background-color: #abd6ff;
89}
81bea17a
AD		 90.claro .dijitToolbar .dijitComboButton .dijitStretch {
91 /* no rounded border on side adjacent to arrow */
92
93 -moz-border-radius: 2px 0 0 2px;
94 border-radius: 2px 0 0 2px;
2f01fe57 95}
81bea17a
AD		 96.claro .dijitToolbar .dijitComboButton .dijitArrowButton {
97 /* no rounded border on side adjacent to button */
98
99 -moz-border-radius: 0 2px 2px 0;
100 border-radius: 0 2px 2px 0;
101}
102.claro .dijitToolbar .dijitComboBox .dijitButtonNode {
103 padding: 0;
2f01fe57 104}
81bea17a 105/* hover status */
2f01fe57
AD		 106.claro .dijitToolbar .dijitButtonHover .dijitButtonNode,
107.claro .dijitToolbar .dijitDropDownButtonHover .dijitButtonNode,
81bea17a
AD		 108.claro .dijitToolbar .dijitToggleButtonHover .dijitButtonNode,
109.claro .dijitToolbar .dijitComboButtonHover .dijitButtonNode {
81bea17a
AD		 110 border-width: 1px;
111 background-color: #abd6ff;
f0cfe83e
AD		 112 background-image: url("images/standardGradient.png");
113 background-repeat: repeat-x;
114 background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
115 background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
116 background-image: -o-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
117 background-image: linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
118 _background-image: none;
81bea17a
AD		 119 padding: 1px;
120}
121.claro .dijitToolbar .dijitComboButtonHover .dijitButtonNode, .claro .dijitToolbar .dijitComboButtonHover .dijitDownArrowButton {
1354d172 122 background-color: #f3ffff;
81bea17a
AD		 123}
124.claro .dijitToolbar .dijitComboButtonHover .dijitButtonNodeHover, .claro .dijitToolbar .dijitComboButtonHover .dijitDownArrowButtonHover {
125 background-color: #abd6ff;
126}
127/* active status */
128.claro .dijitToolbar .dijitButtonActive .dijitButtonNode, .claro .dijitToolbar .dijitDropDownButtonActive .dijitButtonNode, .claro .dijitToolbar .dijitToggleButtonActive .dijitButtonNode {
129 border-width: 1px;
1354d172 130 background-color: #7dbdfa;
f0cfe83e
AD		 131 background-image: url("images/activeGradient.png");
132 background-repeat: repeat-x;
133 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%);
134 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%);
135 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%);
136 background-image: linear-gradient(rgba(190, 190, 190, 0.98) 0px, rgba(255, 255, 255, 0.65) 3px, rgba(255, 255, 255, 0) 100%);
137 _background-image: none;
81bea17a 138 padding: 1px;
2f01fe57
AD		 139}
140.claro .dijitToolbar .dijitComboButtonActive {
81bea17a
AD		 141 -webkit-transition-duration: 0.2s;
142 -moz-transition-duration: 0.2s;
143 transition-duration: 0.2s;
144 border-width: 1px;
145 padding: 0;
2f01fe57 146}
81bea17a 147.claro .dijitToolbar .dijitComboButtonActive .dijitButtonNode, .claro .dijitToolbar .dijitComboButtonActive .dijitDownArrowButton {
1354d172 148 background-color: #f3ffff;
81bea17a 149 padding: 2px;
2f01fe57 150}
81bea17a 151.claro .dijitToolbar .dijitComboButtonActive .dijitButtonNodeActive {
1354d172 152 background-color: #7dbdfa;
f0cfe83e
AD		 153 background-image: url("images/activeGradient.png");
154 background-repeat: repeat-x;
155 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%);
156 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%);
157 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%);
158 background-image: linear-gradient(rgba(190, 190, 190, 0.98) 0px, rgba(255, 255, 255, 0.65) 3px, rgba(255, 255, 255, 0) 100%);
159 _background-image: none;
2f01fe57 160}
81bea17a 161.claro .dijitToolbar .dijitComboButtonActive .dijitDownArrowButtonActive {
1354d172 162 background-color: #7dbdfa;
f0cfe83e
AD		 163 background-image: url("images/activeGradient.png");
164 background-repeat: repeat-x;
165 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%);
166 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%);
167 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%);
168 background-image: linear-gradient(rgba(190, 190, 190, 0.98) 0px, rgba(255, 255, 255, 0.65) 3px, rgba(255, 255, 255, 0) 100%);
169 _background-image: none;
2f01fe57 170}
81bea17a
AD		 171/* Avoid double border between button and arrow */
172.claro .dijitToolbar .dijitComboButtonHover .dijitDownArrowButton, .claro .dijitToolbar .dijitComboButtonActive .dijitDownArrowButton {
173 border-left-width: 0;
2f01fe57 174}
81bea17a
AD		 175.claro .dijitToolbar .dijitComboButtonHover .dijitDownArrowButton {
176 padding-left: 2px;
177 /* since there's no left border, don't reduce from 2px --> 1px */
178
2f01fe57 179}
81bea17a 180/* toggle button checked status */
2f01fe57 181.claro .dijitToolbar .dijitToggleButtonChecked .dijitButtonNode {
81bea17a
AD		 182 margin: 0;
183 /* remove margin and add a border */
184
185 border-width: 1px;
186 border-style: solid;
187 background-image: none;
1354d172 188 border-color: #759dc0;
81bea17a
AD		 189 background-color: #ffffff;
190 padding: 1px;
2f01fe57 191}
2f01fe57 192.claro .dijitToolbarSeparator {
81bea17a
AD		 193 /* separator icon in the editor sprite */
194
1354d172 195 background: url("../../icons/images/editorIconsEnabled.png");
2f01fe57 196}
81bea17a 197/* Toolbar inside of disabled Editor */
2f01fe57 198.claro .dijitDisabled .dijitToolbar {
81bea17a
AD		 199 background: none;
200 background-color: #efefef;
201 border-bottom: 1px solid #d3d3d3;
202}
203.claro .dijitToolbar .dijitComboBoxDisabled .dijitArrowButtonInner {
204 background-position: 0 50%;
2f01fe57 205}
web-based news feed (RSS/Atom) reader and aggregator; see https://tt-rss.org/