admin/Odoo-Modules
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(portal): status badge pills with dot + glow halo

Browse Source 
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
gsinghpal
2026-05-17 02:40:03 -04:00
parent 83c2b42aad
commit 23ac3284cb
1 changed files with 65 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
fusion_plating/fusion_plating_portal/static/src/scss/fp_portal_badges.scss Normal file
View File

@@ -0,0 +1,65 @@
// ============================================================================
// Fusion Plating — Portal · Status badges
// Pill with coloured dot + soft glow halo. Maps directly to fp.portal.job.state
// (and similar enum fields on quote / invoice / delivery).
// ============================================================================
.o_fp_badge {
display: inline-flex;
align-items: center;
gap: .4rem;
padding: .25rem .7rem;
border-radius: $fp-radius-pill;
font-family: $fp-font;
font-size: .7rem;
font-weight: 600;
line-height: 1.1;
white-space: nowrap;
.o_fp_badge_dot {
width: 7px;
height: 7px;
border-radius: $fp-radius-pill;
flex-shrink: 0;
}
}
// State mapping — extend with `class="o_fp_badge o_fp_badge_<state>"`.
.o_fp_badge_received,
.o_fp_badge_new {
background: $fp-section-bg;
color: $fp-text-body;
.o_fp_badge_dot { background: $fp-muted; }
}
.o_fp_badge_in_progress,
.o_fp_badge_quoted {
background: $fp-mint;
color: $fp-teal-dark;
.o_fp_badge_dot { background: $fp-teal; box-shadow: 0 0 0 3px rgba(26, 107, 89, .18); }
}
.o_fp_badge_quality_check,
.o_fp_badge_under_review {
background: $fp-amber-bg;
color: $fp-amber-text;
.o_fp_badge_dot { background: $fp-amber; box-shadow: 0 0 0 3px rgba(245, 158, 11, .18); }
}
.o_fp_badge_ready_to_ship,
.o_fp_badge_accepted,
.o_fp_badge_paid {
background: $fp-success-bg;
color: $fp-success-text;
.o_fp_badge_dot { background: $fp-success; }
}
.o_fp_badge_shipped,
.o_fp_badge_complete {
background: $fp-success-bg;
color: $fp-success-text;
.o_fp_badge_dot { background: $fp-success; }
}
.o_fp_badge_declined,
.o_fp_badge_overdue,
.o_fp_badge_hold {
background: $fp-danger-bg;
color: $fp-danger-dark;
.o_fp_badge_dot { background: $fp-danger; }
}