feat(static-pages): live device preview (desktop/tablet/mobile)
Milestone 5 of the Static Pages Module sprint. - New StaticPagePreviewComponent: client-side, sanitized HTML preview at desktop/tablet(768px)/mobile(375px) widths, entirely without navigation or publish. Uses the same DomSanitizer.sanitize(SecurityContext.HTML, ...) pattern as the real storefront renderer (StaticPageComponent), so what authors preview here matches what will actually render live. - Wired into static-pages-editor as a per-page collapsible "Preview" toggle, showing the default-locale (or first available) translation's html/title. - i18n: staticPages.previewDesktop/Tablet/Mobile/Toggle in interface + en/ru/hy. Gate: tsc --noEmit, npm test (57/57), arch:check, build all green. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -78,6 +78,7 @@
|
||||
<app-button variant="ghost" size="sm" (click)="move(page.id, -1)">↑</app-button>
|
||||
<app-button variant="ghost" size="sm" (click)="move(page.id, 1)">↓</app-button>
|
||||
<app-button variant="secondary" size="sm" (click)="duplicatePage(page.id)">{{ 'staticPages.duplicatePage' | translate }}</app-button>
|
||||
<app-button variant="secondary" size="sm" (click)="togglePreview(page.id)">{{ 'staticPages.previewToggle' | translate }}</app-button>
|
||||
@if (page.status === 'published') {
|
||||
<app-button variant="secondary" size="sm" (click)="updatePage(page.id, { status: 'draft' })">{{ 'staticPages.unpublishPageAction' | translate }}</app-button>
|
||||
} @else {
|
||||
@@ -87,6 +88,10 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if (previewOpenPageId() === page.id) {
|
||||
<app-static-page-preview [html]="previewHtml(page)" [title]="previewTitle(page)" />
|
||||
}
|
||||
|
||||
<div class="editor-grid three">
|
||||
<app-form-field [label]="'builder.pageId' | translate" [error]="hasEmptyTitle(page) ? ('staticPages.emptyTitle' | translate) : null">
|
||||
<app-input [ngModel]="page.id" (ngModelChange)="updatePage(page.id, { id: $event })" />
|
||||
|
||||
Reference in New Issue
Block a user