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

feat(portal): card shells, KPI tiles, doc chips + rows

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 23ac3284cb
commit b3a86cd4b9
1 changed files with 161 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

161
fusion_plating/fusion_plating_portal/static/src/scss/fp_portal_cards.scss Normal file
View File

@@ -0,0 +1,161 @@
// ============================================================================
// Fusion Plating — Portal · Card shells + KPI tiles + doc chips
// ============================================================================
// Generic card shell
.o_fp_card {
background: $fp-card-bg;
border: 1px solid $fp-card-border;
border-radius: $fp-radius-card;
padding: $fp-space-5;
box-shadow: $fp-shadow-card;
}
.o_fp_card_compact {
@extend .o_fp_card;
padding: $fp-space-3 $fp-space-4;
border-radius: $fp-radius-tile;
}
.o_fp_card_hoverable {
transition: box-shadow .15s ease, transform .08s ease;
&:hover {
box-shadow: $fp-shadow-card-hover;
transform: translateY(-1px);
}
}
// KPI tile (the 4-tile strip across the top of the dashboard)
.o_fp_kpi_tile {
@extend .o_fp_card_compact;
.o_fp_kpi_label {
font-size: .66rem;
color: $fp-muted;
text-transform: uppercase;
letter-spacing: .05em;
font-weight: 600;
margin-bottom: .2rem;
}
.o_fp_kpi_value {
font-size: 1.5rem;
font-weight: 700;
color: $fp-text;
line-height: 1;
}
.o_fp_kpi_hint {
font-size: .7rem;
margin-top: .2rem;
color: $fp-muted;
display: block;
text-decoration: none;
&.o_fp_hint_action {
color: $fp-teal;
font-weight: 500;
}
&.o_fp_hint_success { color: $fp-success-text; font-weight: 500; }
&.o_fp_hint_warn { color: $fp-amber-text; font-weight: 500; }
}
// Highlighted KPI (the In-Flight Jobs hero metric)
&.o_fp_kpi_hero {
background: $fp-gradient-mint;
border-color: $fp-aqua;
.o_fp_kpi_label,
.o_fp_kpi_value {
color: $fp-teal-dark;
}
}
}
// Doc chip (compact attachment pill)
.o_fp_doc_chip {
display: inline-flex;
align-items: center;
gap: .35rem;
padding: .25rem .55rem;
background: $fp-section-bg;
color: $fp-teal;
border: 1px solid $fp-card-border;
border-radius: $fp-radius-chip;
font-size: .7rem;
font-weight: 500;
text-decoration: none;
&:hover {
background: $fp-mint;
color: $fp-teal-dark;
}
&.o_fp_doc_chip_pending {
background: $fp-card-bg;
color: $fp-muted-light;
border: 1px dashed $fp-card-border-dark;
cursor: default;
}
}
// Document row (used inside grouped doc panel)
.o_fp_doc_row {
display: flex;
align-items: center;
padding: .55rem .7rem;
background: $fp-page-bg;
border-radius: $fp-radius-chip;
margin-bottom: .4rem;
text-decoration: none;
transition: background .12s ease;
&:hover { background: $fp-section-bg; }
.o_fp_doc_icon {
width: 32px;
height: 32px;
border-radius: $fp-radius-icon;
display: inline-flex;
align-items: center;
justify-content: center;
font-size: .85rem;
margin-right: .7rem;
flex-shrink: 0;
}
.o_fp_doc_meta { flex: 1; min-width: 0; }
.o_fp_doc_name {
font-size: .84rem;
color: $fp-text;
font-weight: 500;
}
.o_fp_doc_sub {
font-size: .7rem;
color: $fp-muted-light;
}
.o_fp_doc_action {
color: $fp-teal;
font-size: .74rem;
text-decoration: none;
font-weight: 500;
padding: .25rem .5rem;
}
// Icon color variants — tint per doc category
.o_fp_doc_icon_input { background: #eff6ff; color: #1e40af; }
.o_fp_doc_icon_drawing { background: $fp-success-bg; color: $fp-success-text; }
.o_fp_doc_icon_spec { background: $fp-amber-bg; color: $fp-amber-text; }
.o_fp_doc_icon_quality { background: $fp-mint; color: $fp-teal-dark; }
.o_fp_doc_icon_shipping { background: $fp-mint-pastel; color: $fp-teal; }
.o_fp_doc_icon_pending { background: $fp-section-bg; color: $fp-muted-light; }
// Pending state for not-yet-generated docs
&.o_fp_doc_row_pending {
background: $fp-card-bg;
border: 1px dashed $fp-card-border;
opacity: .9;
cursor: default;
.o_fp_doc_name, .o_fp_doc_sub { color: $fp-muted-light; }
}
}
// Doc group label
.o_fp_doc_group_label {
font-size: .7rem;
color: $fp-muted;
text-transform: uppercase;
letter-spacing: .04em;
font-weight: 600;
margin-bottom: .45rem;
}