feat: customizable portal gradient theme + LTC repair form fixes
- Add portal gradient branding settings with 4 presets (Green/Teal, Blue/Purple, Sunset Orange, Dark Slate) and custom color picker - Live preview in settings, onchange updates colors reactively - Dynamic gradient applied across portal home, CSS, and card elements - Fix after photos visibility (conditional on resolved=yes) - Fix technician section gating on portal repair form - Move Create Sale Order button to form header for visibility - Fix portal home row width inconsistency (xpath target change) Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
gsinghpal
@@ -4,13 +4,17 @@
|
||||
<!-- ==================== PORTAL HOME EXTENSION ==================== -->
|
||||
|
||||
<template id="portal_my_home_authorizer" inherit_id="portal.portal_my_home" priority="40">
|
||||
<!-- Insert Fusion content at the very top, before alert category -->
|
||||
<xpath expr="//div[@id='portal_alert_category']" position="before">
|
||||
<!-- Insert Fusion content before the default portal docs grid -->
|
||||
<xpath expr="//div[hasclass('o_portal_docs')]" position="before">
|
||||
<t t-if="request.env.user.partner_id.is_authorizer or request.env.user.partner_id.is_sales_rep_portal or request.env.user.partner_id.is_client_portal or request.env.user.partner_id.is_technician_portal">
|
||||
<t t-set="fc_gradient" t-value="portal_gradient or 'linear-gradient(135deg, #5ba848 0%, #3a8fb7 60%, #2e7aad 100%)'"/>
|
||||
<style>
|
||||
:root { --fc-portal-gradient: <t t-out="fc_gradient"/>; }
|
||||
</style>
|
||||
<!-- Welcome Banner -->
|
||||
<div class="row mb-4">
|
||||
<div class="row g-3 mb-4">
|
||||
<div class="col-12">
|
||||
<div class="border-0 shadow-sm p-4" style="background: linear-gradient(135deg, #5ba848 0%, #3a8fb7 60%, #2e7aad 100%); border-radius: 12px;">
|
||||
<div class="border-0 shadow-sm p-4" t-attf-style="background: {{fc_gradient}}; border-radius: 12px;">
|
||||
<div class="d-flex align-items-center text-white">
|
||||
<div class="flex-grow-1">
|
||||
<h4 class="mb-1" style="color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,0.1);">
|
||||
@@ -71,7 +75,7 @@
|
||||
<a href="/my/accessibility" class="card h-100 border-0 shadow-sm text-decoration-none" style="border-radius: 12px; min-height: 100px;">
|
||||
<div class="card-body d-flex align-items-center p-4">
|
||||
<div class="me-3">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center" style="width: 50px; height: 50px; background: linear-gradient(135deg, #5ba848 0%, #3a8fb7 60%, #2e7aad 100%);">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center" t-attf-style="width: 50px; height: 50px; background: {{fc_gradient}};">
|
||||
<i class="fa fa-wheelchair fa-lg text-white"/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -90,7 +94,7 @@
|
||||
<a href="/my/sales" class="card h-100 border-0 shadow-sm text-decoration-none" style="border-radius: 12px; min-height: 100px;">
|
||||
<div class="card-body d-flex align-items-center p-4">
|
||||
<div class="me-3">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center" style="width: 50px; height: 50px; background: linear-gradient(135deg, #5ba848 0%, #3a8fb7 60%, #2e7aad 100%);">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center" t-attf-style="width: 50px; height: 50px; background: {{fc_gradient}};">
|
||||
<i class="fa fa-briefcase fa-lg text-white"/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -109,7 +113,7 @@
|
||||
<a href="/my/assessments" class="card h-100 border-0 shadow-sm text-decoration-none" style="border-radius: 12px; min-height: 100px;">
|
||||
<div class="card-body d-flex align-items-center p-4">
|
||||
<div class="me-3">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center" style="width: 50px; height: 50px; background: linear-gradient(135deg, #5ba848 0%, #3a8fb7 60%, #2e7aad 100%);">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center" t-attf-style="width: 50px; height: 50px; background: {{fc_gradient}};">
|
||||
<i class="fa fa-clipboard fa-lg text-white"/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -131,7 +135,7 @@
|
||||
</t>
|
||||
<div class="card-body d-flex align-items-center p-4">
|
||||
<div class="me-3">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center" style="width: 50px; height: 50px; background: linear-gradient(135deg, #5ba848 0%, #3a8fb7 60%, #2e7aad 100%);">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center" t-attf-style="width: 50px; height: 50px; background: {{fc_gradient}};">
|
||||
<i class="fa fa-pencil-square-o fa-lg text-white"/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -172,7 +176,7 @@
|
||||
<a href="/my/technician" class="card h-100 border-0 shadow-sm text-decoration-none" style="border-radius: 12px; min-height: 100px;">
|
||||
<div class="card-body d-flex align-items-center p-4">
|
||||
<div class="me-3">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center" style="width: 50px; height: 50px; background: linear-gradient(135deg, #5ba848 0%, #3a8fb7 60%, #2e7aad 100%);">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center" t-attf-style="width: 50px; height: 50px; background: {{fc_gradient}};">
|
||||
<i class="fa fa-truck fa-lg text-white"/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -191,7 +195,7 @@
|
||||
<a href="/my/funding-claims" class="card h-100 border-0 shadow-sm text-decoration-none" style="border-radius: 12px; min-height: 100px;">
|
||||
<div class="card-body d-flex align-items-center p-4">
|
||||
<div class="me-3">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center" style="width: 50px; height: 50px; background: linear-gradient(135deg, #5ba848 0%, #3a8fb7 60%, #2e7aad 100%);">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center" t-attf-style="width: 50px; height: 50px; background: {{fc_gradient}};">
|
||||
<i class="fa fa-file-text-o fa-lg text-white"/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -206,16 +210,16 @@
|
||||
</div>
|
||||
|
||||
<!-- ADP Posting Schedule Card -->
|
||||
<div class="row mb-4" t-if="next_posting_date">
|
||||
<div class="row g-3 mb-4" t-if="next_posting_date">
|
||||
<div class="col-12">
|
||||
<div class="card shadow-sm border-0 overflow-hidden" style="border-radius: 12px;">
|
||||
<div class="card-header py-3" style="background: linear-gradient(135deg, #5ba848 0%, #3a8fb7 60%, #2e7aad 100%);">
|
||||
<div class="card-header py-3" t-attf-style="background: {{fc_gradient}};">
|
||||
<h5 class="mb-0 text-white"><i class="fa fa-calendar me-2"/>Upcoming ADP Posting Schedule</h5>
|
||||
</div>
|
||||
<div class="card-body" style="background: linear-gradient(180deg, #f8f9fa 0%, #ffffff 100%);">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-md-4 text-center mb-3 mb-md-0">
|
||||
<div class="rounded-3 p-4" style="background: linear-gradient(135deg, #5ba848 0%, #3a8fb7 60%, #2e7aad 100%);">
|
||||
<div class="rounded-3 p-4" t-attf-style="background: {{fc_gradient}};">
|
||||
<small class="d-block" style="color: rgba(255,255,255,0.8);">Next ADP Posting</small>
|
||||
<h2 class="mb-1 text-white"><t t-out="next_posting_display"/></h2>
|
||||
<small style="color: rgba(255,255,255,0.8);"><t t-out="next_posting_weekday"/></small>
|
||||
|
||||
Reference in New Issue
Block a user