diff --git a/pixelegg/mobile/fw_mobile.css b/pixelegg/mobile/fw_mobile.css index fe6c7c2fba..5e6bf2b6ba 100644 --- a/pixelegg/mobile/fw_mobile.css +++ b/pixelegg/mobile/fw_mobile.css @@ -8629,6 +8629,7 @@ table.egwGridView_grid img.et2_appicon { position: relative; height: 50px; z-index: 1; + display: flex; border-bottom: 1px solid transparent; } body .et2_nextmatch .nm-mob-header button { @@ -8661,6 +8662,7 @@ table.egwGridView_grid img.et2_appicon { background-color: transparent !important; background-size: 24px 24px !important; border: none; + order: 9; } body .et2_nextmatch .nm-mob-header button.nm_toggle_header:focus { outline: none; @@ -8681,6 +8683,7 @@ table.egwGridView_grid img.et2_appicon { background-color: transparent !important; background-size: 24px 24px !important; border: none; + order: 10; } body .et2_nextmatch .nm-mob-header button.nm_action_header:focus { outline: none; @@ -8708,8 +8711,10 @@ table.egwGridView_grid img.et2_appicon { float: right; text-align: center; display: none; + order: 7; } body .et2_nextmatch .nm-mob-header div.nm_favorites_div { + order: 8; background-position: center; background-repeat: no-repeat; border-left: 1px solid silver; @@ -8788,31 +8793,9 @@ table.egwGridView_grid img.et2_appicon { -webkit-filter: none!important; background-color: white !important; } - body .et2_nextmatch .nm-mob-header input[type="search"] { - width: 50px; - height: 50px; - font-size: large; - margin: 0; - border: 0; - opacity: 0; - background-color: #0c5da5; - color: black; - position: absolute; - } - body .et2_nextmatch .nm-mob-header input[type="search"]:active { - border: none; - background: #0c5da5; - } - body .et2_nextmatch .nm-mob-header input[type="search"]:focus { - border: none; - background: white; - outline: none; - opacity: 1; - left: 110px; - position: absolute; - width: 100%; - height: 50px; - z-index: 2; + body .et2_nextmatch .nm-mob-header et2-searchbox { + order: -1; + width: -webkit-fill-available; } body .et2_nextmatch .nm-mob-header div.nm_appname_header { width: 100%; diff --git a/pixelegg/mobile/fw_mobile.less b/pixelegg/mobile/fw_mobile.less index e5e7083810..fff13ad9b6 100644 --- a/pixelegg/mobile/fw_mobile.less +++ b/pixelegg/mobile/fw_mobile.less @@ -799,6 +799,7 @@ position: relative; height: 50px; z-index: 1; + display: flex; border-bottom: 1px solid transparent; button { height: @mobile-elem-height; @@ -829,6 +830,7 @@ &:focus{ outline:none; } + order: 9; } button.nm_action_header { background-image: url(../../api/templates/default/images/dots.svg); @@ -845,6 +847,7 @@ &:focus{ outline:none; } + order: 10; } button.nm_action_header.back { background-image: url(../../api/templates/default/images/cancelled.svg); @@ -865,8 +868,10 @@ float: right; text-align: center; display:none; + order:7; } div.nm_favorites_div { + order:8; background-position: center; background-repeat: no-repeat; border-left:1px solid silver; @@ -958,31 +963,9 @@ -webkit-filter: none!important; background-color: white !important; } - input[type="search"] { - width: 50px; - height: @mobile-elem-height; - font-size: large; - margin:0; - border:0; - opacity: 0; - background-color:@mobile-nm-search-bg; - color: black; - position: absolute; - &:active{ - border:none; - background: @mobile-nm-search-bg; - } - &:focus { - border:none; - background:white; - outline: none; - opacity: 1; - left:110px; - position: absolute; - width:100%; - height:@mobile-elem-height; - z-index: 2; - } + et2-searchbox { + order: -1; + width: -webkit-fill-available; } div.nm_appname_header { width: 100%;