New mobile menu #328
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,86 @@ | ||
| <?xml version="1.0" encoding="utf-8" ?> | ||
| <odoo> | ||
| <template id="my2_mobile_app_layout" inherit_id="website.layout" name="My2 Mobile App Layout"> | ||
| <xpath expr="//header" position="attributes"> | ||
| <attribute | ||
| name="t-attf-class" | ||
| add="#{ 'd-none d-md-block' if request.session.uid and '/my2/' in request.httprequest.path else '' }" | ||
| separator=" " | ||
| /> | ||
| </xpath> | ||
| <xpath expr="//footer" position="attributes"> | ||
| <attribute | ||
| name="t-attf-class" | ||
| add="#{ 'd-none d-md-block' if request.session.uid and '/my2/' in request.httprequest.path else '' }" | ||
| separator=" " | ||
| /> | ||
| </xpath> | ||
| <xpath expr="//div[@id='wrapwrap']" position="inside"> | ||
| <t t-if="request.session.uid and '/my2/' in request.httprequest.path"> | ||
| <div id="bottom_nav_spacer" class="d-block d-md-none w-100" /> | ||
| <t t-set="partner" t-value="request.env.user.partner_id" /> | ||
| <t t-set="tab_count" t-value="6 if partner.is_sponsor else 4" /> | ||
| <nav | ||
| class="my2-bottom-nav d-flex d-md-none fixed-bottom bg-white border-top shadow-lg pt-2 pb-1" | ||
| t-attf-style="--tab-count: #{tab_count}" | ||
| > | ||
| <a | ||
| href="/my2/dashboard" | ||
| t-attf-class="nav-tab d-flex flex-column align-items-center text-decoration-none #{'active text-core-blue' if request.httprequest.path == '/my2/dashboard' else 'text-muted'}" | ||
| > | ||
| <i t-attf-class="pictogram-buildings-house vignette-icon" /> | ||
| <span>Home</span> | ||
| </a> | ||
| <t t-if="partner.is_sponsor"> | ||
| <a | ||
| href="/my2/children" | ||
| t-attf-class="nav-tab d-flex flex-column align-items-center text-decoration-none #{'active text-core-blue' if '/my2/children' in request.httprequest.path and 'letter' not in request.httprequest.path else 'text-muted'}" | ||
| > | ||
| <i t-attf-class="pictogram-child-sponsorship vignette-icon" /> | ||
| <span>My Sponsorships</span> | ||
| </a> | ||
| <a | ||
| href="/my2/children/letters" | ||
| t-attf-class="nav-tab d-flex flex-column align-items-center text-decoration-none #{'active text-core-blue' if '/my2/children/letters' in request.httprequest.path else 'text-muted'}" | ||
| > | ||
| <i t-attf-class="pictogram-letter-writing vignette-icon" /> | ||
| <span>Letters</span> | ||
| </a> | ||
| </t> | ||
| <a | ||
| href="/my2/gifts" | ||
| t-attf-class="nav-tab d-flex flex-column align-items-center text-decoration-none #{'active text-core-blue' if request.httprequest.path == '/my2/gifts' else 'text-muted'}" | ||
| > | ||
| <i t-attf-class="pictogram-gift-donation-general vignette-icon" /> | ||
| <span>Give</span> | ||
| </a> | ||
| <a | ||
| href="/my2/gift-package" | ||
| t-attf-class="nav-tab o_wsale_my_cart d-flex flex-column align-items-center text-decoration-none #{'active text-core-blue' if '/my2/gift-package' in request.httprequest.path else 'text-muted'}" | ||
| > | ||
| <div class="position-relative"> | ||
| <i t-attf-class="pictogram-gift-basket vignette-icon" /> | ||
| <t t-set="website_sale_order" t-value="website.sale_get_order()" /> | ||
| <sup | ||
| t-if="website_sale_order and website_sale_order.cart_quantity" | ||
| class="my_cart_quantity badge text-white" | ||
| t-esc="website_sale_order.cart_quantity" | ||
| /> | ||
| </div> | ||
| <span>Gift basket</span> | ||
| </a> | ||
| <a | ||
| href="/my2/user_settings" | ||
| t-attf-class="nav-tab d-flex flex-column align-items-center text-decoration-none #{'active text-core-blue' if '/my2/user_settings' in request.httprequest.path or '/my2/donations' in request.httprequest.path else 'text-muted'}" | ||
| > | ||
| <i t-attf-class="pictogram-profile vignette-icon" /> | ||
| <span>Profile</span> | ||
| </a> | ||
|
Comment on lines
+32
to
+78
There was a problem hiding this comment.
All nav-tab labels ( Similarly for the other
Contributor
Author
There was a problem hiding this comment. This is very true @Danielgergely And even more, there is no way for the user to switch its language anymore on mobile ! A solution has to be considered for this.
Contributor
Author
There was a problem hiding this comment. @greptileai Great point, you could even have said that actually, the proposition removes the possibility for a mobile user to switch language, as they can't see the top menu anymore where the language selector is, which is a regression that should have been flagged. There was a problem hiding this comment. You're absolutely right, and that's a more critical regression than the i18n markup issue I flagged. The My original comment focused on the static string labels but should have explicitly called out that hiding the header breaks language switching for mobile users entirely. The two issues together mean mobile users are both stuck in whatever language they loaded the page in and have no way to change it. A concrete fix worth flagging: the language switcher (and any other header-only controls) needs to either be surfaced in the bottom nav or in a dedicated mobile menu/settings area before the header can be safely hidden on small screens. Tip: You can give me more context with .greptile/rules.md so I get this right next time. |
||
| <div class="indicator-wrapper"> | ||
| <div class="indicator" /> | ||
| </div> | ||
| </nav> | ||
| </t> | ||
| </xpath> | ||
| </template> | ||
| </odoo> | ||
Uh oh!
There was an error while loading. Please reload this page.