{{ 'theme.studio.badge' | translate }}

{{ draftTheme().meta.name }}

@if (llmGuideCopyMessage()) {
{{ llmGuideCopyMessage() }}
}
{{ 'theme.studio.workspace' | translate }} {{ activeWorkspaceInfo().label }}
{{ 'theme.studio.regions' | translate }} {{ mountedEntryCount() }}
{{ 'theme.studio.draft' | translate }} {{ (isDraftDirty() ? 'theme.studio.unsavedChanges' : 'theme.studio.inSync') | translate }}
@if (statusMessage()) {
{{ statusMessage() }}
} @if (!draftIsValid()) {

{{ 'theme.studio.invalidDraft' | translate }}

    @for (error of draftErrors(); track error) {
  • {{ error }}
    • }
}
@if (localizedSelectedElement(); as element) {
{{ element.label }} {{ element.key }} @if (selectedElement()!.container) { {{ selectedElement()!.container }} }

{{ element.description }}

}
@if (selectedElement()) {
@if (selectedElement()!.layoutEditable) { }
}
@if (selectedElementCapabilities().length > 0) {
@for (capability of selectedElementCapabilities(); track capability) { {{ capability }} }
}
@if (activeWorkspace() === 'editor') {

{{ (activeEditorTab() === 'cssOnly' ? 'theme.studio.cssOnlyTheme' : 'theme.studio.themeJson') | translate }}

@if (activeEditorTab() === 'cssOnly') {

{{ 'theme.studio.cssOnlyHint' | translate }}

}
{{ 'theme.studio.lines' | translate: { count: activeEditorTab() === 'cssOnly' ? cssOnlyText().split('\n').length : draftLineCount() } }} {{ 'theme.studio.chars' | translate: { count: activeEditorTab() === 'cssOnly' ? cssOnlyText().length : draftCharacterCount() } }} @if (activeEditorTab() === 'json') { {{ 'theme.studio.errors' | translate: { count: draftErrorCount() } }} } {{ 'theme.studio.ideEditor' | translate }}
@if (activeEditorTab() === 'json') { } @else { }
} @if (activeWorkspace() === 'inspector') {

{{ 'theme.studio.selection' | translate }}

@if (localizedSelectedElement(); as element) {

{{ element.label }}

{{ element.key }} @if (isMounted(selectedElement()!)) { {{ 'theme.studio.mountedNow' | translate }} }

{{ element.description }}

}

{{ 'theme.studio.editableAttributes' | translate }}

@for (field of visiblePropertyHints(); track field.key) { }

{{ 'theme.studio.animationKeys' | translate }}

@if (animationKeys().length > 0) {
@for (animationKey of animationKeys(); track animationKey) { }
} @else {
{{ 'theme.studio.noAnimationKeys' | translate }}
}
@for (field of THEME_ANIMATION_FIELDS; track field.key) { {{ field.key }} }
} @if (activeWorkspace() === 'layout') {

{{ 'theme.studio.layoutGrid' | translate }}

@for (container of layoutContainers; track container.key) { }
@if (selectedElementGrid()) {

x

{{ selectedElementGrid()!.grid.x }}

y

{{ selectedElementGrid()!.grid.y }}

w

{{ selectedElementGrid()!.grid.w }}

h

{{ selectedElementGrid()!.grid.h }}

}
}