Various small UI enhancements
[gpl/argeo-suite.git] / org.argeo.suite.workbench.rap / theme / argeo-classic / workbench-ext.css
1 /******************************************
2 ** Argeo Suite specific theming **
3 ******************************************/
4
5 /* Extends the default RAP theme. TODO: create a complete homogeneous theme */
6
7 /** Uncomment this for dev only to show all composite borders */
8 /*
9 Composite, .showBorder, Composite.showBorder{
10 border:1px solid fuchsia;
11 }
12
13 Label {
14 border:1px solid blue;
15 }
16 */
17
18 /** DEFAULT STYLE - Override some styling provided by RAP **/
19 * {
20 color: #333333;
21 background-color: white;
22 background-image: none;
23 font: 12px Helvetica, Verdana, "Lucida Sans", Arial, sans-serif;
24 }
25
26 *:disabled {
27 color: #555555;
28 }
29
30 Text, Combo-Field, DateTime-Field {
31 padding: 2px 8px 2px 8px;
32 }
33
34 /* Texts */
35 Text[BORDER], Text[MULTI][BORDER] {
36 box-shadow: inset 0 0 1px #bdbdbd;
37 }
38
39 /* Force show border on text even when disabled */
40 Text.force_border[BORDER]:disabled, Text.force_border[MULTI][BORDER]:disabled
41 {
42 box-shadow: none;
43 border: 1px solid #a4a4a4;
44 }
45
46 /* Text[BORDER]:disabled,
47 Text[MULTI][BORDER]:disabled {
48 box-shadow: none;
49 border: 1px solid white;
50 }
51 */
52
53 /* Shows that focus has been gained */
54 Text[BORDER]:focused, Text[MULTI][BORDER]:focused, Shell.popup_shell {
55 box-shadow: 1px 1px 2px black;
56 border: 1px solid #a4a4a4;
57 }
58
59 Combo {
60 font: 14px Verdana, "Lucida Sans", Arial, Helvetica, sans-serif;
61 padding: 2px 8px 2px 8px;
62 }
63
64 Combo, Combo[BORDER] {
65 box-shadow: inset 0 0 1px #bdbdbd;
66 }
67
68 Combo:focused, Combo[BORDER]:focused, DropDown, Combo-List {
69 box-shadow: 1px 1px 2px black;
70 border: 1px solid #a4a4a4;
71 }
72
73 Widget-ToolTip {
74 animation: fadeIn 250ms ease-in, fadeOut 250ms ease-in;
75 }
76
77 /* Flat image Buttons */
78 Button.flat_btn, Button[PUSH][FLAT].flat_btn, Button.flat_btn:default,
79 Button.flat_btn:disabled, Button.flat_btn:hover, Button.flat_btn:pressed,
80 Button.flat_btn:selected {
81 border: 0px solid white;
82 border-radius: 0px;
83 padding: 0px 0px;
84 background-image: none;
85 background-color: transparent;
86 animation: hoverOut 500ms ease-out;
87 cursor: pointer;
88 }
89
90 /* Links */
91 Link, Link-Hyperlink, Link-Hyperlink:link, Link-Hyperlink:visited,
92 Link-Hyperlink:active {
93 color: #333333;
94 background-color: #ffffff;
95 background-image: none;
96 text-shadow: none;
97 text-decoration: none;
98 }
99
100 Link-Hyperlink:hover {
101 text-decoration: underline;
102 }
103
104 Link-Hyperlink:disabled {
105 color: #959595;
106 }
107
108 /*** Override default links **/
109 a:link {
110 color: #333333;
111 text-decoration: none;
112 }
113
114 a:hover {
115 text-decoration: underline;
116 }
117
118 /** TABLE ITEMS **/
119 /* Fix invisible links on selected and hover table rows */
120 Table-RowOverlay:selected, Table-RowOverlay:linesvisible:even:selected {
121 color: #333333;
122 background-color: #9aaaba;
123 }
124
125 Table-RowOverlay:selected:unfocused, Table-RowOverlay:linesvisible:even:selected:unfocused
126 {
127 color: #333333;
128 background-color: #a3b3c4;
129 }
130
131 /*** FORMS ****/
132 Text.workbench_form_text {
133 box-shadow: inset 0 0 0px #bdbdbd;
134 padding: 2px 8px 2px 8px;
135 border: 0px solid #f4f6f7;
136 }
137
138 Text.workbench_form_text:focused {
139 padding: 2px 8px 2px 8px;
140 border: 2px solid red;
141 box-shadow: inset 0 0 1px #bdbdbd;
142 }
143
144 /****** DOCUMENTS *********/
145
146 /* Breadcrumb ***/
147 Button.breadCrumb_btn {
148 border: 1px solid #f4f6f7;
149 border-radius: 3px;
150 padding: 2px 2px 2px 2px;
151 background-color: transparent;
152 background-repeat: no-repeat;
153 animation: hoverOut 500ms ease-out;
154 cursor: pointer;
155 font-color: #00294b;
156 text-decoration: none;
157 }
158
159 Button.breadCrumb_btn:hover {
160 text-decoration: underline;
161 }
162
163 /* Documents lists context menu */
164 .contextMenu_box {
165 border: 0px solid #fde2d5;
166 padding: 0px;
167 box-shadow: 2px 2px 5px #fde2d5;
168 }
169
170 Button[PUSH][FLAT].createFolder_btn {
171 background-image: url( theme/argeo-classic/icons/fs/addFolder.gif);
172 }
173
174 Button[PUSH][FLAT].shareFolder_btn {
175 background-image: url( theme/argeo-classic/icons/fs/shareFolder.png);
176 }
177
178 Button[PUSH][FLAT].bookmarkFolder_btn {
179 background-image: url( theme/argeo-classic/icons/fs/bookmarkFolder.png);
180 }
181
182 Button[PUSH][FLAT].downloadFolder_btn {
183 background-image: url( theme/argeo-classic/icons/fs/downloadFolder.png);
184 }
185
186 Button[PUSH][FLAT].delete_btn, Button[PUSH][FLAT].deleteBookmark_btn {
187 background-image: url( theme/argeo-classic/icons/fs/delete.png);
188 }
189
190 Button[PUSH][FLAT].rename_btn, Button[PUSH][FLAT].renameBookmark_btn {
191 background-image: url( theme/argeo-classic/icons/fs/rename.png);
192 }
193
194 Button[PUSH][FLAT].uploadFiles_btn {
195 background-image: url( theme/argeo-classic/icons/fs/upload.png);
196 }
197
198 Button[PUSH][FLAT].open_btn {
199 background-image: url( theme/argeo-classic/icons/fs/open.png);
200 }
201
202 Button[PUSH][FLAT].createFolder_btn, Button[PUSH][FLAT].shareFolder_btn,
203 Button[PUSH][FLAT].bookmarkFolder_btn, Button[PUSH][FLAT].downloadFolder_btn,
204 Button[PUSH][FLAT].delete_btn, Button[PUSH][FLAT].rename_btn, Button[PUSH][FLAT].uploadFiles_btn,
205 Button[PUSH][FLAT].open_btn, Button[PUSH][FLAT].deleteBookmark_btn,
206 Button[PUSH][FLAT].renameBookmark_btn {
207 border: 0px solid white;
208 border-left: 10px solid transparent;
209 border-radius: 0px;
210 padding: 4px 5px 4px 24px;
211 background-color: transparent;
212 background-repeat: no-repeat;
213 background-position: left;
214 animation: hoverOut 500ms ease-out;
215 cursor: pointer;
216 }
217
218 Button[PUSH][FLAT].createFolder_btn:hover, Button[PUSH][FLAT].shareFolder_btn:hover,
219 Button[PUSH][FLAT].bookmarkFolder_btn:hover, Button[PUSH][FLAT].downloadFolder_btn:hover,
220 Button[PUSH][FLAT].delete_btn:hover, Button[PUSH][FLAT].rename_btn:hover,
221 Button[PUSH][FLAT].uploadFiles_btn:hover, Button[PUSH][FLAT].open_btn:hover,
222 Button[PUSH][FLAT].deleteBookmark_btn:hover, Button[PUSH][FLAT].renameBookmark_btn:hover
223 {
224 background-color: #fef0ea;
225 }
226
227 Button[PUSH][FLAT].createFolder_btn:pressed, Button[PUSH][FLAT].shareFolder_btn:pressed,
228 Button[PUSH][FLAT].bookmarkFolder_btn:pressed, Button[PUSH][FLAT].shareFolder_btn:pressed,
229 Button[PUSH][FLAT].downloadFolder_btn:pressed, Button[PUSH][FLAT].delete_btn:pressed,
230 Button[PUSH][FLAT].rename_btn:pressed, Button[PUSH][FLAT].uploadFiles_btn:pressed,
231 Button[PUSH][FLAT].open_btn:pressed, Button[PUSH][FLAT].deleteBookmark_btn:pressed,
232 Button[PUSH][FLAT].renameBookmark_btn:pressed {
233 background-color: #fde2d5;
234 }
235
236 /** PEOPLE **/
237
238 Button[PUSH][FLAT].markAsDone_btn {
239 background-image: url( theme/argeo-classic/icons/fs/open.png);
240 }
241
242 Button[PUSH][FLAT].cancel_btn {
243 background-image: url( theme/argeo-classic/icons/fs/open.png);
244 }
245
246 Button[PUSH][FLAT].cancel_btn,
247 Button[PUSH][FLAT].markAsDone_btn {
248 border: 0px solid white;
249 border-left: 10px solid transparent;
250 border-radius: 0px;
251 padding: 4px 5px 4px 24px;
252 background-color: transparent;
253 background-repeat: no-repeat;
254 background-position: left;
255 animation: hoverOut 500ms ease-out;
256 cursor: pointer;
257 }
258
259 Button[PUSH][FLAT].cancel_btn:hover,
260 Button[PUSH][FLAT].markAsDone_btn:hover {
261 background-color: #fef0ea;
262 }
263
264 Button[PUSH][FLAT].cancel_btn:pressed,
265 Button[PUSH][FLAT].markAsDone_btn:pressed {
266 background-color: #fde2d5;
267 }
268
269 /** Gadgets **/
270 .people_gadget {
271 border: 1px solid #f3f3f4;
272 border-radius: 0px;
273 padding: 0px 0px;
274 margin: 0px 0px;
275 background-image: none;
276 background-color: transparent;
277 }
278
279 .people_gadget_header {
280 background-color: #f3f3f4;
281 font-color: white;
282 color: white; /*dont work */
283 font: bold 14px Helvetica, Verdana, "Lucida Sans", Arial, sans-serif;
284 }
285
286 /** Header **/
287 .people_entity_header {
288 font: 14px Helvetica, Verdana, "Lucida Sans", Arial, sans-serif;
289 text-decoration: none;
290 }
291
292 /** LOGO */
293 .people_logoBox {
294 background-image: gradient(linear, left top, right top, from(#007a9a),
295 to(#00294a));
296 }
297
298 .people_logo {
299 background-color: transparent;
300 }
301
302 .people_logoTable {
303 background-color: transparent;
304 color: white;
305 font: 12px Helvetica, Verdana, "Lucida Sans", Arial, sans-serif;
306 }
307
308 /** Corresponding links */
309 Link.people_logoTable,
310 Link.people_logoTable:hover,
311 Link.people_logoTable:selected,
312 Link.people_logoTable:selected:unfocused,
313 Link.people_logoTable:linesvisible:even:hover,
314 Link.people_logoTable:linesvisible:even:selected,
315 Link.people_logoTable:linesvisible:even:selected:unfocused {
316 background-color: transparent;
317 color: #ffffff;
318 background-image: none;
319 }