CSS changes needed for application tabs to shrink when there's too many of them

This commit is contained in:
Nathan Gray 2014-03-25 14:13:50 +00:00
parent f13fa742d8
commit ca5c07c250
3 changed files with 22 additions and 15 deletions

View File

@ -4989,9 +4989,7 @@ table.nextmatch_header img {
height: 16px; height: 16px;
} }
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header { #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header {
text-align: center;
padding-left: 0; padding-left: 0;
padding-right: 0;
position: relative; position: relative;
-webkit-border-top-right-radius: 5px; -webkit-border-top-right-radius: 5px;
-webkit-border-bottom-right-radius: 0; -webkit-border-bottom-right-radius: 0;
@ -5007,9 +5005,12 @@ table.nextmatch_header img {
border-top-left-radius: 5px; border-top-left-radius: 5px;
/*.background-clip(padding-box);*/ /*.background-clip(padding-box);*/
background: transparent; background: transparent;
display: inline-table; display: inline-block;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
margin: 0px 5px 0px 0px; margin: 0px 5px 0px 0px;
padding: 2px 2px 7px 2px; padding: 2px 5px 7px 2px;
cursor: pointer; cursor: pointer;
border-width: 1px 1px 0 1px; border-width: 1px 1px 0 1px;
border-style: solid; border-style: solid;
@ -5025,7 +5026,7 @@ table.nextmatch_header img {
/*font-size: 100%;*/ /*font-size: 100%;*/
font-size: 11px; font-size: 11px;
line-height: 1em; line-height: 1em;
margin: 0 1px 2px 2px; margin: 0 15px 2px 2px;
vertical-align: super; vertical-align: super;
} }
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header img.egw_fw_ui_tab_icon { #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header img.egw_fw_ui_tab_icon {
@ -5098,7 +5099,7 @@ table.nextmatch_header img {
background-color: #b4b4b4; background-color: #b4b4b4;
} }
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tab_close_button { #egw_fw_main #egw_fw_tabs .egw_fw_ui_tab_close_button {
right: 1px; right: 3px;
top: 1px; top: 1px;
display: inline-block; display: inline-block;
width: 12px; width: 12px;
@ -5108,7 +5109,7 @@ table.nextmatch_header img {
background-position: center; background-position: center;
background-image: url(../images/close_button.png); background-image: url(../images/close_button.png);
background-size: 10px 10px; background-size: 10px 10px;
float: right; position: absolute;
} }
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tab_close_button :hover { #egw_fw_main #egw_fw_tabs .egw_fw_ui_tab_close_button :hover {
background-image: url(../images/close_button_hover.png); background-image: url(../images/close_button_hover.png);

View File

@ -50,7 +50,8 @@ function hide_pixelegg_header(_toggle, _delay)
// Form - Country Switch // Form - Country Switch
$j("#egw_fw_topmenu_info_items form").css("display", "none"); $j("#egw_fw_topmenu_info_items form").css("display", "none");
$j(".egw_fw_ui_tabs_header").css("height", "34px"); $j(".egw_fw_ui_tabs_header").css("height", "34px")
.css("padding", "1px 75px 0px 20px");
//Tab //Tab
@ -110,10 +111,14 @@ egw_LAB.wait(function() {
$j('#slidetoggle').click(function(){ $j('#slidetoggle').click(function(){
if ($j('#egw_fw_header').css('display') === 'none') { if ($j('#egw_fw_header').css('display') === 'none') {
show_pixelegg_header(this, 1000); show_pixelegg_header(this, 1000);
// Check for too many tabs, and adjust width if needed
window.setTimeout(function() {egw_getFramework().checkTabOverflow();},1000);
egw.set_preference('common', 'pixelegg_header_hidden', ''); egw.set_preference('common', 'pixelegg_header_hidden', '');
} }
else { else {
hide_pixelegg_header(this, 1000); hide_pixelegg_header(this, 1000);
// Check for too many tabs, and adjust width if needed
window.setTimeout(function() {egw_getFramework().checkTabOverflow();},1000);
egw.set_preference('common', 'pixelegg_header_hidden', 'true'); egw.set_preference('common', 'pixelegg_header_hidden', 'true');
} }
}); });

View File

@ -1241,15 +1241,16 @@
// inaktive // inaktive
.egw_fw_ui_tab_header { .egw_fw_ui_tab_header {
text-align: center;
padding-left: 0; padding-left: 0;
padding-right: 0;
position: relative; position: relative;
.border_radius(5px,0, 0, 5px); .border_radius(5px,0, 0, 5px);
background: transparent; background: transparent;
display: inline-table; display: inline-block;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
margin: 0px 5px 0px 0px; margin: 0px 5px 0px 0px;
padding: 2px 2px 7px 2px; padding: 2px 5px 7px 2px;
cursor: pointer; cursor: pointer;
border-width: 1px 1px 0 1px; border-width: 1px 1px 0 1px;
border-style: solid; border-style: solid;
@ -1267,7 +1268,7 @@
/*font-size: 100%;*/ /*font-size: 100%;*/
.fontsize_m; .fontsize_m;
line-height: 1em; line-height: 1em;
margin:0 1px 2px 2px; margin:0 15px 2px 2px;
vertical-align: super; vertical-align: super;
} }
@ -1328,7 +1329,7 @@
// # # // # #
// ################# // #################
.egw_fw_ui_tab_close_button { .egw_fw_ui_tab_close_button {
right: 1px; right: 3px;
top: 1px; top: 1px;
display: inline-block; display: inline-block;
@ -1338,7 +1339,7 @@
background-position: center; background-position: center;
background-image: url(../images/close_button.png); background-image: url(../images/close_button.png);
background-size: 10px 10px; background-size: 10px 10px;
float: right; position: absolute;
:hover { :hover {
background-image: url(../images/close_button_hover.png); background-image: url(../images/close_button_hover.png);