This commit is contained in:
gsinghpal
2026-04-12 09:09:50 -04:00
parent d07159b9b5
commit be611876ad
470 changed files with 41761 additions and 51 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 26 KiB

View File

@@ -0,0 +1,173 @@
// =============================================================================
// Fusion Plating — backend styles
// Copyright 2026 Nexa Systems Inc.
// License OPL-1 (Odoo Proprietary License v1.0)
//
// THEME AWARENESS
// ---------------
// This file NEVER hardcodes backgrounds or text colours. All surface colours
// come from Odoo / Bootstrap CSS custom properties so the component renders
// correctly in BOTH light and dark mode without any duplication:
//
// background: var(--bs-body-bg) // main surface
// surface: var(--o-view-background-color) // view canvas
// foreground: var(--bs-body-color) // main text
// muted text: var(--bs-secondary-color)
// border: var(--bs-border-color)
// primary: var(--o-action) // Odoo action/brand
//
// Semantic status colours (green / amber / red) use `color-mix()` against the
// Bootstrap theme token so a green badge is darker on light mode and brighter
// on dark mode automatically — one rule, two looks.
//
// We never target `.o_dark`, `html.dark`, or `@media (prefers-color-scheme)`
// to override colours. If you find yourself needing that, it's a smell — use
// a variable instead.
// =============================================================================
// -----------------------------------------------------------------------------
// Local helpers
// -----------------------------------------------------------------------------
// `color-mix()` lets us tint a semantic colour against the surface, so the
// result adapts to light or dark backgrounds automatically.
@mixin fp-tint($color-var, $amount: 12%) {
background-color: color-mix(in srgb, var(#{$color-var}) #{$amount}, transparent);
color: var(#{$color-var});
border: 1px solid color-mix(in srgb, var(#{$color-var}) 35%, transparent);
}
// -----------------------------------------------------------------------------
// Generic card surface used in kanban views (facility, tank, bath)
// -----------------------------------------------------------------------------
.o_fp_card {
background-color: var(--o-view-background-color, var(--bs-body-bg));
color: var(--bs-body-color);
border: 1px solid var(--bs-border-color);
border-radius: 10px;
padding: 12px 14px;
transition: border-color 120ms ease, box-shadow 120ms ease;
&:hover {
border-color: color-mix(in srgb, var(--o-action) 50%, var(--bs-border-color));
box-shadow: 0 2px 8px color-mix(in srgb, var(--bs-body-color) 8%, transparent);
}
.o_fp_card_title {
color: var(--bs-body-color);
font-size: 1rem;
line-height: 1.2;
}
.o_fp_card_stats {
color: var(--bs-body-color);
.text-muted,
.text-muted * {
color: var(--bs-secondary-color) !important;
}
}
}
// -----------------------------------------------------------------------------
// Tank kanban — state badge theming
// -----------------------------------------------------------------------------
.o_fp_tank_kanban {
.o_fp_tank_card {
// Let the left-border carry the state — subtle, theme-aware.
border-left-width: 4px;
&[data-state="empty"],
&[data-state="out_of_service"] {
border-left-color: var(--bs-secondary-color);
}
&[data-state="filled"] {
border-left-color: var(--bs-info, var(--o-action));
}
&[data-state="in_use"] {
border-left-color: var(--bs-success);
}
&[data-state="draining"],
&[data-state="maintenance"] {
border-left-color: var(--bs-warning);
}
}
.o_fp_badge {
padding: 2px 8px;
font-size: 0.72rem;
font-weight: 500;
text-transform: uppercase;
letter-spacing: 0.02em;
border-radius: 999px;
&[data-state="empty"],
&[data-state="out_of_service"] {
@include fp-tint(--bs-secondary-color);
}
&[data-state="filled"] {
@include fp-tint(--bs-info);
}
&[data-state="in_use"] {
@include fp-tint(--bs-success);
}
&[data-state="draining"],
&[data-state="maintenance"] {
@include fp-tint(--bs-warning);
}
}
}
// -----------------------------------------------------------------------------
// Bath kanban — chemistry health dot
// -----------------------------------------------------------------------------
.o_fp_bath_kanban {
.o_fp_bath_card {
// A single left-border tint conveys chemistry health without colouring
// the entire card.
border-left-width: 4px;
border-left-color: var(--bs-success);
&[data-log-status="warning"] {
border-left-color: var(--bs-warning);
}
&[data-log-status="out_of_spec"] {
border-left-color: var(--bs-danger);
}
}
.o_fp_health_dot {
display: inline-block;
width: 10px;
height: 10px;
border-radius: 50%;
background-color: var(--bs-success);
box-shadow: 0 0 0 2px color-mix(in srgb, var(--bs-success) 25%, transparent);
&[data-status="warning"] {
background-color: var(--bs-warning);
box-shadow: 0 0 0 2px color-mix(in srgb, var(--bs-warning) 25%, transparent);
}
&[data-status="out_of_spec"] {
background-color: var(--bs-danger);
box-shadow: 0 0 0 2px color-mix(in srgb, var(--bs-danger) 25%, transparent);
}
}
}
// -----------------------------------------------------------------------------
// Facility kanban — stat strip spacing
// -----------------------------------------------------------------------------
.o_fp_facility_kanban {
.o_fp_card_stats {
padding-top: 8px;
border-top: 1px dashed var(--bs-border-color);
}
}