forked from Techsystech/web
[FIX] web_responsive: Add logo, fix modularity & style
* Add style to hide oe_footer instead of remove to not break `support_branding` * Add company logo and editing to App Drawer title bar * Remove translation and screen reader from glyphs * Minor style fixes on app drawer toggle button positioning * Add note in ReadMe explaining override of `support_branding` * Add note in ReadMe explaining why no `oe_main_menu_navbar`9.0
parent
8303a11371
commit
fb29a53a6b
|
@ -40,12 +40,18 @@ The following keyboard shortcuts are implemented:
|
|||
Known issues / Roadmap
|
||||
======================
|
||||
|
||||
Note: Data added to the footer ``support_branding`` is not shown while using
|
||||
this module.
|
||||
|
||||
* Provide full menu search feature instead of just App search
|
||||
* Drag drawer from left to open in mobile
|
||||
* Figure out how to test focus on hidden elements for keyboard nav tests
|
||||
* If you resize the window, body gets a wrong ``overflow: auto`` css property
|
||||
and you need to refresh your view or open/close the app drawer to fix that.
|
||||
* Override LESS styling to allow for responsive widget layouts
|
||||
* Adding ``oe_main_menu_navbar`` ID to the top navigation bar triggers some
|
||||
great styles, but also `JavaScript that causes issues on mobile
|
||||
<https://github.com/OCA/web/pull/446#issuecomment-254827880>`_
|
||||
|
||||
Bug Tracker
|
||||
===========
|
||||
|
|
|
@ -85,7 +85,9 @@ odoo.define('web_responsive', function(require) {
|
|||
this.initDrawer();
|
||||
var $clickZones = $('.openerp_webclient_container, ' +
|
||||
'a.oe_menu_leaf, ' +
|
||||
'a.oe_menu_toggler'
|
||||
'a.oe_menu_toggler, ' +
|
||||
'a.oe_logo, ' +
|
||||
'i.oe_logo_edit'
|
||||
);
|
||||
$clickZones.click($.proxy(this.handleClickZones, this));
|
||||
core.bus.on('resize', this, this.handleWindowResize);
|
||||
|
|
|
@ -12,6 +12,26 @@
|
|||
.box-shadow(0 6px 12px rgba(0, 0, 0, .175));
|
||||
background-clip: padding-box;
|
||||
|
||||
.oe_logo {
|
||||
img {
|
||||
margin-top: -@app-drawer-navbar-padding-vertical;
|
||||
height: @app-drawer-title-height;
|
||||
}
|
||||
.oe_logo_edit {
|
||||
position: absolute;
|
||||
top: 1px;
|
||||
width: 100%;
|
||||
padding: 4px;
|
||||
margin: 14px 0;
|
||||
display: none;
|
||||
color: #eee;
|
||||
background: rgba(37,37,37,0.9);
|
||||
}
|
||||
&:hover .oe_logo_edit_admin {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-left {
|
||||
width: 100%;
|
||||
|
||||
|
@ -25,7 +45,7 @@
|
|||
}
|
||||
|
||||
.app-drawer-panel-title {
|
||||
margin-top: 4px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.app-drawer-icon-app {
|
||||
|
|
|
@ -21,3 +21,7 @@ main {
|
|||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
div.oe_footer {
|
||||
display: none;
|
||||
}
|
||||
|
|
|
@ -45,7 +45,10 @@
|
|||
accesskey="A"
|
||||
>
|
||||
<span class="sr-only">Toggle App Drawer</span>
|
||||
<i class="fa fa-th fa-lg app-drawer-icon-open" />
|
||||
<i class="fa fa-th fa-lg app-drawer-icon-open"
|
||||
t-translation="off"
|
||||
aria-hidden="true"
|
||||
/>
|
||||
</a>
|
||||
|
||||
<button type="button"
|
||||
|
@ -62,7 +65,10 @@
|
|||
data-target="#odooMenuBarNav"
|
||||
>
|
||||
<span class="sr-only">Toggle Navigation</span>
|
||||
<i class="fa fa-bars fa-lg" />
|
||||
<i class="fa fa-bars fa-lg"
|
||||
t-translation="off"
|
||||
aria-hidden="true"
|
||||
/>
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
@ -102,12 +108,13 @@
|
|||
|
||||
<xpath expr="//a[@class='oe_logo']" position="replace" />
|
||||
|
||||
<xpath expr="//div[@class='oe_footer']" position="replace" />
|
||||
|
||||
<xpath expr="//div[@class='oe_secondary_menus_container']/t" position="replace">
|
||||
|
||||
<t t-foreach="menu_data['children']" t-as="menu">
|
||||
<ul style="display: none" class="oe_secondary_menu nav navbar-nav" t-att-data-menu-parent="menu['id']">
|
||||
<ul class="oe_secondary_menu nav navbar-nav"
|
||||
t-att-data-menu-parent="menu['id']"
|
||||
style="display: none;"
|
||||
>
|
||||
<t t-call="web.menu_secondary_submenu" />
|
||||
</ul>
|
||||
</t>
|
||||
|
@ -206,12 +213,26 @@
|
|||
|
||||
<div class="panel-default app-drawer-app-panel" id="appDrawerAppMenu">
|
||||
<div class="panel-heading" id="appDrawerAppPanelHead">
|
||||
<h4 class="app-drawer-panel-title">
|
||||
<a href="#" class="app-drawer-icon-close drawer-toggle">
|
||||
<i class="fa fa-lg fa-chevron-left" />
|
||||
Apps
|
||||
<div class="col-xs-6">
|
||||
<h4 class="app-drawer-panel-title pull-left">
|
||||
<a href="#" class="app-drawer-icon-close drawer-toggle">
|
||||
<i class="fa fa-lg fa-chevron-left"
|
||||
t-translation="off"
|
||||
aria-hidden="true"
|
||||
/>
|
||||
Apps
|
||||
</a>
|
||||
</h4>
|
||||
</div>
|
||||
<div class="col-xs-6">
|
||||
<a class="oe_logo pull-right" t-attf-href="/web?{{ keep_query() }}">
|
||||
<i class="fa fa-pencil-square-o oe_logo_edit"
|
||||
aria-hidden="true"
|
||||
t-translation="off"
|
||||
/>
|
||||
<img src='/web/binary/company_logo'/>
|
||||
</a>
|
||||
</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body" id="appDrawerAppPanelBody">
|
||||
<ul class="row list-unstyled oe_application_menu_placeholder"
|
||||
|
|
Loading…
Reference in New Issue