Mercurial > libervia-web
comparison public/libervia.css @ 106:edce682df120
browser side: CSS: black & red tabs + dialogs fixes
author | Adrien Vigneron <adrienvigneron@mailoo.org> |
---|---|
date | Wed, 29 Jun 2011 01:32:45 +0200 |
parents | d870258b5e79 |
children | c3fb3292f582 |
comparison
equal
deleted
inserted
replaced
105:d870258b5e79 | 106:edce682df120 |
---|---|
283 border-radius: 7px 7px 0 0; | 283 border-radius: 7px 7px 0 0; |
284 -webkit-border-radius: 7px 7px 0 0; | 284 -webkit-border-radius: 7px 7px 0 0; |
285 -moz-border-radius: 7px 7px 0 0; | 285 -moz-border-radius: 7px 7px 0 0; |
286 } | 286 } |
287 | 287 |
288 /* button, listbox, textbox */ | 288 /*DIALOG: button, listbox, textbox, label */ |
289 | 289 |
290 .gwt-button { | 290 .gwt-DialogBox .gwt-button { |
291 background-color: #ccc; | 291 background-color: #ccc; |
292 border-radius: 5px 5px 5px 5px; | 292 border-radius: 5px 5px 5px 5px; |
293 -webkit-border-radius: 5px 5px 5px 5px; | 293 -webkit-border-radius: 5px 5px 5px 5px; |
294 -moz-border-radius: 5px 5px 5px 5px; | 294 -moz-border-radius: 5px 5px 5px 5px; |
295 box-shadow: 0px 1px 4px #000; | 295 box-shadow: 0px 1px 4px #000; |
296 -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.6); | 296 -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.6); |
297 -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.6); | 297 -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.6); |
298 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#fff͸, endColorstr=’#ccc’); | 298 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#444͸, endColorstr=’#222’); |
299 background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); | 299 background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#222)); |
300 background: -moz-linear-gradient(top, #fff, #ccc); | 300 background: -moz-linear-gradient(top, #444, #222); |
301 background-image: -o-linear-gradient(#fff,#ccc); | 301 background-image: -o-linear-gradient(#444,#222); |
302 text-shadow: 0 -1px 1px rgba(255,255,255,0.25); | 302 text-shadow: 1px 1px 1px rgba(0,0,0,0.2); |
303 padding: 3px 5px 3px 5px; | 303 padding: 3px 5px 3px 5px; |
304 margin: 10px 5px 5px 5px; | 304 margin: 10px 5px 10px 5px; |
305 color: #222; | 305 color: #fff; |
306 font-weight: bold; | 306 font-weight: bold; |
307 font: normal 1em/1.4em Arial, Helvetica, sans-serif; | 307 font: normal 1em/1.4em Arial, Helvetica, sans-serif; |
308 border: none; | 308 border: none; |
309 } | 309 } |
310 | 310 |
311 .gwt-button:hover { | 311 .gwt-DialogBox .gwt-button:hover { |
312 background-color: #cf2828; | 312 background-color: #cf2828; |
313 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#cf2828͸, endColorstr=’#b01e1e’); | 313 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#cf2828͸, endColorstr=’#b01e1e’); |
314 background: -webkit-gradient(linear, left top, left bottom, from(#cf2828), to(#b01e1e)); | 314 background: -webkit-gradient(linear, left top, left bottom, from(#cf2828), to(#b01e1e)); |
315 background: -moz-linear-gradient(top, #cf2828, #b01e1e); | 315 background: -moz-linear-gradient(top, #cf2828, #b01e1e); |
316 background-image: -o-linear-gradient(#cf2828,#b01e1e); | 316 background-image: -o-linear-gradient(#cf2828,#b01e1e); |
317 color: #fff; | 317 color: #fff; |
318 text-shadow: 0 -1px 1px rgba(0,0,0,0.25); | 318 text-shadow: 1px 1px 1px rgba(0,0,0,0.25); |
319 } | 319 } |
320 | 320 |
321 .gwt-TextBox, .gwt-ListBox { | 321 .gwt-DialogBox .gwt-TextBox { |
322 background-color: #fff; | 322 background-color: #fff; |
323 border-radius: 5px 5px 5px 5px; | 323 border-radius: 5px 5px 5px 5px; |
324 -webkit-border-radius: 5px 5px 5px 5px; | 324 -webkit-border-radius: 5px 5px 5px 5px; |
325 -moz-border-radius: 5px 5px 5px 5px; | 325 -moz-border-radius: 5px 5px 5px 5px; |
326 box-shadow:inset 0px 1px 4px #000; | 326 box-shadow:inset 0px 1px 4px #000; |
327 -webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.6); | 327 -webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.6); |
328 -moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.6); | 328 -moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.6); |
329 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#ccc͸, endColorstr=’#eee’); | |
330 background: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#eee)); | |
331 background: -moz-linear-gradient(top, #ccc, #eee); | |
332 background-image: -o-linear-gradient(#ccc,#eee); | |
333 text-shadow: 0 -1px 1px rgba(255,255,255,0.25); | |
334 padding: 3px 5px 3px 5px; | 329 padding: 3px 5px 3px 5px; |
330 margin: 10px 5px 10px 5px; | |
335 color: #222; | 331 color: #222; |
336 font-weight: bold; | 332 font-weight: bold; |
337 font: normal 1em/1.4em Arial, Helvetica, sans-serif; | 333 font: normal 1em/1.4em Arial, Helvetica, sans-serif; |
338 border: none; | 334 border: none; |
339 } | 335 } |
340 | 336 |
341 .gwt-ListBox { | 337 .gwt-DialogBox .gwt-ListBox { |
342 overflow: auto; | 338 overflow: auto; |
343 width: 100%; | 339 width: 100%; |
340 background-color: #fff; | |
341 border-radius: 5px 5px 5px 5px; | |
342 -webkit-border-radius: 5px 5px 5px 5px; | |
343 -moz-border-radius: 5px 5px 5px 5px; | |
344 box-shadow:inset 0px 1px 4px #000; | |
345 -webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.6); | |
346 -moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.6); | |
347 padding: 3px 5px 3px 5px; | |
348 margin: 10px 5px 10px 5px; | |
349 color: #222; | |
350 font-weight: bold; | |
351 font: normal 1em/1.4em Arial, Helvetica, sans-serif; | |
352 border: none; | |
353 } | |
354 | |
355 .gwt-DialogBox .gwt-Label { | |
356 margin-top: 13px; | |
344 } | 357 } |
345 | 358 |
346 /* Custom Dialogs */ | 359 /* Custom Dialogs */ |
347 | 360 |
348 .formWarning { /* used when a form is not valid and must be corrected before submission */ | 361 .formWarning { /* used when a form is not valid and must be corrected before submission */ |
768 background-color: #ddd; | 781 background-color: #ddd; |
769 color: #555; | 782 color: #555; |
770 } | 783 } |
771 | 784 |
772 .chat_text_mymess { | 785 .chat_text_mymess { |
773 color: #5e0000; | 786 color: blue; |
774 } | 787 } |
775 | 788 |
776 .occupant { | 789 .occupant { |
777 padding-right: 15px; | 790 padding-right: 15px; |
778 } | 791 } |
865 z-index: 10; | 878 z-index: 10; |
866 bottom: 0; | 879 bottom: 0; |
867 font: normal 0.8em/1.4em Arial, Helvetica, sans-serif; | 880 font: normal 0.8em/1.4em Arial, Helvetica, sans-serif; |
868 font-weight: bold; | 881 font-weight: bold; |
869 text-decoration: none; | 882 text-decoration: none; |
870 height: 32px; | |
871 box-shadow: 0px 1px 4px #000; | |
872 -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.6); | |
873 -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.6); | |
874 border-top: 1px solid #ddd; | |
875 border-bottom: 1px solid #ddd; | |
876 background-color: #222; | |
877 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’444444′, endColorstr=’#222222’); | |
878 background: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#222222)); | |
879 background: -moz-linear-gradient(top, #444444, #222222); | |
880 background-image: -o-linear-gradient(#444444,#222222); | |
881 } | 883 } |
882 | 884 |
883 .gwt-TabBar .gwt-TabBarFirst { | 885 .gwt-TabBar .gwt-TabBarFirst { |
884 height: 100%; | 886 height: 100%; |
885 } | 887 } |
887 .gwt-TabBar .gwt-TabBarRest { | 889 .gwt-TabBar .gwt-TabBarRest { |
888 } | 890 } |
889 | 891 |
890 .mainTabPanel .gwt-TabBar .gwt-TabBarItem { | 892 .mainTabPanel .gwt-TabBar .gwt-TabBarItem { |
891 cursor: pointer; | 893 cursor: pointer; |
894 margin-left: 20px; | |
895 | |
896 } | |
897 | |
898 .mainTabPanel .gwt-TabBarItem div { | |
899 color: #fff; | |
900 } | |
901 | |
902 .mainTabPanel .gwt-TabBarItem { | |
903 color: #444 !important; | |
904 background-color: #222; | |
905 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#444′, endColorstr=’#222’); | |
906 background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#222)); | |
907 background: -moz-linear-gradient(top, #444, #222); | |
908 background-image: -o-linear-gradient(#444,#222); | |
909 box-shadow: 0px 1px 4px #000; | |
910 -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); | |
911 -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); | |
892 padding: 3px 15px 3px 15px; | 912 padding: 3px 15px 3px 15px; |
893 margin-left: 10px; | |
894 } | |
895 | |
896 .mainTabPanel .gwt-TabBarItem div { | |
897 color: #e7e5e5; | |
898 } | |
899 | |
900 .mainTabPanel .gwt-TabBarItem-selected *, .mainTabPanel div.gwt-TabBarItem:hover *{ | |
901 color: #444 !important; | |
902 background-color: #fff; | |
903 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#fff′, endColorstr=’#ccc’); | |
904 background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); | |
905 background: -moz-linear-gradient(top, #fff, #ccc); | |
906 background-image: -o-linear-gradient(#fff,#ccc); | |
907 box-shadow: 0px 1px 4px #000; | |
908 -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.6); | |
909 -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.6); | |
910 padding: 3px 15px; | |
911 border-top: 1px solid #fff; | |
912 border-radius: 1em 1em 1em 1em; | 913 border-radius: 1em 1em 1em 1em; |
913 -webkit-border-radius: 1em 1em 1em 1em; | 914 -webkit-border-radius: 1em 1em 1em 1em; |
914 -moz-border-radius: 1em 1em 0 0; | 915 -moz-border-radius: 1em 1em 0 0; |
915 text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6); | 916 text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2); |
917 } | |
918 | |
919 .mainTabPanel .gwt-TabBarItem-selected { | |
920 color: #fff; | |
921 background-color: #cf2828; | |
922 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#cf2828′, endColorstr=’#b01e1e’); | |
923 background: -webkit-gradient(linear, left top, left bottom, from(#cf2828), to(#b01e1e)); | |
924 background: -moz-linear-gradient(top, #cf2828, #b01e1e); | |
925 background-image: -o-linear-gradient(#cf2828,#b01e1e); | |
926 box-shadow: 0px 1px 4px #000; | |
927 -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); | |
928 -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); | |
929 padding: 3px 15px 3px 15px; | |
930 border-radius: 1em 1em 1em 1em; | |
931 -webkit-border-radius: 1em 1em 1em 1em; | |
932 -moz-border-radius: 1em 1em 0 0; | |
933 text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2); | |
916 } | 934 } |
917 | 935 |
918 .mainTabPanel div.gwt-TabBarItem:hover { | 936 .mainTabPanel div.gwt-TabBarItem:hover { |
937 color: #fff; | |
938 background-color: #cf2828; | |
939 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#cf2828′, endColorstr=’#b01e1e’); | |
940 background: -webkit-gradient(linear, left top, left bottom, from(#cf2828), to(#b01e1e)); | |
941 background: -moz-linear-gradient(top, #cf2828, #b01e1e); | |
942 background-image: -o-linear-gradient(#cf2828,#b01e1e); | |
943 box-shadow: 0px 1px 4px #000; | |
944 -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); | |
945 -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); | |
946 padding: 3px 15px 3px 15px; | |
947 border-radius: 1em 1em 1em 1em; | |
948 -webkit-border-radius: 1em 1em 1em 1em; | |
949 -moz-border-radius: 1em 1em 0 0; | |
950 text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2); | |
919 } | 951 } |
920 | 952 |
921 .mainTabPanel .gwt-TabBar .gwt-TabBarItem-selected { | 953 .mainTabPanel .gwt-TabBar .gwt-TabBarItem-selected { |
922 cursor: default; | 954 cursor: default; |
923 } | 955 } |