Mercurial > libervia-web
diff 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 |
line wrap: on
line diff
--- a/public/libervia.css Wed Jun 29 00:18:00 2011 +0200 +++ b/public/libervia.css Wed Jun 29 01:32:45 2011 +0200 @@ -285,9 +285,9 @@ -moz-border-radius: 7px 7px 0 0; } -/* button, listbox, textbox */ +/*DIALOG: button, listbox, textbox, label */ -.gwt-button { +.gwt-DialogBox .gwt-button { background-color: #ccc; border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px; @@ -295,30 +295,30 @@ box-shadow: 0px 1px 4px #000; -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.6); -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.6); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#fff͸, endColorstr=’#ccc’); - background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); - background: -moz-linear-gradient(top, #fff, #ccc); - background-image: -o-linear-gradient(#fff,#ccc); - text-shadow: 0 -1px 1px rgba(255,255,255,0.25); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#444͸, endColorstr=’#222’); + background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#222)); + background: -moz-linear-gradient(top, #444, #222); + background-image: -o-linear-gradient(#444,#222); + text-shadow: 1px 1px 1px rgba(0,0,0,0.2); padding: 3px 5px 3px 5px; - margin: 10px 5px 5px 5px; - color: #222; + margin: 10px 5px 10px 5px; + color: #fff; font-weight: bold; font: normal 1em/1.4em Arial, Helvetica, sans-serif; border: none; } -.gwt-button:hover { +.gwt-DialogBox .gwt-button:hover { background-color: #cf2828; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#cf2828͸, endColorstr=’#b01e1e’); background: -webkit-gradient(linear, left top, left bottom, from(#cf2828), to(#b01e1e)); background: -moz-linear-gradient(top, #cf2828, #b01e1e); background-image: -o-linear-gradient(#cf2828,#b01e1e); color: #fff; - text-shadow: 0 -1px 1px rgba(0,0,0,0.25); + text-shadow: 1px 1px 1px rgba(0,0,0,0.25); } -.gwt-TextBox, .gwt-ListBox { +.gwt-DialogBox .gwt-TextBox { background-color: #fff; border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px; @@ -326,21 +326,34 @@ box-shadow:inset 0px 1px 4px #000; -webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.6); -moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.6); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#ccc͸, endColorstr=’#eee’); - background: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#eee)); - background: -moz-linear-gradient(top, #ccc, #eee); - background-image: -o-linear-gradient(#ccc,#eee); - text-shadow: 0 -1px 1px rgba(255,255,255,0.25); padding: 3px 5px 3px 5px; + margin: 10px 5px 10px 5px; color: #222; font-weight: bold; font: normal 1em/1.4em Arial, Helvetica, sans-serif; border: none; } -.gwt-ListBox { +.gwt-DialogBox .gwt-ListBox { overflow: auto; width: 100%; + background-color: #fff; + border-radius: 5px 5px 5px 5px; + -webkit-border-radius: 5px 5px 5px 5px; + -moz-border-radius: 5px 5px 5px 5px; + box-shadow:inset 0px 1px 4px #000; + -webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.6); + -moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.6); + padding: 3px 5px 3px 5px; + margin: 10px 5px 10px 5px; + color: #222; + font-weight: bold; + font: normal 1em/1.4em Arial, Helvetica, sans-serif; + border: none; +} + +.gwt-DialogBox .gwt-Label { + margin-top: 13px; } /* Custom Dialogs */ @@ -770,7 +783,7 @@ } .chat_text_mymess { - color: #5e0000; + color: blue; } .occupant { @@ -867,17 +880,6 @@ font: normal 0.8em/1.4em Arial, Helvetica, sans-serif; font-weight: bold; text-decoration: none; - height: 32px; - box-shadow: 0px 1px 4px #000; - -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.6); - border-top: 1px solid #ddd; - border-bottom: 1px solid #ddd; - background-color: #222; - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’444444′, endColorstr=’#222222’); - background: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#222222)); - background: -moz-linear-gradient(top, #444444, #222222); - background-image: -o-linear-gradient(#444444,#222222); } .gwt-TabBar .gwt-TabBarFirst { @@ -889,33 +891,63 @@ .mainTabPanel .gwt-TabBar .gwt-TabBarItem { cursor: pointer; - padding: 3px 15px 3px 15px; - margin-left: 10px; + margin-left: 20px; + } .mainTabPanel .gwt-TabBarItem div { - color: #e7e5e5; + color: #fff; } -.mainTabPanel .gwt-TabBarItem-selected *, .mainTabPanel div.gwt-TabBarItem:hover *{ +.mainTabPanel .gwt-TabBarItem { color: #444 !important; - background-color: #fff; - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#fff′, endColorstr=’#ccc’); - background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); - background: -moz-linear-gradient(top, #fff, #ccc); - background-image: -o-linear-gradient(#fff,#ccc); + background-color: #222; + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#444′, endColorstr=’#222’); + background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#222)); + background: -moz-linear-gradient(top, #444, #222); + background-image: -o-linear-gradient(#444,#222); box-shadow: 0px 1px 4px #000; - -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.6); - padding: 3px 15px; - border-top: 1px solid #fff; + -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); + -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); + padding: 3px 15px 3px 15px; border-radius: 1em 1em 1em 1em; -webkit-border-radius: 1em 1em 1em 1em; -moz-border-radius: 1em 1em 0 0; - text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6); + text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2); +} + +.mainTabPanel .gwt-TabBarItem-selected { + color: #fff; + background-color: #cf2828; + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#cf2828′, endColorstr=’#b01e1e’); + background: -webkit-gradient(linear, left top, left bottom, from(#cf2828), to(#b01e1e)); + background: -moz-linear-gradient(top, #cf2828, #b01e1e); + background-image: -o-linear-gradient(#cf2828,#b01e1e); + box-shadow: 0px 1px 4px #000; + -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); + -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); + padding: 3px 15px 3px 15px; + border-radius: 1em 1em 1em 1em; + -webkit-border-radius: 1em 1em 1em 1em; + -moz-border-radius: 1em 1em 0 0; + text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2); } .mainTabPanel div.gwt-TabBarItem:hover { + color: #fff; + background-color: #cf2828; + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#cf2828′, endColorstr=’#b01e1e’); + background: -webkit-gradient(linear, left top, left bottom, from(#cf2828), to(#b01e1e)); + background: -moz-linear-gradient(top, #cf2828, #b01e1e); + background-image: -o-linear-gradient(#cf2828,#b01e1e); + box-shadow: 0px 1px 4px #000; + -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); + -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); + padding: 3px 15px 3px 15px; + border-radius: 1em 1em 1em 1em; + -webkit-border-radius: 1em 1em 1em 1em; + -moz-border-radius: 1em 1em 0 0; + text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2); } .mainTabPanel .gwt-TabBar .gwt-TabBarItem-selected {