extern/egroupware_official
1
0
Fork 0
mirror of https://github.com/EGroupware/egroupware.git synced 2024-12-22 14:41:29 +01:00
Code Issues Packages Projects Releases Wiki Activity

Mobile theme W.I.P.:

Browse Source 
- Replace utf-8 chars with svg icons
- Fix stylig applications icons
- Get et2_buttons in dailogHeader in white color
This commit is contained in:
Hadi Nategh 2016-02-24 15:44:45 +00:00
parent 0656d7e004
commit 0e379eeab4
7 changed files with 288 additions and 257 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
pixelegg/css/mobile.css
View File

@ -6189,16 +6189,6 @@ span.egw_tutorial_title {
background-position: 3px 7px; background-position: 3px 7px;
position: fixed; position: fixed;
} }
body span.egw_fw_mobile_popup_close.loaded {
background-image: none;
}
body span.egw_fw_mobile_popup_close.loaded:after {
content: "\2190";
font-size: 24pt;
color: white;
padding-left: 5px;
font-weight: bold;
}
body #egw_fw_basecontainer { body #egw_fw_basecontainer {
background: white; background: white;
} }

13
pixelegg/css/mobile.less
View File

@ -130,16 +130,7 @@
background-position: 3px 7px; background-position: 3px 7px;
position: fixed; position: fixed;
} }
span.egw_fw_mobile_popup_close.loaded {
&:after {
content: "\2190";
font-size: 24pt;
color: white;
padding-left: 5px;
font-weight: bold;
}
background-image: none;
}
/*EOF close/back button styling*/ /*EOF close/back button styling*/
#egw_fw_basecontainer{ #egw_fw_basecontainer{
@ -715,7 +706,7 @@
padding-left: 0; padding-left: 0;
padding-right: 0px; padding-right: 0px;
float: left; float: left;
/*filter grey*/ /*filter grey*/
.img_filter_gray; .img_filter_gray;
} }

8
pixelegg/css/pixelegg.css
View File

@ -3763,7 +3763,7 @@ td.message span.message {
text-decoration: none; text-decoration: none;
height: 32px; height: 32px;
/*font-size: 1.1em;*/ /*font-size: 1.1em;*/
font-size: 12.100000000000001px; font-size: 12.1px;
line-height: 1.5em; line-height: 1.5em;
} }
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a:hover { #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a:hover {
@ -3787,7 +3787,7 @@ td.message span.message {
} }
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul a#topmenu_home:before { #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul a#topmenu_home:before {
padding-right: 20px; padding-right: 20px;
font-size: 12.100000000000001px; font-size: 12.1px;
content: " "; content: " ";
background-image: url(../images/topmenu_items/home.png); background-image: url(../images/topmenu_items/home.png);
background-repeat: no-repeat; background-repeat: no-repeat;
@ -4185,7 +4185,7 @@ td.message span.message {
padding-left: 3em; padding-left: 3em;
color: #999999; color: #999999;
/*font-size: 12px;*/ /*font-size: 12px;*/
font-size: 12.100000000000001px; font-size: 12.1px;
line-height: 17px; line-height: 17px;
} }
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_header object { #egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_header object {
@ -4356,7 +4356,7 @@ td.message span.message {
margin: 5px 0px 3px 5px; margin: 5px 0px 3px 5px;
padding: 0px 0px 0px 15px; padding: 0px 0px 0px 15px;
line-height: 1em; line-height: 1em;
font-size: 12.100000000000001px; font-size: 12.1px;
background-image: url(../images/arrow_left.png); background-image: url(../images/arrow_left.png);
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: left center; background-position: left center;

0
pixelegg/images/next_match.svg → pixelegg/images/menu_list.svg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 1.3 KiB

0
pixelegg/images/next_match_round.svg → pixelegg/images/menu_list_round.svg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.0 KiB

After

Width:  |  Height:  |  Size: 2.0 KiB

146
pixelegg/mobile/fw_mobile.css
View File

@ -6200,16 +6200,6 @@ span.egw_tutorial_title {
background-position: 3px 7px; background-position: 3px 7px;
position: fixed; position: fixed;
} }
body span.egw_fw_mobile_popup_close.loaded {
background-image: none;
}
body span.egw_fw_mobile_popup_close.loaded:after {
content: "\2190";
font-size: 24pt;
color: white;
padding-left: 5px;
font-weight: bold;
}
body #egw_fw_basecontainer { body #egw_fw_basecontainer {
background: white; background: white;
} }
@ -6925,10 +6915,14 @@ span.egw_tutorial_title {
/*Tablets landscape mode*/ /*Tablets landscape mode*/
/*Tablets Portrait*/ /*Tablets Portrait*/
/*Smartphones*/ /*Smartphones*/
.white-svg {
-webkit-filter: brightness(0) invert(1) !important;
filter: brightness(0) invert(1) !important;
background-color: transparent !important;
background-size: 24px 24px !important;
border: none;
}
@media only screen and (max-device-width : 1024px) { @media only screen and (max-device-width : 1024px) {
html * {
-webkit-overflow-scrolling: touch;
}
#egw_fw_print { #egw_fw_print {
display: none; display: none;
} }
@ -7079,13 +7073,25 @@ span.egw_tutorial_title {
@media all { @media all {
html * { html * {
touch-action: auto; touch-action: auto;
-webkit-overflow-scrolling: touch;
} }
body { body {
/*Chosen*/ /*Chosen*/
/* View mode styles*/ /* View mode styles*/
} }
body span.egw_fw_mobile_popup_close.loaded {
background-image: url(../images/topmenu_items/mobile/back.svg);
-webkit-filter: brightness(0) invert(1) !important;
filter: brightness(0) invert(1) !important;
background-color: transparent !important;
background-size: 24px 24px !important;
border: none;
top: 0;
background-position: center;
padding: 0;
}
body #egw_fw_basecontainer.sidebar-toggle #egw_fw_top_toolbar div#egw_fw_menu { body #egw_fw_basecontainer.sidebar-toggle #egw_fw_top_toolbar div#egw_fw_menu {
background-image: url(../images/topmenu_items/mobile/menu_white.png); background-image: url(../images/topmenu_items/mobile/menu.svg);
width: 50px; width: 50px;
height: 50px; height: 50px;
background-color: transparent; background-color: transparent;
@ -7103,6 +7109,20 @@ span.egw_tutorial_title {
background: none; background: none;
box-shadow: none; box-shadow: none;
} }
body #egw_fw_basecontainer #egw_fw_main img[src$="svg"],
body #egw_fw_basecontainer #egw_fw_footer img[src$="svg"] {
background: none;
border: none;
filter: none;
-webkit-filter: none;
box-shadow: none;
}
body #egw_fw_basecontainer .egw_fw_ui_sidemenu_entry_apps > div {
display: inline-block;
}
body #egw_fw_basecontainer .egw_fw_ui_sidemenu_entry_apps > div h1 {
display: none;
}
body div.dhtmlxMenu_egw_SubLevelArea_Polygon { body div.dhtmlxMenu_egw_SubLevelArea_Polygon {
font-size: medium; font-size: medium;
top: 50px !important; top: 50px !important;
@ -7301,25 +7321,25 @@ span.egw_tutorial_title {
width: 50px; width: 50px;
} }
body .et2_nextmatch .nm-mob-header button.nm_toggle_header { body .et2_nextmatch .nm-mob-header button.nm_toggle_header {
background-image: url(../images/menu_list_round.svg);
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
margin-right: 5px; margin-right: 5px;
border-left: 1px solid silver;
border: 0;
color: white;
width: 50px; width: 50px;
height: 50px; height: 50px;
display: block; display: block;
float: right; float: right;
-webkit-filter: brightness(0) invert(1) !important;
filter: brightness(0) invert(1) !important;
background-color: transparent !important;
background-size: 24px 24px !important;
border: none;
} }
body .et2_nextmatch .nm-mob-header button.nm_toggle_header:focus { body .et2_nextmatch .nm-mob-header button.nm_toggle_header:focus {
outline: none; outline: none;
} }
body .et2_nextmatch .nm-mob-header button.nm_toggle_header:after {
font-size: 18pt;
content: "\2261";
}
body .et2_nextmatch .nm-mob-header button.nm_action_header { body .et2_nextmatch .nm-mob-header button.nm_action_header {
background-image: url(../images/dots.svg);
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
margin-right: 5px; margin-right: 5px;
@ -7330,19 +7350,17 @@ span.egw_tutorial_title {
height: 50px; height: 50px;
display: block; display: block;
float: right; float: right;
-webkit-filter: brightness(0) invert(1) !important;
filter: brightness(0) invert(1) !important;
background-color: transparent !important;
background-size: 24px 24px !important;
border: none;
} }
body .et2_nextmatch .nm-mob-header button.nm_action_header:focus { body .et2_nextmatch .nm-mob-header button.nm_action_header:focus {
outline: none; outline: none;
} }
body .et2_nextmatch .nm-mob-header button.nm_action_header:after { body .et2_nextmatch .nm-mob-header button.nm_action_header.back {
font-size: 18pt; background-image: url(../images/cancelled.svg);
content: "\205D";
font-weight: bold;
}
body .et2_nextmatch .nm-mob-header button.nm_action_header.back:after {
font-size: 18pt;
content: "\2190";
font-weight: bold;
} }
body .et2_nextmatch .nm-mob-header div.nm_favorites_div { body .et2_nextmatch .nm-mob-header div.nm_favorites_div {
background-position: center; background-position: center;
@ -7367,15 +7385,14 @@ span.egw_tutorial_title {
body .et2_nextmatch .nm-mob-header div.nm_favorites_div div[name="favorite"] .et2_dropdown button:first-child { body .et2_nextmatch .nm-mob-header div.nm_favorites_div div[name="favorite"] .et2_dropdown button:first-child {
display: none; display: none;
} }
body .et2_nextmatch .nm-mob-header div.nm_favorites_div div[name="favorite"] .et2_dropdown button:nth-child(2) {
background-position: center;
background-image: url(../images/topmenu_items/mobile/star.svg) !important;
background-size: 24px 24px;
}
body .et2_nextmatch .nm-mob-header div.nm_favorites_div div[name="favorite"] .et2_dropdown button:nth-child(2) div:first-child { body .et2_nextmatch .nm-mob-header div.nm_favorites_div div[name="favorite"] .et2_dropdown button:nth-child(2) div:first-child {
display: none; display: none;
} }
body .et2_nextmatch .nm-mob-header div.nm_favorites_div div[name="favorite"] .et2_dropdown button:nth-child(2):after {
font-size: 17pt;
content: "\2606";
font-weight: bold;
vertical-align: super;
}
body .et2_nextmatch .nm-mob-header div.nm_favorites_div div[name="favorite"] ul.favorites { body .et2_nextmatch .nm-mob-header div.nm_favorites_div div[name="favorite"] ul.favorites {
width: 160px; width: 160px;
box-shadow: 0px 4px 5px 2px silver; box-shadow: 0px 4px 5px 2px silver;
@ -7397,8 +7414,8 @@ span.egw_tutorial_title {
body .et2_nextmatch .nm-mob-header div.nm_favorites_div div[name="favorite"] ul.favorites li.ui-menu-item a div.ui-icon-trash { body .et2_nextmatch .nm-mob-header div.nm_favorites_div div[name="favorite"] ul.favorites li.ui-menu-item a div.ui-icon-trash {
display: block; display: block;
} }
body .et2_nextmatch .nm-mob-header button.nm_toggle_header_on:after { body .et2_nextmatch .nm-mob-header button.nm_toggle_header_on {
content: "\2613"; background-image: url(../images/cancelled.svg);
} }
body .et2_nextmatch .nm-mob-header input[type="search"] { body .et2_nextmatch .nm-mob-header input[type="search"] {
width: 50px; width: 50px;
@ -7612,6 +7629,14 @@ span.egw_tutorial_title {
padding-top: 6px; padding-top: 6px;
margin-top: 0; margin-top: 0;
} }
body #popupMainDiv .dialogHeadbar button[class*="et2_button_with_image"]:not([class*="et2_toolbar_hasCaption"]) {
-webkit-filter: brightness(0) invert(1) !important;
filter: brightness(0) invert(1) !important;
background-color: transparent !important;
background-size: 24px 24px !important;
border: none;
padding-right: 15px;
}
body .rowHeader { body .rowHeader {
font-size: 12pt; font-size: 12pt;
} }
@ -7640,30 +7665,32 @@ span.egw_tutorial_title {
margin-left: 50px; margin-left: 50px;
} }
body div.et2_toolbar.et2_head_toolbar div.et2_toolbar_actionlist button.et2_button.ui-draggable { body div.et2_toolbar.et2_head_toolbar div.et2_toolbar_actionlist button.et2_button.ui-draggable {
background-color: transparent !important;
border: none !important; border: none !important;
box-shadow: none !important; box-shadow: none !important;
background-position: center !important; background-position: center !important;
-webkit-filter: brightness(0) invert(1); -webkit-filter: brightness(0) invert(1) !important;
filter: brightness(0) invert(1); filter: brightness(0) invert(1) !important;
background-color: transparent !important;
background-size: 24px 24px !important;
border: none;
margin-right: 15px;
} }
body div.et2_toolbar.et2_head_toolbar div.et2_toolbar_more h.ui-state-hover { body div.et2_toolbar.et2_head_toolbar div.et2_toolbar_more h.ui-state-hover {
background: none; background: none;
} }
body div.et2_toolbar.et2_head_toolbar div.et2_toolbar_more h.ui-toolbar-menulistHeader { body div.et2_toolbar.et2_head_toolbar div.et2_toolbar_more h.ui-toolbar-menulistHeader {
color: transparent; color: transparent;
border: none;
height: 46px; height: 46px;
width: 35px; width: 50px;
padding: 0 !important; padding: 0 !important;
margin-right: 15px; background-image: url(../images/dots.svg);
margin-top: -7px; background-repeat: no-repeat;
} background-position: center;
body div.et2_toolbar.et2_head_toolbar div.et2_toolbar_more h.ui-toolbar-menulistHeader:after { -webkit-filter: brightness(0) invert(1) !important;
font-size: 18pt; filter: brightness(0) invert(1) !important;
content: "\205D"; background-color: transparent !important;
font-weight: bold; background-size: 24px 24px !important;
color: white; border: none;
} }
body div.et2_toolbar.et2_head_toolbar div.et2_toolbar_more h.ui-toolbar-menulistHeader span { body div.et2_toolbar.et2_head_toolbar div.et2_toolbar_more h.ui-toolbar-menulistHeader span {
display: none; display: none;
@ -7745,10 +7772,15 @@ span.egw_tutorial_title {
font-weight: bold; font-weight: bold;
} }
body .et2_searchbox button.et2_button.searched { body .et2_searchbox button.et2_button.searched {
background-image: url(../images/topmenu_items/mobile/search.png); background-image: url(../images/search.svg);
} }
body .et2_searchbox button.et2_button { body .et2_searchbox button.et2_button {
background-image: url(../images/topmenu_items/mobile/search_white.png) !important; background-image: url(../images/search.svg) !important;
-webkit-filter: brightness(0) invert(1) !important;
filter: brightness(0) invert(1) !important;
background-color: transparent !important;
background-size: 24px 24px !important;
border: none;
} }
body .et2_searchbox input { body .et2_searchbox input {
font-size: 10pt; font-size: 10pt;
@ -7775,7 +7807,7 @@ span.egw_tutorial_title {
background-color: white; background-color: white;
height: 49px; height: 49px;
width: 50px; width: 50px;
background-image: url("../images/cancelled.png"); background-image: url("../images/cancelled.svg");
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
border-bottom: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6;
@ -7787,5 +7819,11 @@ span.egw_tutorial_title {
body img.et2_button_icon[src*="svg"] { body img.et2_button_icon[src*="svg"] {
background: none; background: none;
box-shadow: none; box-shadow: none;
border: none;
}
body img[src*="svg"] {
background: none !important;
border: none;
box-shado: none;
} }
} }

368
pixelegg/mobile/fw_mobile.less
View File

@ -36,12 +36,17 @@
/*Smartphones*/ /*Smartphones*/
@smartphones: ~"only screen and (max-device-width: @{smartphone-max}) and (min-width: @{smartphone-min})"; @smartphones: ~"only screen and (max-device-width: @{smartphone-max}) and (min-width: @{smartphone-min})";
.white-svg {
-webkit-filter: brightness(0) invert(1) !important;
filter: brightness(0) invert(1) !important;
background-color: transparent !important;
background-size: 24px 24px !important;
border:none;
}
@media @handheld @media @handheld
{ {
html * {
-webkit-overflow-scrolling: touch;
}
#egw_fw_print { #egw_fw_print {
display:none; display:none;
} }
@ -219,13 +224,20 @@
@mobile-button-width: 50px; @mobile-button-width: 50px;
@mobile-nm-search-bg: #0c5da5; @mobile-nm-search-bg: #0c5da5;
@media all { @media all {
html *{touch-action:auto;} html *{touch-action:auto;-webkit-overflow-scrolling: touch;}
body body
{ {
span.egw_fw_mobile_popup_close.loaded {
background-image: url(../images/topmenu_items/mobile/back.svg);
.white-svg;
top: 0;
background-position: center;
padding: 0;
}
#egw_fw_basecontainer.sidebar-toggle { #egw_fw_basecontainer.sidebar-toggle {
#egw_fw_top_toolbar { #egw_fw_top_toolbar {
div#egw_fw_menu { div#egw_fw_menu {
background-image: url(../images/topmenu_items/mobile/menu_white.png); background-image: url(../images/topmenu_items/mobile/menu.svg);
width: 50px; width: 50px;
height: 50px; height: 50px;
background-color: transparent; background-color: transparent;
@ -248,8 +260,23 @@
background: none; background: none;
box-shadow: none; box-shadow: none;
} }
#egw_fw_main img[src$="svg"], #egw_fw_footer img[src$="svg"] {
background:none;
border:none;
filter:none;
-webkit-filter:none;
box-shadow: none;
}
.egw_fw_ui_sidemenu_entry_apps> div{
display: inline-block;
h1 {
display: none;
}
}
} }
//################### //###################
//# # //# #
//# CONTEXT MENU # //# CONTEXT MENU #
@ -450,27 +477,21 @@
width:50px; width:50px;
} }
button.nm_toggle_header { button.nm_toggle_header {
background-image: url(../images/menu_list_round.svg);
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
margin-right:5px; margin-right:5px;
border-left:1px solid silver;
border:0;
color: white;
width:50px; width:50px;
height:50px; height:50px;
display:block; display:block;
float:right; float:right;
.white-svg;
&:focus{ &:focus{
outline:none; outline:none;
} }
&:after{
font-size: 18pt;
content:"\2261";
}
} }
button.nm_action_header { button.nm_action_header {
background-image: url(../images/dots.svg);
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
margin-right:5px; margin-right:5px;
@ -481,22 +502,13 @@
height:50px; height:50px;
display:block; display:block;
float:right; float:right;
.white-svg;
&:focus{ &:focus{
outline:none; outline:none;
} }
&:after{
font-size:18pt;
content:"\205D";
font-weight: bold;
}
} }
button.nm_action_header.back { button.nm_action_header.back {
background-image: url(../images/cancelled.svg);
&:after{
font-size:18pt;
content: "\2190";
font-weight: bold;
}
} }
div.nm_favorites_div { div.nm_favorites_div {
background-position: center; background-position: center;
@ -521,15 +533,12 @@
display: none; display: none;
} }
button:nth-child(2) { button:nth-child(2) {
background-position: center;
background-image: url(../images/topmenu_items/mobile/star.svg) !important;
background-size: 24px 24px;
div:first-child { div:first-child {
display: none; display: none;
} }
&:after{
font-size: 17pt;
content: "\2606";
font-weight: bold;
vertical-align: super;
}
} }
} }
ul.favorites { ul.favorites {
@ -557,9 +566,7 @@
} }
} }
button.nm_toggle_header_on { button.nm_toggle_header_on {
&:after { background-image: url(../images/cancelled.svg);
content:"\2613";
}
} }
input[type="search"] { input[type="search"] {
width: 50px; width: 50px;
@ -781,6 +788,12 @@
margin-top:0; margin-top:0;
} }
} }
.dialogHeadbar {
button[class*="et2_button_with_image"]:not([class*="et2_toolbar_hasCaption"]) {
.white-svg;
padding-right: 15px;
}
}
} }
.rowHeader { .rowHeader {
.mob-fontsize-l; .mob-fontsize-l;
@ -818,12 +831,11 @@
div.et2_toolbar_actionlist { div.et2_toolbar_actionlist {
margin-left: 50px; margin-left: 50px;
button.et2_button.ui-draggable { button.et2_button.ui-draggable {
background-color: transparent !important;
border: none !important; border: none !important;
box-shadow: none !important; box-shadow: none !important;
background-position: center !important; background-position: center !important;
-webkit-filter: brightness(0) invert(1); .white-svg;
filter: brightness(0) invert(1); margin-right: 15px;
} }
} }
div.et2_toolbar_more { div.et2_toolbar_more {
@ -835,173 +847,173 @@
color:transparent; color:transparent;
border: none; border: none;
height: 46px; height: 46px;
width: 35px; width: 50px;
padding: 0 !important; padding: 0 !important;
margin-right: 15px; background-image: url(../images/dots.svg);
margin-top: -7px; background-repeat: no-repeat;
&:hover { background-position: center;
.white-svg;
}
&:after {
font-size:18pt;
content:"\205D";
font-weight: bold;
color:white;
}
span { span {
display: none; display: none;
} }
} }
} }
} }
//########################################### //###########################################
//# # //# #
//# et2_tabbox styles # //# et2_tabbox styles #
//# # //# #
//########################################### //###########################################
.et2_tabbox.vertical { .et2_tabbox.vertical {
.et2_tabflag { .et2_tabflag {
border:none; border:none;
div.et2_tabtitle { div.et2_tabtitle {
background-color: #f0f0f0; background-color: #f0f0f0;
&:before { &:before {
padding: 0; padding: 0;
width:30px; width:30px;
height:30px; height:30px;
text-align: center; text-align: center;
font-size: 18pt; font-size: 18pt;
}
} }
} }
} }
.et2_link_to { }
div { .et2_link_to {
height:40px; div {
padding-bottom: 3px; height:40px;
width: 99% !important; padding-bottom: 3px;
} width: 99% !important;
.et2_file { }
margin: 0; .et2_file {
padding:0; margin: 0;
.et2_file_span, .et2_file_spanHover, .et2_file_upload { padding:0;
height:25px !important; .et2_file_span, .et2_file_spanHover, .et2_file_upload {
} height:25px !important;
} }
} }
/*Chosen*/ }
.chzn-container { /*Chosen*/
ul.chzn-choices { .chzn-container {
background: none; ul.chzn-choices {
border: none; background: none;
border-bottom: 1px solid @gray_10; border: none;
border-bottom: 1px solid @gray_10;
}
} }
.chzn-container-multi {
.chzn-choices { }
li.search-field { .chzn-container-multi {
.default { .chzn-choices {
color:#666; li.search-field {
} .default {
color:#666;
} }
} }
} }
.et2_taglist { }
.ms-ctn { .et2_taglist {
border: none; .ms-ctn {
border-bottom: 1px solid @gray_10; border: none;
border-radius: 0; border-bottom: 1px solid @gray_10;
margin-right:5px; border-radius: 0;
} margin-right:5px;
.ms-sel-ctn {
background: white;
}
} }
.ms-sel-ctn {
/* View mode styles*/ background: white;
.et2_mobile_view { }
display:block; }
.et2_mobile-view-container { /* View mode styles*/
padding:0 14px 0 7px; .et2_mobile_view {
/*Disable et2_link_to as it does not make sense in view mode*/ display:block;
div.et2_link_to {display: none;}
} .et2_mobile-view-container {
table.et2_grid{ padding:0 14px 0 7px;
tr { /*Disable et2_link_to as it does not make sense in view mode*/
td { div.et2_link_to {display: none;}
padding: 10px 5px 10px 0; }
} table.et2_grid{
tr {
td {
padding: 10px 5px 10px 0;
} }
} }
} }
.mobile-view-editBtn { }
position: fixed; .mobile-view-editBtn {
top:2px; position: fixed;
left: 70px; top:2px;
width: 50px; left: 70px;
height: 50px; width: 50px;
float:left; height: 50px;
z-index:104; float:left;
font-size:18pt !important; z-index:104;
font-size:18pt !important;
color: white;
&:before {
content: "";
font-size: 24pt;
color: white; color: white;
&:before { padding-left: 5px;
content: ""; font-weight: bold;
font-size: 24pt;
color: white;
padding-left: 5px;
font-weight: bold;
}
display: block;
} }
display: block;
.et2_searchbox { }
button.et2_button.searched {
background-image: url(../images/topmenu_items/mobile/search.png); .et2_searchbox {
} button.et2_button.searched {
button.et2_button { background-image: url(../images/search.svg);
background-image: url(../images/topmenu_items/mobile/search_white.png) !important;
}
input{
.mob-fontsize-n;
}
} }
.et2_searchbox.expanded { button.et2_button {
position: absolute; background-image: url(../images/search.svg) !important;
width:100% !important; .white-svg;
height:50px;
margin-left:0;
button.et2_button{
background: none;
}
input {
width:100%;
height:45px;
margin:0;
top:0;
outline: none;
}
span.ui-icon.clear{
top: 0px;
left: -50px;
background-color: white;
height: 49px;
width: 50px;
background-image: url("../images/cancelled.png");
background-position: center;
background-repeat: no-repeat;
border-bottom: 1px solid #e6e6e6;
background-size: 24px 24px;
}
.flex{
width:100%;
}
} }
input{
img.et2_button_icon[src*="svg"] { .mob-fontsize-n;
}
}
.et2_searchbox.expanded {
position: absolute;
width:100% !important;
height:50px;
margin-left:0;
button.et2_button{
background: none; background: none;
box-shadow: none;
} }
input {
width:100%;
height:45px;
margin:0;
top:0;
outline: none;
}
span.ui-icon.clear{
top: 0px;
left: -50px;
background-color: white;
height: 49px;
width: 50px;
background-image: url("../images/cancelled.svg");
background-position: center;
background-repeat: no-repeat;
border-bottom: 1px solid #e6e6e6;
background-size: 24px 24px;
}
.flex{
width:100%;
}
}
img.et2_button_icon[src*="svg"] {
background: none;
box-shadow: none;
border:none;
}
img[src*="svg"] {
background:none !important;
border:none;
box-shado:none;
}
} }
} }