extern/egroupware_official
1
0
Fork 0
mirror of https://github.com/EGroupware/egroupware.git synced 2024-12-31 11:09:04 +01:00
Code Issues Packages Projects Releases Wiki Activity

WIP mobile framework: Add more styling to tabs icons

Browse Source
This commit is contained in:
Hadi Nategh 2014-11-25 10:05:23 +00:00
parent e02484fe8c
commit 16ab91c7e9
1 changed files with 29 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
pixelegg/less/mobile.less
View File

@ -19,7 +19,6 @@ and open the template in the editor.
//# #
//###################
#egw_fw_top_toolbar{
border-bottom: 2px solid gray;
div.egw_fw_ui_tabs_header{
max-height: 60px;
width: 69%;
@ -37,8 +36,9 @@ and open the template in the editor.
height:38px;
width:50px;
border-width: 1px 1px 1px 1px;
border:none;
border-radius: 10px;
/*border-radius: 0px 15px 15px 0px;*/
img{
height:32px !important;
width:32px !important;
@ -117,7 +117,6 @@ and open the template in the editor.
width: 32px;
height: 32px;
background-size: 32px 32px;
/*display: inline-block;*/
display:none;
}
a#topmenu_prefs:before {
@ -204,7 +203,6 @@ and open the template in the editor.
height: 34px;
h1 {
/*float: left;*/
display: inline;
width: 100%;
text-align: center;
@ -247,17 +245,15 @@ and open the template in the editor.
height: 38px;
width: 97%;
&:hover {
/*.background_color_20_gray ;*/
background-color: none !important;
}
&:active {
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);
webkit-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.6);
box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.6);
}
// APP Name
h1 {
/*font-size: 100%;*/
.fontsize_xxl;
line-height: 1em;
margin:0 15px 2px 2px;
@ -276,7 +272,6 @@ and open the template in the editor.
// FOR SVG IMG
object {
.dimension_width_height_l;
/*background-color: @gray_0;*/
margin: 8px 1px 0 5px;
.border_radius(5px,0, 0, 5px);
@ -293,12 +288,7 @@ and open the template in the editor.
/*Active Tabs*/
.egw_fw_ui_tab_header_active {
border-width: 1px 1px 0px 1px !important;
/*padding: 0 0 5px !important;*/
.background_color_egw_light;
background-image:none !important;
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);
&:hover {.background_color_egw_light ;}
@ -306,6 +296,10 @@ and open the template in the editor.
img.egw_fw_ui_tab_icon {
display: inline-block;
.dimension_width_height_l;
-webkit-filter: contrast(100);
-ms-filter:contrast(100);
-moz-filter:contrast(100);
-o-filter:contrast(100);
}
/*Active object*/
object {
@ -324,8 +318,6 @@ and open the template in the editor.
//###################
#egw_fw_sidebar{
top: 60px;
border-top:2px solid gray;
//SIDE AREA
#egw_fw_sidemenu {
@ -345,7 +337,6 @@ and open the template in the editor.
{
display: block;
margin: 0 0;
/*padding: 0px 5px 5px 10px;*/
&:hover {
.background_color_15_gray;
@ -354,19 +345,16 @@ and open the template in the editor.
&:active {.box_shadow_standard_light_inset;}
h1 {
margin: 0 0 10px 0;
padding-top: 0.31em;
padding-left: 3em;
.color_40_gray;
/*font-size: 12px;*/
.fontsize_xl;
line-height: 17px;
}
object {background-color: @gray_0; .dimension_width_height_m;}
}
@ -486,8 +474,6 @@ and open the template in the editor.
border-color: @gray_30;
background-color: @gray_10;
/*background-color: @egw_color_2_d;*/
.border_radius(3px,3px,3px,3px);
h1 {
@ -528,7 +514,6 @@ and open the template in the editor.
background-color: @egw_color_2_a;
/*.background-color-50-gray;*/
.color_5_gray;
.border_radius(3px,3px,3px,3px) !important;
@ -556,11 +541,6 @@ and open the template in the editor.
&:hover {background-color: @egw_color_2_d; .transition (0.2s, ease-out);}
}
}
.egw_fw_ui_sidemenu_entry_content_bottom {
@ -617,6 +597,8 @@ and open the template in the editor.
overflow: visible;
height:38px;
width:50px;
border:none;
border-radius: 10px;
img{
height:32px !important;
width:32px !important;
@ -639,6 +621,23 @@ and open the template in the editor.
.tabs-header-portrait-collapsed{
left:7% !important;
width: 90% !important;
border-left:2px solid gray;
}
//###################################
//# #
//# FOOTER #
//# #
//###################################
#egw_fw_footer {
display:none;
}
//###################################
//# #
//# APP HEADER NAVIGATOR #
//# #
//###################################
.egw_fw_ui_app_header_container {
display:none;
}
}