NextERP/documentation
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[IMP] search-form: improve ui & fix bug on mobile

Browse Source 
Bug fix on mobile that was displaying the button on a new line.
Smaller input/button sizes to win some space for breadcrumb nav.
Vertical alignment of search-form.
This commit is contained in:
kosta (kts) 2020-02-10 11:27:11 +01:00 committed by Antoine Vandevenne (anv)
parent c5b9af9192
commit 52e49eda47
2 changed files with 31 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
_extensions/odoo/static/style.less
View File

@ -29,6 +29,20 @@
color: @gray-lighter;
}
> .o_sub_nav #o_sub-menu #searchbox {
display: flex;
align-items: center;
justify-content: center;
> form {
display: flex;
flex-grow: 1;
> .form-control {
border-radius: 0;
}
}
}
> .o_sub_nav #o_sub-menu .o_breadcrumb {
@media screen and (min-width: @screen-sm-min) {
@ -288,7 +302,7 @@ main.index {
position: relative;
overflow: hidden;
margin-bottom: @card_margin-bottom;
min-height: @card_min-height;
padding-top: 56%;
background-color: @doc_paper;
will-change: transform;
.deep-2;
@ -319,12 +333,13 @@ main.index {
figcaption {
.opacity(1);
display: block;
font-weight: @fw_regular;
font-weight: @fw_bold;
font-family: @headings-font-family;
color: @headings-color;
margin: 0;
background-color: white;
font-size: 1.2em;
font-size: 14px;
line-height: 1.2;
width: 100%;
padding: 8px 12px;
.o-position-absolute(0);
@ -369,30 +384,28 @@ main.index {
}
.card.top {
padding: 10% 0 8%;
position: relative;
overflow: hidden;
margin: 0;
padding: 0 0 2%;
.o-gradient();
.animation(fadeIn 1s);
.box-shadow(none);
.transform-origin(50% 0px 0px);
@media screen and (min-width: @screen-sm-min) and (max-width: (@screen-md-min - 1)) {
padding-top: 12%;
@media screen and (min-width: @screen-sm-min) {
padding: 12% 0 5%;
}
#wrap.index & {
padding: 0 0 4%;
@media screen and (min-width: @screen-sm-min) {
padding-top: 12%;
}
@media screen and (min-width: @screen-lg-min) {
padding-top: 8%;
}
@media screen and (min-width: @screen-md-min) {
padding: 10% 0 2%;
}
@media screen and (min-width: @screen-lg-min) {
padding: 8% 0 4%;
}
&.stacked{
background:transparent;

4
_extensions/odoo/sub-menu_list.html
View File

@ -10,11 +10,11 @@
{%- if pagename != "search" and builder != "singlehtml" %}
<li id="searchbox" style="display: none; margin: 0 0 0 10px;" role="search">
<form class="search form-inline" action="{{ pathto('search') }}" method="get">
<form class="search form-inline input-group-sm" action="{{ pathto('search') }}" method="get">
<input type="text" class="form-control" name="q" id="q" placeholder="Search..." />
<input type="hidden" name="area" value="default" />
<input type="hidden" name="check_keywords" value="yes" />
<button type="submit" value="Go" class="btn btn-default">Go</button>
<button type="submit" value="Go" class="btn btn-default btn-sm">Go</button>
</form>
</li>
<script type="text/javascript">$('#searchbox').show(0);</script>