Initial commit
This commit is contained in:
872
fusion_claims/static/src/scss/fusion_claims.scss
Normal file
872
fusion_claims/static/src/scss/fusion_claims.scss
Normal file
@@ -0,0 +1,872 @@
|
||||
// Fusion Central - Backend Styles
|
||||
// Copyright 2024-2025 Nexa Systems Inc.
|
||||
// License OPL-1
|
||||
|
||||
.o_fusion_central {
|
||||
// Settings page styling
|
||||
.fc-settings-section {
|
||||
margin-bottom: 20px;
|
||||
|
||||
h5 {
|
||||
color: #0077b6;
|
||||
border-bottom: 2px solid #0077b6;
|
||||
padding-bottom: 5px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
// Status indicators
|
||||
.fc-status-created {
|
||||
color: #28a745;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.fc-status-pending {
|
||||
color: #ffc107;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
// ADP portion columns styling
|
||||
.o_list_view {
|
||||
.o_field_monetary.fc-adp-portion {
|
||||
color: #0077b6;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.o_field_monetary.fc-client-portion {
|
||||
color: #28a745;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
// =============================================================================
|
||||
// STATUS BUTTONS: Theme-friendly (light + dark mode)
|
||||
// Uses Odoo CSS variables with safe fallbacks.
|
||||
// =============================================================================
|
||||
|
||||
// Good / confirmed / within period (green tint)
|
||||
.fc-btn-status-good {
|
||||
background-color: rgba(40, 167, 69, 0.12) !important;
|
||||
color: #1e7e34 !important;
|
||||
border: 1px solid rgba(40, 167, 69, 0.35) !important;
|
||||
|
||||
&:hover, &:focus {
|
||||
background-color: rgba(40, 167, 69, 0.22) !important;
|
||||
color: #1e7e34 !important;
|
||||
border-color: rgba(40, 167, 69, 0.5) !important;
|
||||
}
|
||||
|
||||
.fa { color: inherit !important; }
|
||||
}
|
||||
|
||||
// Bad / not confirmed / overdue (red tint)
|
||||
.fc-btn-status-bad {
|
||||
background-color: rgba(220, 53, 69, 0.12) !important;
|
||||
color: #bd2130 !important;
|
||||
border: 1px solid rgba(220, 53, 69, 0.35) !important;
|
||||
|
||||
&:hover, &:focus {
|
||||
background-color: rgba(220, 53, 69, 0.22) !important;
|
||||
color: #bd2130 !important;
|
||||
border-color: rgba(220, 53, 69, 0.5) !important;
|
||||
}
|
||||
|
||||
.fa { color: inherit !important; }
|
||||
}
|
||||
|
||||
// Dark mode overrides
|
||||
html.dark, .o_dark {
|
||||
.fc-btn-status-good {
|
||||
background-color: rgba(40, 167, 69, 0.18) !important;
|
||||
color: #6fcf87 !important;
|
||||
border-color: rgba(40, 167, 69, 0.4) !important;
|
||||
|
||||
&:hover, &:focus {
|
||||
background-color: rgba(40, 167, 69, 0.28) !important;
|
||||
color: #6fcf87 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.fc-btn-status-bad {
|
||||
background-color: rgba(220, 53, 69, 0.18) !important;
|
||||
color: #f08a93 !important;
|
||||
border-color: rgba(220, 53, 69, 0.4) !important;
|
||||
|
||||
&:hover, &:focus {
|
||||
background-color: rgba(220, 53, 69, 0.28) !important;
|
||||
color: #f08a93 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Also support Odoo's color-scheme media query for dark mode
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.o_web_client:not(.o_light) {
|
||||
.fc-btn-status-good {
|
||||
background-color: rgba(40, 167, 69, 0.18) !important;
|
||||
color: #6fcf87 !important;
|
||||
border-color: rgba(40, 167, 69, 0.4) !important;
|
||||
|
||||
&:hover, &:focus {
|
||||
background-color: rgba(40, 167, 69, 0.28) !important;
|
||||
color: #6fcf87 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.fc-btn-status-bad {
|
||||
background-color: rgba(220, 53, 69, 0.18) !important;
|
||||
color: #f08a93 !important;
|
||||
border-color: rgba(220, 53, 69, 0.4) !important;
|
||||
|
||||
&:hover, &:focus {
|
||||
background-color: rgba(220, 53, 69, 0.28) !important;
|
||||
color: #f08a93 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// =============================================================================
|
||||
// SALE ORDER LINE LIST: Column width control
|
||||
// Odoo 19 ignores the XML width attribute on list fields.
|
||||
// We use CSS on th[data-name] with table-layout:fixed to force widths.
|
||||
// Product column has NO explicit width so it absorbs all remaining space.
|
||||
// =============================================================================
|
||||
|
||||
.o_field_one2many[name="order_line"] .o_list_table {
|
||||
table-layout: fixed !important;
|
||||
width: 100% !important;
|
||||
|
||||
// ---- Product column: gets ALL remaining space (no width set) ----
|
||||
// Truncate long product names with ellipsis
|
||||
th[data-name="product_template_id"],
|
||||
td[name="product_template_id"],
|
||||
th[data-name="product_id"],
|
||||
td[name="product_id"] {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
// ---- Serial Number: generous width ----
|
||||
th[data-name="x_fc_serial_number"] { width: 140px !important; }
|
||||
|
||||
// ---- Quantity columns ----
|
||||
th[data-name="product_uom_qty"] { width: 55px !important; }
|
||||
th[data-name="qty_delivered"] { width: 55px !important; }
|
||||
th[data-name="qty_invoiced"] { width: 55px !important; }
|
||||
|
||||
// ---- UoM ----
|
||||
th[data-name="product_uom_id"] { width: 50px !important; }
|
||||
|
||||
// ---- Price / Discount / Tax / Subtotal ----
|
||||
th[data-name="price_unit"] { width: 80px !important; }
|
||||
th[data-name="tax_ids"] { width: 70px !important; }
|
||||
th[data-name="discount"] { width: 45px !important; }
|
||||
th[data-name="price_subtotal"] { width: 90px !important; }
|
||||
|
||||
// ---- ADP / Client Portion ----
|
||||
th[data-name="x_fc_adp_portion"] { width: 80px !important; }
|
||||
th[data-name="x_fc_client_portion"] { width: 80px !important; }
|
||||
|
||||
// ---- sale_margin optional columns ----
|
||||
th[data-name="purchase_price"] { width: 70px !important; }
|
||||
th[data-name="margin"] { width: 65px !important; }
|
||||
th[data-name="margin_percent"] { width: 55px !important; }
|
||||
|
||||
// ---- Description (hidden by default, but set width in case user shows it) ----
|
||||
th[data-name="name"] { width: 120px !important; }
|
||||
|
||||
// Tax tags: compact badges
|
||||
td[name="tax_ids"] .badge {
|
||||
font-size: 0.72em;
|
||||
padding: 2px 4px;
|
||||
}
|
||||
|
||||
// All cells: allow text truncation
|
||||
td {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
// Responsive: scale text on smaller screens
|
||||
@media (max-width: 1400px) {
|
||||
.o_field_one2many[name="order_line"] .o_list_table {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.o_field_one2many[name="order_line"] .o_list_table {
|
||||
font-size: 0.85em;
|
||||
}
|
||||
}
|
||||
|
||||
// Form view styling for ADP fields
|
||||
.o_form_view {
|
||||
.fc-adp-totals {
|
||||
background-color: #f8f9fa;
|
||||
border-left: 4px solid #0077b6;
|
||||
padding: 10px;
|
||||
margin: 10px 0;
|
||||
|
||||
.fc-total-label {
|
||||
font-weight: 600;
|
||||
color: #495057;
|
||||
}
|
||||
|
||||
.fc-total-value {
|
||||
font-size: 1.1em;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.fc-adp-value {
|
||||
color: #0077b6;
|
||||
}
|
||||
|
||||
.fc-client-value {
|
||||
color: #28a745;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// ADP Summary Line Details - constrain product column width
|
||||
.o_fc_line_details {
|
||||
.o_list_table {
|
||||
table-layout: fixed !important;
|
||||
width: 100% !important;
|
||||
|
||||
// Product column - first column
|
||||
td:first-child,
|
||||
th:first-child {
|
||||
max-width: 300px !important;
|
||||
width: 40% !important;
|
||||
overflow: hidden !important;
|
||||
text-overflow: ellipsis !important;
|
||||
white-space: nowrap !important;
|
||||
}
|
||||
|
||||
// Other columns - auto size
|
||||
td:not(:first-child),
|
||||
th:not(:first-child) {
|
||||
width: auto !important;
|
||||
white-space: nowrap !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// =============================================================================
|
||||
// CHATTER WIDTH CUSTOMIZATION
|
||||
// 80%/20% split ONLY on desktop (>= 992px).
|
||||
// On mobile/tablet, Odoo's default stacking (chatter below form) takes over.
|
||||
// ONLY applies to main action forms, NOT modal dialogs/wizards.
|
||||
// =============================================================================
|
||||
|
||||
@media (min-width: 992px) {
|
||||
// Only apply to non-modal forms (forms in the main action area, not in dialogs)
|
||||
.o_action_manager > .o_action > .o_form_view .o_form_renderer {
|
||||
display: flex !important;
|
||||
flex-wrap: nowrap !important;
|
||||
|
||||
// Form content takes 80% of space
|
||||
> .o_form_sheet_bg {
|
||||
flex: 0 0 80% !important;
|
||||
width: 80% !important;
|
||||
min-width: 0 !important;
|
||||
max-width: 80% !important;
|
||||
}
|
||||
|
||||
// Chatter container - 20% of screen
|
||||
> .o-mail-ChatterContainer,
|
||||
> .o-mail-Form-chatter,
|
||||
> .o-aside {
|
||||
flex: 0 0 20% !important;
|
||||
width: 20% !important;
|
||||
min-width: 20% !important;
|
||||
max-width: 20% !important;
|
||||
}
|
||||
}
|
||||
|
||||
// Additional backup selectors for chatter (non-modal only)
|
||||
.o_action_manager .o-mail-ChatterContainer.o-aside {
|
||||
flex: 0 0 20% !important;
|
||||
width: 20% !important;
|
||||
min-width: 20% !important;
|
||||
max-width: 20% !important;
|
||||
}
|
||||
|
||||
// Force the form sheet content to expand within its container (non-modal only)
|
||||
.o_action_manager .o_form_sheet_bg {
|
||||
max-width: none !important;
|
||||
}
|
||||
|
||||
// Also target the inner form sheet (non-modal only)
|
||||
.o_action_manager .o_form_sheet {
|
||||
max-width: none !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
// Make chatter content more compact (all screen sizes)
|
||||
.o-mail-Thread {
|
||||
.o-mail-Message {
|
||||
padding: 6px 10px !important;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
}
|
||||
|
||||
// Compact activity section
|
||||
.o-mail-Activity {
|
||||
padding: 4px 8px !important;
|
||||
}
|
||||
|
||||
// =============================================================================
|
||||
// Icon-only chatter topbar buttons (ALL screen sizes)
|
||||
// "Send message" and "Log note" have RAW TEXT inside (no <span>).
|
||||
// "WhatsApp" and "Activity" wrap text in <span>.
|
||||
// We use font-size:0 to hide text, then inject icons via ::before.
|
||||
// =============================================================================
|
||||
|
||||
.o-mail-Chatter-topbar {
|
||||
gap: 4px;
|
||||
|
||||
// --- Send message (raw text, no span) -> envelope icon ---
|
||||
.o-mail-Chatter-sendMessage {
|
||||
font-size: 0 !important;
|
||||
padding: 8px 12px !important;
|
||||
min-width: auto;
|
||||
line-height: 1;
|
||||
|
||||
&::before {
|
||||
font-family: "Font Awesome 5 Free", FontAwesome;
|
||||
font-weight: 900;
|
||||
font-size: 15px;
|
||||
content: "\f0e0"; // fa-envelope
|
||||
}
|
||||
}
|
||||
|
||||
// --- Log note (raw text, no span) -> edit icon ---
|
||||
.o-mail-Chatter-logNote {
|
||||
font-size: 0 !important;
|
||||
padding: 8px 12px !important;
|
||||
min-width: auto;
|
||||
line-height: 1;
|
||||
|
||||
&::before {
|
||||
font-family: "Font Awesome 5 Free", FontAwesome;
|
||||
font-weight: 900;
|
||||
font-size: 15px;
|
||||
content: "\f044"; // fa-edit / fa-pencil-square-o
|
||||
}
|
||||
}
|
||||
|
||||
// --- WhatsApp (text in <span>, target via hotkey) -> WhatsApp SVG ---
|
||||
button[data-hotkey="shift+w"] {
|
||||
> span { display: none !important; }
|
||||
padding: 8px 12px !important;
|
||||
min-width: auto;
|
||||
line-height: 1;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 17px;
|
||||
height: 17px;
|
||||
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z'/%3E%3C/svg%3E");
|
||||
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z'/%3E%3C/svg%3E");
|
||||
-webkit-mask-size: contain;
|
||||
mask-size: contain;
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
mask-repeat: no-repeat;
|
||||
background-color: currentColor;
|
||||
}
|
||||
}
|
||||
|
||||
// --- Activity (text in <span>) -> calendar icon ---
|
||||
.o-mail-Chatter-activity {
|
||||
> span { display: none !important; }
|
||||
padding: 8px 12px !important;
|
||||
min-width: auto;
|
||||
line-height: 1;
|
||||
|
||||
&::before {
|
||||
font-family: "Font Awesome 5 Free", FontAwesome;
|
||||
font-weight: 900;
|
||||
font-size: 15px;
|
||||
content: "\f073"; // fa-calendar
|
||||
}
|
||||
}
|
||||
|
||||
// --- Message Authorizer (text in <span>) -> custom SVG ---
|
||||
.o-mail-Chatter-messageAuthorizer {
|
||||
> span { display: none !important; }
|
||||
padding: 8px 12px !important;
|
||||
min-width: auto;
|
||||
line-height: 1;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 17px;
|
||||
height: 17px;
|
||||
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50'%3E%3Cpath d='M 25 -0.03125 C 11.839844 -0.03125 10.148438 4.851563 10 5.40625 C 9.988281 5.453125 9.976563 5.484375 9.96875 5.53125 L 7.96875 21.5 C 7.929688 21.828125 8.070313 22.148438 8.3125 22.375 C 8.410156 22.464844 8.503906 22.546875 8.625 22.59375 C 8.363281 23.386719 8.015625 24.71875 7.75 27.03125 C 7.75 27.042969 7.75 27.050781 7.75 27.0625 C 7.304688 27.746094 7 28.65625 7 29.8125 C 7 32.0625 8.582031 33.878906 10.65625 34.40625 C 12.003906 37.898438 13.675781 41.625 15.90625 44.59375 C 18.230469 47.683594 21.238281 50 25 50 C 28.761719 50 31.769531 47.683594 34.09375 44.59375 C 36.324219 41.625 37.996094 37.898438 39.34375 34.40625 C 41.429688 33.886719 43 32.070313 43 29.8125 C 43 28.613281 42.699219 27.6875 42.25 27 C 41.984375 24.707031 41.636719 23.382813 41.375 22.59375 C 41.496094 22.546875 41.589844 22.464844 41.6875 22.375 C 41.929688 22.148438 42.074219 21.828125 42.03125 21.5 L 40.03125 5.53125 C 40.023438 5.484375 40.011719 5.453125 40 5.40625 C 39.851563 4.851563 38.160156 -0.03125 25 -0.03125 Z M 24 6 L 26 6 L 26 10 L 30 10 L 30 12 L 26 12 L 26 16 L 24 16 L 24 12 L 20 12 L 20 10 L 24 10 Z M 25 20.78125 C 29.371094 20.78125 34.777344 21.605469 38 22.15625 L 38 27.65625 L 39.15625 27.46875 C 39.15625 27.46875 39.628906 27.390625 40.0625 27.59375 C 40.496094 27.796875 41 28.15625 41 29.8125 C 41 31.300781 39.898438 32.449219 38.5 32.59375 L 37.90625 32.65625 L 37.6875 33.25 C 36.34375 36.785156 34.621094 40.554688 32.5 43.375 C 30.378906 46.195313 27.941406 48 25 48 C 22.058594 48 19.621094 46.195313 17.5 43.375 C 15.378906 40.554688 13.6875 36.785156 12.34375 33.25 L 12.125 32.65625 L 11.5 32.59375 C 10.097656 32.449219 9 31.300781 9 29.8125 C 9 28.234375 9.484375 27.878906 9.9375 27.65625 C 10.390625 27.433594 10.875 27.46875 10.875 27.46875 L 12 27.59375 L 12 22.15625 C 15.222656 21.605469 20.625 20.78125 25 20.78125 Z'/%3E%3C/svg%3E");
|
||||
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50'%3E%3Cpath d='M 25 -0.03125 C 11.839844 -0.03125 10.148438 4.851563 10 5.40625 C 9.988281 5.453125 9.976563 5.484375 9.96875 5.53125 L 7.96875 21.5 C 7.929688 21.828125 8.070313 22.148438 8.3125 22.375 C 8.410156 22.464844 8.503906 22.546875 8.625 22.59375 C 8.363281 23.386719 8.015625 24.71875 7.75 27.03125 C 7.75 27.042969 7.75 27.050781 7.75 27.0625 C 7.304688 27.746094 7 28.65625 7 29.8125 C 7 32.0625 8.582031 33.878906 10.65625 34.40625 C 12.003906 37.898438 13.675781 41.625 15.90625 44.59375 C 18.230469 47.683594 21.238281 50 25 50 C 28.761719 50 31.769531 47.683594 34.09375 44.59375 C 36.324219 41.625 37.996094 37.898438 39.34375 34.40625 C 41.429688 33.886719 43 32.070313 43 29.8125 C 43 28.613281 42.699219 27.6875 42.25 27 C 41.984375 24.707031 41.636719 23.382813 41.375 22.59375 C 41.496094 22.546875 41.589844 22.464844 41.6875 22.375 C 41.929688 22.148438 42.074219 21.828125 42.03125 21.5 L 40.03125 5.53125 C 40.023438 5.484375 40.011719 5.453125 40 5.40625 C 39.851563 4.851563 38.160156 -0.03125 25 -0.03125 Z M 24 6 L 26 6 L 26 10 L 30 10 L 30 12 L 26 12 L 26 16 L 24 16 L 24 12 L 20 12 L 20 10 L 24 10 Z M 25 20.78125 C 29.371094 20.78125 34.777344 21.605469 38 22.15625 L 38 27.65625 L 39.15625 27.46875 C 39.15625 27.46875 39.628906 27.390625 40.0625 27.59375 C 40.496094 27.796875 41 28.15625 41 29.8125 C 41 31.300781 39.898438 32.449219 38.5 32.59375 L 37.90625 32.65625 L 37.6875 33.25 C 36.34375 36.785156 34.621094 40.554688 32.5 43.375 C 30.378906 46.195313 27.941406 48 25 48 C 22.058594 48 19.621094 46.195313 17.5 43.375 C 15.378906 40.554688 13.6875 36.785156 12.34375 33.25 L 12.125 32.65625 L 11.5 32.59375 C 10.097656 32.449219 9 31.300781 9 29.8125 C 9 28.234375 9.484375 27.878906 9.9375 27.65625 C 10.390625 27.433594 10.875 27.46875 10.875 27.46875 L 12 27.59375 L 12 22.15625 C 15.222656 21.605469 20.625 20.78125 25 20.78125 Z'/%3E%3C/svg%3E");
|
||||
-webkit-mask-size: contain;
|
||||
mask-size: contain;
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
mask-repeat: no-repeat;
|
||||
background-color: currentColor;
|
||||
}
|
||||
}
|
||||
|
||||
// --- Mic button (already icon-only from fusion_notes) ---
|
||||
.fusion-notes-mic-btn,
|
||||
.o-mail-Chatter-voiceNote {
|
||||
padding: 8px 12px !important;
|
||||
}
|
||||
}
|
||||
|
||||
// =============================================================================
|
||||
// XML VIEWER STYLES
|
||||
// =============================================================================
|
||||
|
||||
.xml-viewer-content {
|
||||
overflow: auto;
|
||||
background: #1e1e1e;
|
||||
|
||||
.xml-code {
|
||||
font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', monospace;
|
||||
font-size: 13px;
|
||||
line-height: 1.5;
|
||||
color: #d4d4d4;
|
||||
background: transparent;
|
||||
white-space: pre;
|
||||
tab-size: 2;
|
||||
}
|
||||
|
||||
// Syntax highlighting colors (VS Code dark theme inspired)
|
||||
.xml-tag {
|
||||
color: #569cd6;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.xml-attr {
|
||||
color: #9cdcfe;
|
||||
}
|
||||
|
||||
.xml-value {
|
||||
color: #ce9178;
|
||||
}
|
||||
}
|
||||
|
||||
// =============================================================================
|
||||
// ADP DOCUMENTS TILE LAYOUT
|
||||
// =============================================================================
|
||||
|
||||
.fc-document-tiles {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 16px;
|
||||
padding: 16px 0;
|
||||
}
|
||||
|
||||
.fc-document-tile {
|
||||
width: 220px;
|
||||
min-width: 220px;
|
||||
background: var(--o-bg-card, var(--bs-body-bg));
|
||||
border: 1px solid var(--o-border-color, var(--bs-border-color));
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
transition: all 0.2s ease;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
|
||||
|
||||
&:hover {
|
||||
border-color: var(--o-action, var(--bs-primary));
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
// Preview area
|
||||
.fc-tile-preview {
|
||||
height: 140px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: var(--o-bg-200, var(--bs-secondary-bg));
|
||||
border-bottom: 1px solid var(--o-border-color, var(--bs-border-color));
|
||||
position: relative;
|
||||
|
||||
.fc-pdf-icon {
|
||||
font-size: 48px;
|
||||
color: var(--o-danger, var(--bs-danger));
|
||||
}
|
||||
|
||||
.fc-xml-icon {
|
||||
font-size: 48px;
|
||||
color: var(--o-info, var(--bs-info));
|
||||
}
|
||||
|
||||
.fc-empty-icon {
|
||||
font-size: 48px;
|
||||
opacity: 0.35;
|
||||
}
|
||||
|
||||
.fc-thumbnail {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.fc-upload-overlay {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(0, 0, 0, 0.7);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
opacity: 0;
|
||||
transition: opacity 0.2s ease;
|
||||
|
||||
i {
|
||||
font-size: 32px;
|
||||
color: white;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
span {
|
||||
color: white;
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.fc-tile-empty:hover .fc-upload-overlay {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
// Tile info area
|
||||
.fc-tile-info {
|
||||
padding: 12px;
|
||||
text-align: center;
|
||||
|
||||
.fc-tile-label {
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 6px;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.fc-tile-filename {
|
||||
font-size: 11px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.fc-tile-empty-text {
|
||||
font-size: 11px;
|
||||
opacity: 0.5;
|
||||
font-style: italic;
|
||||
}
|
||||
}
|
||||
|
||||
// Actions bar
|
||||
.fc-tile-actions {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
border-top: 1px solid var(--o-border-color, var(--bs-border-color));
|
||||
background: var(--o-bg-100, var(--bs-tertiary-bg));
|
||||
padding: 8px;
|
||||
|
||||
button {
|
||||
flex: 1;
|
||||
padding: 8px;
|
||||
border: none;
|
||||
background: transparent;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
|
||||
&:hover {
|
||||
background: var(--o-action, var(--bs-primary));
|
||||
color: white;
|
||||
}
|
||||
|
||||
&:not(:last-child) {
|
||||
border-right: 1px solid var(--o-border-color, var(--bs-border-color));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Has file state
|
||||
&.fc-tile-filled {
|
||||
border-color: var(--o-success, var(--bs-success));
|
||||
}
|
||||
|
||||
// Required field indicator
|
||||
&:has(.o_required_modifier) {
|
||||
.fc-tile-label::after {
|
||||
content: " *";
|
||||
color: var(--o-danger, var(--bs-danger));
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
&:not(:has(.o_field_binary[value])) {
|
||||
border-color: var(--o-warning, var(--bs-warning));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Section headers for document groups
|
||||
.fc-doc-section {
|
||||
margin-bottom: 24px;
|
||||
|
||||
.fc-doc-section-header {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
border-bottom: 2px solid var(--o-action, var(--bs-primary));
|
||||
padding-bottom: 8px;
|
||||
margin-bottom: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
i {
|
||||
margin-right: 8px;
|
||||
color: var(--o-action, var(--bs-primary));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Style the upload field in tiles
|
||||
.fc-tile-upload-field {
|
||||
width: 100%;
|
||||
|
||||
.o_select_file_button {
|
||||
width: 100%;
|
||||
border: none !important;
|
||||
border-radius: 0 !important;
|
||||
background: transparent !important;
|
||||
font-size: 12px !important;
|
||||
padding: 8px !important;
|
||||
|
||||
&:hover {
|
||||
background: var(--o-action, var(--bs-primary)) !important;
|
||||
color: white !important;
|
||||
}
|
||||
}
|
||||
|
||||
.o_file_name {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.o_input_file {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
&.o_field_binary {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.o_form_binary_progress {
|
||||
width: 100%;
|
||||
padding: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
// Fix button styling in tiles
|
||||
.fc-document-tile {
|
||||
.btn-link {
|
||||
text-decoration: none !important;
|
||||
|
||||
&:hover {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
|
||||
.fc-pdf-icon:hover {
|
||||
opacity: 0.7;
|
||||
transform: scale(1.1);
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// =============================================================================
|
||||
// APPROVAL SCREENSHOTS GALLERY
|
||||
// =============================================================================
|
||||
|
||||
.fc-gallery-section {
|
||||
background: var(--o-bg-100, var(--bs-tertiary-bg));
|
||||
border: 2px solid var(--o-border-color, var(--bs-border-color));
|
||||
border-radius: 8px;
|
||||
padding: 16px;
|
||||
margin-top: 8px;
|
||||
|
||||
.fc-gallery-header {
|
||||
padding-bottom: 12px;
|
||||
|
||||
.fc-tile-label {
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.badge {
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
.btn {
|
||||
font-size: 12px;
|
||||
padding: 4px 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.fc-gallery-content {
|
||||
padding-top: 8px;
|
||||
|
||||
// Style the many2many_binary widget as a gallery
|
||||
.o_field_many2many_binary {
|
||||
display: flex !important;
|
||||
flex-wrap: wrap !important;
|
||||
gap: 12px !important;
|
||||
justify-content: flex-start !important;
|
||||
align-items: flex-start !important;
|
||||
padding-top: 4px !important;
|
||||
|
||||
// Each file item as a thumbnail card
|
||||
.o_attachments {
|
||||
display: flex !important;
|
||||
flex-wrap: wrap !important;
|
||||
gap: 12px !important;
|
||||
align-items: flex-start !important;
|
||||
|
||||
.o_attachment {
|
||||
width: 80px !important;
|
||||
height: 80px !important;
|
||||
margin: 0 !important;
|
||||
border-radius: 6px !important;
|
||||
overflow: hidden !important;
|
||||
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
|
||||
transition: all 0.2s ease !important;
|
||||
cursor: pointer !important;
|
||||
position: relative !important;
|
||||
border: 2px solid transparent !important;
|
||||
|
||||
&:hover {
|
||||
transform: scale(1.05) !important;
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
|
||||
border-color: #0077b6 !important;
|
||||
}
|
||||
|
||||
// Image preview thumbnail - clicking opens in new tab
|
||||
.o_image {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
object-fit: cover !important;
|
||||
}
|
||||
|
||||
// File icon for non-images
|
||||
.o_attachment_icon {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
display: flex !important;
|
||||
align-items: center !important;
|
||||
justify-content: center !important;
|
||||
background: #e9ecef !important;
|
||||
|
||||
i {
|
||||
font-size: 28px !important;
|
||||
color: #6c757d !important;
|
||||
}
|
||||
}
|
||||
|
||||
// Hide filename inside thumbnail
|
||||
.o_attachment_name {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
// Delete button styling
|
||||
.o_attachment_delete {
|
||||
position: absolute !important;
|
||||
top: 2px !important;
|
||||
right: 2px !important;
|
||||
background: rgba(220, 53, 69, 0.9) !important;
|
||||
color: white !important;
|
||||
border-radius: 50% !important;
|
||||
width: 18px !important;
|
||||
height: 18px !important;
|
||||
display: flex !important;
|
||||
align-items: center !important;
|
||||
justify-content: center !important;
|
||||
font-size: 10px !important;
|
||||
opacity: 0 !important;
|
||||
transition: opacity 0.2s !important;
|
||||
z-index: 5 !important;
|
||||
}
|
||||
|
||||
&:hover .o_attachment_delete {
|
||||
opacity: 1 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Upload button - inline compact style
|
||||
.o_attach,
|
||||
button.o_attach,
|
||||
.o_select_file_button {
|
||||
display: inline-flex !important;
|
||||
align-items: center !important;
|
||||
justify-content: center !important;
|
||||
gap: 4px !important;
|
||||
padding: 6px 12px !important;
|
||||
border: 1px solid #28a745 !important;
|
||||
border-radius: 4px !important;
|
||||
background: white !important;
|
||||
color: #28a745 !important;
|
||||
font-size: 12px !important;
|
||||
font-weight: 500 !important;
|
||||
cursor: pointer !important;
|
||||
transition: all 0.2s ease !important;
|
||||
height: auto !important;
|
||||
width: auto !important;
|
||||
min-height: 32px !important;
|
||||
margin-top: 4px !important;
|
||||
|
||||
&:hover {
|
||||
background: #28a745 !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
i, .fa {
|
||||
font-size: 12px !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fc-gallery-empty {
|
||||
padding: 16px;
|
||||
|
||||
.fa {
|
||||
color: #adb5bd;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Google Places Autocomplete dropdown - ensure it appears above Odoo modals
|
||||
.pac-container {
|
||||
z-index: 100000 !important;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user