WIP Mobile template: get nm header fields sorted and get the searchbox to have the rest of available space

This commit is contained in:
Hadi Nategh 2022-08-22 16:41:33 +02:00
parent 082d6aa791
commit 68f50ee89b
2 changed files with 16 additions and 50 deletions

View File

@ -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%;

View File

@ -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%;