perf(app): remove confirmed-dead global CSS classes

RC PERF-01 asset audit (images/fonts/SVG/CSS), follow-up to 61a5714/4bf0666.

Removed from src/styles.scss - zero references (literal and hyphen-safe)
in any .html/.ts across the repo, and no dynamic class-string construction
found for the utility classes:
- .btn-primary / .btn-secondary (+ :hover) - unused button variants
- .catalog-product-card - unused selector in a shared comma group with
  .product-card/.item-card, which stay
- .item-badges-overlay, .item-simple-desc - unused component helpers
- .text-center, .mt-1..4, .mb-1..4, .p-1..4 - fully unused spacing utilities

styles-*.css: 9.60 kB -> 8.41 kB raw (2.22 kB -> 1.99 kB transfer), -12%.

No other category needed a code change:
- Images: <img> tags already have loading="lazy"/decoding="async" on
  storefront grids/galleries (product-card, catalog, category-grid,
  cart, item-detail) from prior polish passes; CLS is already handled
  via CSS aspect-ratio on those containers rather than width/height
  attrs, so none were added. Payment-logo <img>s already have explicit
  width/height. Flagged, not fixed: a handful of single-image admin/
  editor previews (page-editor, brand-overview, asset-details-drawer)
  lack loading="lazy" - low traffic, negligible impact, left alone to
  avoid unnecessary diff.
- Fonts: index.html preconnects to fonts.gstatic.com/googleapis.com and
  loads DM Sans 400/500/600/700 via Google Fonts CSS2 (display=swap
  already in the URL). All 4 loaded weights are used in app CSS - no
  dead weight to drop. Flagged, not fixed: 800/900 are used in several
  component styles but never loaded, so the browser faux-bolds those -
  a pre-existing rendering quirk, out of scope (changing loaded weights
  risks visible text changes).
- SVG: icon-registry.ts centralizes all icons via @lucide/angular (no
  inline SVG path duplication). Checked SVGs under public/ for editor
  cruft (metadata/inkscape/sodipodi comments) - found none, already
  clean. Flagged, not fixed: mastercard-logo.min.svg, dexar-logo*.svg,
  dexar-favicon.svg, novo-logo.svg, novo-favicon.svg appear unreferenced
  in src/public manifests - left in place since deletion is out of this
  task's scope and they may be used by backend-driven tenant branding.

Verified: npx tsc --noEmit clean, npm run build green (initial bundle
unchanged at 1.12 MB, this pass only touched global CSS).
This commit is contained in:
sdarbinyan
2026-07-24 08:26:31 +04:00
parent 4bf0666fd1
commit 2e931bbdc4

View File

@@ -306,14 +306,12 @@ details[open] > summary::after {
}
.product-card,
.item-card,
.catalog-product-card {
.item-card {
transition: transform var(--transition-normal), box-shadow var(--transition-normal);
}
.product-card:hover,
.item-card:hover,
.catalog-product-card:hover {
.item-card:hover {
transform: translateY(-2px) scale(1.01);
}
@@ -337,28 +335,6 @@ details[open] > summary::after {
transform: translateY(-1px);
}
.btn-primary {
background: var(--primary-color);
color: #fff;
border-color: var(--primary-color);
}
.btn-primary:hover {
background: var(--primary-hover);
border-color: var(--primary-hover);
}
.btn-secondary {
background: var(--secondary-color);
color: #fff;
border-color: var(--secondary-color);
}
.btn-secondary:hover {
background: var(--secondary-hover);
border-color: var(--secondary-hover);
}
.btn-ghost {
background: transparent;
color: var(--text-primary);
@@ -414,37 +390,8 @@ details[open] > summary::after {
}
}
.text-center {
text-align: center;
}
.mt-1 { margin-top: var(--space-sm); }
.mt-2 { margin-top: var(--space-md); }
.mt-3 { margin-top: var(--space-lg); }
.mt-4 { margin-top: var(--space-xl); }
.mb-1 { margin-bottom: var(--space-sm); }
.mb-2 { margin-bottom: var(--space-md); }
.mb-3 { margin-bottom: var(--space-lg); }
.mb-4 { margin-bottom: var(--space-xl); }
.p-1 { padding: var(--space-sm); }
.p-2 { padding: var(--space-md); }
.p-3 { padding: var(--space-lg); }
.p-4 { padding: var(--space-xl); }
// ─── Shared Badge & Tag Styles (from backOffice integration) ───
.item-badges-overlay {
position: absolute;
top: 8px;
left: 8px;
display: flex;
flex-wrap: wrap;
gap: 4px;
z-index: 2;
}
.item-badge {
display: inline-block;
padding: 2px var(--space-xs);
@@ -476,18 +423,3 @@ details[open] > summary::after {
border: 1px solid rgba(73, 118, 113, 0.15);
}
.item-simple-desc {
font-size: var(--font-size-sm);
color: var(--text-secondary);
line-height: var(--line-height-normal);
margin: 2px 0 4px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
line-clamp: 2;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}