comparison src/browser/public/libervia.css @ 654:40c72f3b7638 frontends_multi_profiles

browser_side: MainPanel is now based on a DockPanel, which allows to use less tables and also to remove some "window resized" listeners
author souliane <souliane@mailoo.org>
date Fri, 27 Feb 2015 02:39:43 +0100
parents c22b47d63fe2
children 4dbd99de3aaa
comparison
equal deleted inserted replaced
653:e1d067378ad3 654:40c72f3b7638
135 } 135 }
136 136
137 .header { 137 .header {
138 background-color: #eee; 138 background-color: #eee;
139 border-bottom: 1px solid #ddd; 139 border-bottom: 1px solid #ddd;
140 } 140 width: 100%;
141 141 height: 64px;
142 .menuContainer { 142 }
143 margin: 0 32px 0 20px; 143
144 .mainPanel {
145 width: 100%;
146 height: 100%;
144 } 147 }
145 148
146 .mainMenuBar { 149 .mainMenuBar {
147 background-color: #222; 150 background-color: #222;
148 background: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#222222)); 151 background: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#222222));
149 background: -webkit-linear-gradient(top, #444444, #222222); 152 background: -webkit-linear-gradient(top, #444444, #222222);
150 background: linear-gradient(to bottom, #444444, #222222); 153 background: linear-gradient(to bottom, #444444, #222222);
151 width: 100%;
152 height: 28px; 154 height: 28px;
153 padding: 5px 5px 0 5px; 155 padding: 5px 5px 0 5px;
154 border: 1px solid #ddd; 156 border: 1px solid #ddd;
155 border-radius: 0 0 1em 1em; 157 border-radius: 0 0 1em 1em;
156 line-height: 100%; 158 line-height: 100%;
157 -webkit-box-shadow: 0px 1px 4px #000; 159 -webkit-box-shadow: 0px 1px 4px #000;
158 box-shadow: 0px 1px 4px #000; 160 box-shadow: 0px 1px 4px #000;
159 display: inline-block; 161 display: inline-block;
162 position: absolute;
163 left: 20px;
164 right: 20px;
165 width: auto;
160 } 166 }
161 167
162 .mainMenuBar .gwt-MenuItem { 168 .mainMenuBar .gwt-MenuItem {
163 padding: 3px 15px; 169 padding: 3px 15px;
164 text-decoration: none; 170 text-decoration: none;
420 } 426 }
421 /* Contact List */ 427 /* Contact List */
422 428
423 div.contactList { 429 div.contactList {
424 width: 100%; 430 width: 100%;
425 /* We want the contact panel to not use all the available height when displayed 431 margin-top: 9px;
426 in the unibox panel (grey part), because the dialogs panels (white part) should
427 still be visible. The setting max-height: fit-content would be appropriate here
428 but it doesn't work with firefox 24.0. TODO: check if the current setting works
429 with other browsers... the panel should of course not be displayed on 100px
430 but exactly fit the contacts box.
431 */
432 max-height: 100px;
433 } 432 }
434 433
435 .contactTitle { 434 .contactTitle {
436 color: #cf2828; 435 color: #cf2828;
437 font-size: 1.7em; 436 font-size: 1.7em;
445 /* Button used to switch contacts panel */ 444 /* Button used to switch contacts panel */
446 background: none; 445 background: none;
447 border: 0; 446 border: 0;
448 padding: 0; 447 padding: 0;
449 font-size: large; 448 font-size: large;
449 margin-top: 9px;
450 } 450 }
451 451
452 .groupPanel { 452 .groupPanel {
453 width: 100%; 453 width: 100%;
454 } 454 }
608 .uniBoxButton { 608 .uniBoxButton {
609 width:30px; 609 width:30px;
610 height:45px; 610 height:45px;
611 } 611 }
612 612
613 .statusPanel { 613 .presenceStatusPanel {
614 margin: auto; 614 margin: auto;
615 text-align: center; 615 text-align: center;
616 width: 100%;
617 padding: 5px 0px; 616 padding: 5px 0px;
618 text-shadow: 0 -1px 1px rgba(255,255,255,0.25); 617 text-shadow: 0 -1px 1px rgba(255,255,255,0.25);
619 font-size: 1.2em; 618 font-size: 1.2em;
620 background-color: #eee; 619 background-color: #eee;
621 font-style: italic; 620 font-style: italic;
1130 background-color: #fff; 1129 background-color: #fff;
1131 } 1130 }
1132 1131
1133 /* Tab panel */ 1132 /* Tab panel */
1134 1133
1135 .liberviaTabPanel {
1136 }
1137
1138 .gwt-TabPanel { 1134 .gwt-TabPanel {
1139 } 1135 }
1140 1136
1141 .gwt-TabPanelBottom { 1137 .gwt-TabPanelBottom {
1142 height: 100%; 1138 height: 100%;
1146 font-weight: bold; 1142 font-weight: bold;
1147 text-decoration: none; 1143 text-decoration: none;
1148 border-bottom: 3px solid #a01c1c; 1144 border-bottom: 3px solid #a01c1c;
1149 } 1145 }
1150 1146
1151 .mainTabPanel .gwt-TabBar {
1152 z-index: 10;
1153 position: fixed;
1154 bottom: 0;
1155 left: 0;
1156 }
1157
1158 .gwt-TabBar .gwt-TabBarFirst { 1147 .gwt-TabBar .gwt-TabBarFirst {
1159 height: 100%; 1148 height: 100%;
1160 } 1149 }
1161 1150
1162 .gwt-TabBar .gwt-TabBarRest { 1151 .gwt-TabBar .gwt-TabBarRest {
1163 } 1152 }
1164 1153
1165 .liberviaTabPanel .gwt-TabBar {; 1154 .mainPanel .gwt-TabBar {
1166 } 1155 z-index: 10;
1167 1156 }
1168 .liberviaTabPanel .gwt-TabBar .gwt-TabBarItem { 1157
1169 cursor: pointer; 1158 .liberviaTabPanel {
1170 margin-right: 5px; 1159 width: 100%;
1160 height: 100%;
1171 } 1161 }
1172 1162
1173 .liberviaTabPanel .gwt-TabBarItem div { 1163 .liberviaTabPanel .gwt-TabBarItem div {
1174 color: #fff; 1164 color: #fff;
1175 } 1165 }
1183 -webkit-box-shadow: 0px 1px 4px #000; 1173 -webkit-box-shadow: 0px 1px 4px #000;
1184 box-shadow: 0px 1px 4px #000; 1174 box-shadow: 0px 1px 4px #000;
1185 padding: 4px 15px 4px 15px; 1175 padding: 4px 15px 4px 15px;
1186 border-radius: 1em 1em 0 0; 1176 border-radius: 1em 1em 0 0;
1187 text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2); 1177 text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
1178 cursor: pointer;
1179 margin-right: 5px;
1188 } 1180 }
1189 1181
1190 .liberviaTabPanel .gwt-TabBarItem-selected { 1182 .liberviaTabPanel .gwt-TabBarItem-selected {
1191 color: #fff; 1183 color: #fff;
1192 background-color: #cf2828; 1184 background-color: #cf2828;
1196 -webkit-box-shadow: 0px 1px 4px #000; 1188 -webkit-box-shadow: 0px 1px 4px #000;
1197 box-shadow: 0px 1px 4px #000; 1189 box-shadow: 0px 1px 4px #000;
1198 padding: 4px 15px 4px 15px; 1190 padding: 4px 15px 4px 15px;
1199 border-radius: 1em 1em 0 0; 1191 border-radius: 1em 1em 0 0;
1200 text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2); 1192 text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
1193 cursor: default;
1201 } 1194 }
1202 1195
1203 .liberviaTabPanel div.gwt-TabBarItem:hover { 1196 .liberviaTabPanel div.gwt-TabBarItem:hover {
1204 color: #fff; 1197 color: #fff;
1205 background-color: #cf2828; 1198 background-color: #cf2828;
1211 padding: 4px 15px 4px 15px; 1204 padding: 4px 15px 4px 15px;
1212 border-radius: 1em 1em 0 0; 1205 border-radius: 1em 1em 0 0;
1213 text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2); 1206 text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
1214 } 1207 }
1215 1208
1216 .liberviaTabPanel .gwt-TabBar .gwt-TabBarItem-selected {
1217 cursor: default;
1218 }
1219
1220 .globalLeftArea { 1209 .globalLeftArea {
1221 margin-top: 9px; 1210 margin-top: 9px;
1222 } 1211 }
1223 1212
1224 1213