WIP mobile framework: Adding orientation feature to the framework

This commit is contained in:
Hadi Nategh 2014-11-20 18:10:10 +00:00
parent 9e32d842a2
commit 13ae7b2493

View File

@ -11,23 +11,28 @@ and open the template in the editor.
#egw_fw_basecontainer{
//###################
//# #
//# SIDEBAR #
//# #
//###################
#egw_fw_sidebar{
top: 60px;
border-top:2px solid gray;
}//End of Sidebar
//###################
//# #
//# TOOLBAR #
//# #
//###################
#egw_fw_top_toolbar{
border-bottom:1px sold gray;
div#egw_fw_app_menu{
background-image: url(../images/topmenu_items/mobile/menu.png);
top: 15px;
width: 32px;
height: 32px;
background-size: 32px 32px;
background-repeat: no-repeat;
position:absolute;
right:15px;
padding-bottom: 13px;
border-bottom: 2px solid gray;
}
}
//FW Logout
div#egw_fw_logout{
left: 235px;
@ -66,25 +71,28 @@ and open the template in the editor.
}
div#egw_fw_topmenu_items{
width: 250px;
display: inline-block;
display: inline;
float: left;
position: fixed;
left: 20px;
top: 4px;
left: 55px;
top: 15px;
ul{
display:flex;
display:inline;
padding:0;
margin:0;
list-style-type: none;
li{
display:table-row;
display:inline;
padding-right: 6px;
}
a#topmenu_home:before {
content: " ";
background-image: url(../images/topmenu_items/mobile/home.png);
background-repeat: no-repeat;
background-size: 24px 24px;
width: 24px;
height: 24px;
display: inline-block;
width: 32px;
height: 32px;
background-size: 32px 32px;
/*display: inline-block;*/
display:none;
}
a#topmenu_prefs:before {
@ -150,7 +158,18 @@ and open the template in the editor.
}
}//End of toolbar
#egw_fw_portrait_bar{
margin: 7px 5px 0px 285px;
.egw_fw_ui_tabs_header {
height: auto;
.egw_fw_ui_tab_header {
width:auto;
h1{
display:none;
}
}
}
}
// ######################tabs header ##########################
// # # # # # # # # # ####
// # # # # # # # # # ####
@ -210,7 +229,7 @@ and open the template in the editor.
width: 97%;
&:hover {
/*.background_color_20_gray ;*/
background-color: @egw_color_1_e;
background-color: none !important;
}
// APP Name
@ -273,6 +292,15 @@ and open the template in the editor.
}
}
}
//###################
//# #
//# SIDEBAR #
//# #
//###################
#egw_fw_sidebar{
top: 60px;
border-top:2px solid gray;
//SIDE AREA
#egw_fw_sidemenu {
@ -281,14 +309,13 @@ and open the template in the editor.
bottom: 4px;
left: 4px;
right: 5px;
overflow: auto;
overflow-y: auto;
z-index: 0;
padding-top: 0.6em;
font-size: 0.9em;
//####################################################
// All Tabs
// DRAG AND DROP
.egw_fw_ui_sidemenu_entry_header
{
display: block;
@ -533,10 +560,10 @@ and open the template in the editor.
} // SIDEMENU End
}//End of Sidebar
//ToggleClass
.sidebarToggle{
.sidebar-toggle{
#egw_fw_sidebar{
#egw_fw_sidemenu{
width:82px !important;
@ -578,5 +605,11 @@ and open the template in the editor.
}
}
.portrait-app-toggle{
#egw_fw_portrait_bar{
display:none !important;
}
}
}