extern/egroupware
1
0
Fork 1
mirror of https://github.com/EGroupware/egroupware.git synced 2024-11-07 16:44:20 +01:00
Code Issues Packages Projects Releases Wiki Activity

Mobile theme WIP:

Browse Source 
- Fix nm header styling and add new white icon for toggle menu
- Implement custom theme color for nm header and plus_button
This commit is contained in:
Hadi Nategh 2016-01-14 15:43:52 +00:00
parent f04ccc9b06
commit 3eaca151a3
4 changed files with 55 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
pixelegg/css/mobile.css
View File

@ -6742,13 +6742,11 @@ span.egw_tutorial_title {
#egw_fw_basecontainer div#egw_fw_menu {
background-image: url(../images/topmenu_items/mobile/menu_active.png);
cursor: pointer;
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
position: fixed;
left: 13px;
top: 13px;
width: 32px;
height: 32px;
width: 65px;
height: 50px;
background-size: 32px 32px;
background-repeat: no-repeat;
z-index: 999;
@ -6758,6 +6756,9 @@ span.egw_tutorial_title {
-moz-box-shadow: none;
box-shadow: none;
}
#egw_fw_basecontainer div#egw_fw_menu:focus {
outline: none;
}
#egw_fw_basecontainer div#egw_fw_menu:active {
-webkit-box-shadow: none;
-moz-box-shadow: none;
@ -7258,11 +7259,6 @@ span.egw_tutorial_title {
filter: gray;
/* IE 6-9 */
}
.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);
}
.sidebar-toggle #egw_fw_sidebar #egw_fw_sidemenu {
width: 82px !important;
}
@ -7486,6 +7482,16 @@ span.egw_tutorial_title {
/*mobile etemplate2*/
/*mobile etemplate2*/
@media only screen and (min-width: 320px) and (max-width: 1279px) {
body #egw_fw_basecontainer.sidebar-toggle #egw_fw_top_toolbar div#egw_fw_menu {
background-image: url(../images/topmenu_items/mobile/menu_white.png);
width: 65px;
height: 50px;
background-color: transparent;
top: -3px;
background-position: 15px center;
background-size: 32px 32px;
left: 0;
}
body #egw_fw_basecontainer #egw_fw_top_toolbar div#egw_fw_menu {
top: 8px;
}
@ -7601,7 +7607,10 @@ span.egw_tutorial_title {
body .et2_nextmatch .search {
background: #0c5da5;
margin-top: 0;
margin-left: 60px;
padding-left: 60px;
box-shadow: 0px 4px 5px 2px silver;
position: relative;
z-index: 1;
}
body .et2_nextmatch .search button {
height: 50px;
@ -7769,6 +7778,7 @@ span.egw_tutorial_title {
}
body .et2_nextmatch .egwGridView_outer thead {
max-height: 1px;
display: none;
}
body .et2_nextmatch .egwGridView_outer thead tr th {
font-size: large;

33
pixelegg/css/mobile.less
View File

@ -204,13 +204,11 @@
div#egw_fw_menu{
background-image: url(../images/topmenu_items/mobile/menu_active.png);
cursor: pointer;
-webkit-transform:rotate(360deg);
transform:rotate(360deg);
position: fixed;
left: 13px;
top: 13px;
width: 32px;
height: 32px;
width: 65px;
height: 50px;
background-size: 32px 32px;
background-repeat: no-repeat;
z-index: 999;
@ -219,6 +217,9 @@
-moz-box-shadow: none;
box-shadow: none;
}
&:focus {
outline: none;
}
}
div#egw_fw_menu:active {
-webkit-box-shadow: none;
@ -721,9 +722,7 @@
.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_sidemenu{
@ -1018,6 +1017,20 @@
@media only screen and (min-width: 320px) and (max-width: 1279px) {
body
{
#egw_fw_basecontainer.sidebar-toggle {
#egw_fw_top_toolbar {
div#egw_fw_menu {
background-image: url(../images/topmenu_items/mobile/menu_white.png);
width: 65px;
height: 50px;
background-color: transparent;
top: -3px;
background-position: 15px center;
background-size: 32px 32px;
left: 0;
}
}
}
#egw_fw_basecontainer {
#egw_fw_top_toolbar {
div#egw_fw_menu {
@ -1156,7 +1169,10 @@
.search {
background: @mobile-nm-search-bg;
margin-top: 0;
margin-left: 60px;
padding-left: 60px;
box-shadow: 0px 4px 5px 2px silver;
position: relative;
z-index: 1;
button {
height: @mobile-elem-height;
width: @mobile-button-width;
@ -1334,6 +1350,7 @@
.egwGridView_outer {
thead{
max-height: 1px;
display: none;
}
thead tr th {
font-size: large;

BIN
pixelegg/images/topmenu_items/mobile/menu_white.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 325 B

10
pixelegg/inc/class.pixelegg_framework.inc.php
View File

@ -152,6 +152,16 @@ div#egw_fw_header, div.egw_fw_ui_category:hover,#loginMainDiv,#loginMainDiv #div
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_category_active{
background-color: $color_hex_darker !important;
}
/*nextmatch header and plus_button in mobile theme*/
body div.et2_nextmatch .search,
body div.et2_nextmatch .search button,
body button.plus_button,
body div.et2_nextmatch .search .nm_action_header,
body div.et2_nextmatch .search .nm_toggle_header,
body div.et2_nextmatch .search .nm_favorites_button {
background-color: $color;
}
";
}
return $ret;