refactor: marketplace release polish
Sprint 28, scoped to admin/* (user decision — full marketplace audit declined in favor of a bounded pass over the 8 admin features from Sprints 20-27). - a11y: aria-label added to every bare <select> not already inside a <label> across categories/products/orders/transactions/users/monitoring - loading states: app-skeleton rows/cards added to list pages that previously rendered blank during the initial fetch (categories, orders, transactions, users, monitoring's event feed, analytics summary cards) - admin-dashboard-card's custom shimmer CSS replaced with the shared SkeletonComponent (same visual result, one less duplicated animation) - bundle-size budget warning (~198kB over) confirmed pre-existing — present at Sprint 20's first build before any admin/* code existed, and new admin pages are all lazy-loaded — documented as out of scope for this pass rather than chased docs/ADMIN.md + docs/SPRINT-PLAN.md updated with the scope decision and what was explicitly not done (Lighthouse, animations, SEO/sitemap, storefront/editor a11y). Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
@@ -6,7 +6,7 @@
|
||||
|
||||
<div class="dashboard-card__body">
|
||||
<ng-container [ngSwitch]="status">
|
||||
<div class="dashboard-card__skeleton" *ngSwitchCase="'loading'"></div>
|
||||
<app-skeleton *ngSwitchCase="'loading'" shape="rect" height="24px" width="60%" />
|
||||
|
||||
<p class="dashboard-card__muted" *ngSwitchCase="'empty'">{{ 'dashboard.stateEmpty' | translate }}</p>
|
||||
|
||||
|
||||
@@ -68,16 +68,3 @@
|
||||
color: var(--error-color, #ef4444);
|
||||
}
|
||||
|
||||
.dashboard-card__skeleton {
|
||||
height: 24px;
|
||||
width: 60%;
|
||||
border-radius: var(--radius-sm, 8px);
|
||||
background: linear-gradient(90deg, var(--bg-secondary, #f5f5f5) 25%, var(--bg-tertiary, #f0f0f0) 37%, var(--bg-secondary, #f5f5f5) 63%);
|
||||
background-size: 400% 100%;
|
||||
animation: dashboard-card-shimmer 1.4s ease infinite;
|
||||
}
|
||||
|
||||
@keyframes dashboard-card-shimmer {
|
||||
0% { background-position: 100% 50%; }
|
||||
100% { background-position: 0 50%; }
|
||||
}
|
||||
|
||||
@@ -2,11 +2,12 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { TranslatePipe } from '../../../../i18n/translate.pipe';
|
||||
import { AdminDashboardCardStatus } from '../models/admin-dashboard.model';
|
||||
import { SkeletonComponent } from '../../../../shared/ui/skeleton/skeleton.component';
|
||||
|
||||
@Component({
|
||||
selector: 'app-admin-dashboard-card',
|
||||
standalone: true,
|
||||
imports: [CommonModule, TranslatePipe],
|
||||
imports: [CommonModule, TranslatePipe, SkeletonComponent],
|
||||
templateUrl: './admin-dashboard-card.component.html',
|
||||
styleUrls: ['./admin-dashboard-card.component.scss'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
|
||||
Reference in New Issue
Block a user