extern/egroupware
1
0
Fork 1
mirror of https://github.com/EGroupware/egroupware.git synced 2024-10-05 17:52:03 +02:00
Code Issues Packages Projects Releases Wiki Activity

WIP mobile framework: Add topbar menu for portrait view

Browse Source
This commit is contained in:
Hadi Nategh 2014-11-24 16:20:55 +00:00
parent 8cb404ddbf
commit c2dc16c85c
1 changed files with 57 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
pixelegg/less/mobile.less
View File

@ -20,17 +20,33 @@ and open the template in the editor.
//################### //###################
#egw_fw_top_toolbar{ #egw_fw_top_toolbar{
border-bottom: 2px solid gray; border-bottom: 2px solid gray;
div#egw_fw_app_menu{ div.egw_fw_ui_tabs_header{
background-image: url(../images/topmenu_items/mobile/menu.png); max-height: 60px;
top: 15px; width: 69%;
width: 32px; margin-left: 0;
height: 32px; overflow-x: scroll;
background-size: 32px 32px; position: initial;
background-repeat: no-repeat; white-space: nowrap;
position:absolute; position: fixed;
right:15px; left: 30%;
padding-bottom: 13px; top: 6px;
border-bottom: 2px solid gray; height: 50px;
span{
margin:0;
overflow: visible;
height:38px;
width:50px;
border-width: 1px 1px 1px 1px;
/*border-radius: 0px 15px 15px 0px;*/
img{
height:32px !important;
width:32px !important;
}
h1{
display:none;
}
}
} }
} }
//FW Logout //FW Logout
@ -52,10 +68,18 @@ and open the template in the editor.
height: 24px; height: 24px;
background-size: 24px 24px; background-size: 24px 24px;
} }
.egw_fw_top_toolbar>div:hover{
-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
}
//FW Menu //FW Menu
div#egw_fw_menu{ div#egw_fw_menu{
background-image: url(../images/topmenu_items/mobile/menu.png); background-image: url(../images/topmenu_items/mobile/menu_active.png);
-webkit-transform:rotate(360deg);
transform:rotate(360deg);
position: fixed; position: fixed;
left: 20px; left: 20px;
top: 15px; top: 15px;
@ -63,6 +87,7 @@ and open the template in the editor.
height: 32px; height: 32px;
background-size: 32px 32px; background-size: 32px 32px;
background-repeat: no-repeat; background-repeat: no-repeat;
z-index: 999;
} }
div#egw_fw_menu:active { div#egw_fw_menu:active {
-webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
@ -104,7 +129,7 @@ and open the template in the editor.
background-size: 32px 32px; background-size: 32px 32px;
display: inline-block; display: inline-block;
} }
a#topmenu_acl:before { a#topmenu_acl:before {
content: ""; content: "";
background-repeat: no-repeat; background-repeat: no-repeat;
@ -153,7 +178,11 @@ and open the template in the editor.
background-size: 32px 32px; background-size: 32px 32px;
display: inline-block; display: inline-block;
} }
a#topmenu_search:active {
transform: scale(-2);
-webkit-transform:scale(-2);
-webkit-transition: 1s ease;
}
} }
} }
}//End of toolbar }//End of toolbar
@ -552,6 +581,11 @@ and open the template in the editor.
//ToggleClass //ToggleClass
.sidebar-toggle{ .sidebar-toggle{
#egw_fw_top_toolbar div#egw_fw_menu{
background-image: url(../images/topmenu_items/mobile/menu.png);
-webkit-transform:rotate(0deg);
transform:rotate(0deg);
}
#egw_fw_sidebar{ #egw_fw_sidebar{
#egw_fw_sidemenu{ #egw_fw_sidemenu{
width:82px !important; width:82px !important;
@ -571,9 +605,11 @@ and open the template in the editor.
} }
.egw_fw_ui_tabs_header{ .egw_fw_ui_tabs_header{
span{ span{
margin:0px 5px 0px 2px;
overflow: visible;
height:38px; height:38px;
width:50px; width:50px;
border-radius: 0px 15px 15px 0px; /*border-radius: 0px 15px 15px 0px;*/
img{ img{
height:32px !important; height:32px !important;
width:32px !important; width:32px !important;
@ -592,4 +628,10 @@ and open the template in the editor.
display:none !important; display:none !important;
} }
} }
.tabs-header-portrait-collapsed{
left:7% !important;
width: 90% !important;
border-left:2px solid gray;
}
} }