2021-11-01 20:48:49 +03:00
|
|
|
<div class="flex flex-column h-100" {{css-transition "gh-nav-contextual"}} data-test-nav-menu="design" ...attributes>
|
2021-10-20 15:04:05 +03:00
|
|
|
<header class="gh-nav-header">
|
|
|
|
<LinkTo @route="settings" class="gh-nav-menu-back-button">{{svg-jar "arrow-left-small"}} Settings</LinkTo>
|
|
|
|
</header>
|
|
|
|
<section class="gh-nav-body gh-nav-design">
|
|
|
|
<div class="gh-nav-top" {{on "click" this.transitionBackToIndex}}>
|
|
|
|
<div class="gh-nav-list gh-nav-main">
|
|
|
|
<LinkTo @route="settings.design" class="gh-nav-menu-title" @current-when="settings.design.index" {{on "click" this.closeAllSections}}>Site design</LinkTo>
|
2021-10-22 14:02:46 +03:00
|
|
|
|
2021-10-20 15:04:05 +03:00
|
|
|
{{#let (eq this.openSection "brand") as |isOpen|}}
|
2021-11-01 20:48:49 +03:00
|
|
|
<button class="gh-nav-design-tab {{if isOpen "active"}}" type="button" {{on "click" (fn this.toggleSection "brand")}} data-test-nav-toggle="general">
|
|
|
|
{{svg-jar "paintbrush"}} Brand
|
2021-10-20 12:14:26 +03:00
|
|
|
<span class="gh-nav-button-expand">{{svg-jar (if isOpen "arrow-up-stroke" "arrow-down-stroke")}}</span>
|
2021-10-14 16:15:11 +03:00
|
|
|
</button>
|
2021-10-18 19:24:17 +03:00
|
|
|
{{#liquid-if isOpen}}
|
2021-11-01 20:48:49 +03:00
|
|
|
<div class="gh-nav-design-settings" data-test-nav-group="general">
|
2021-10-20 15:04:05 +03:00
|
|
|
<Settings::Design::GeneralSettingsForm
|
2021-10-14 16:15:11 +03:00
|
|
|
@updatePreview={{perform this.themeManagement.updatePreviewHtmlTask}}
|
|
|
|
/>
|
|
|
|
</div>
|
2021-10-18 19:24:17 +03:00
|
|
|
{{/liquid-if}}
|
2021-10-14 16:15:11 +03:00
|
|
|
{{/let}}
|
2021-10-20 15:04:05 +03:00
|
|
|
|
|
|
|
{{#each this.customThemeSettings.settingGroups as |group|}}
|
|
|
|
{{#let (eq this.openSection group.key) as |isOpen|}}
|
|
|
|
<button class="gh-nav-design-tab {{if isOpen "active"}}" type="button" {{on "click" (fn this.toggleSection group.key)}}>
|
|
|
|
{{svg-jar group.icon}} {{group.name}}
|
|
|
|
<span class="gh-nav-button-expand">{{svg-jar (if isOpen "arrow-up-stroke" "arrow-down-stroke")}}</span>
|
|
|
|
</button>
|
|
|
|
|
|
|
|
{{#liquid-if isOpen}}
|
2021-11-01 20:48:49 +03:00
|
|
|
<div class="gh-nav-design-settings" data-test-nav-group={{group.key}}>
|
2021-10-20 15:04:05 +03:00
|
|
|
<Settings::Design::ThemeSettingsForm
|
|
|
|
@themeSettings={{group.settings}}
|
|
|
|
@updatePreview={{perform this.themeManagement.updatePreviewHtmlTask}}
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
{{/liquid-if}}
|
|
|
|
{{/let}}
|
|
|
|
{{/each}}
|
|
|
|
</div>
|
2021-10-12 15:30:12 +03:00
|
|
|
</div>
|
2021-10-11 17:24:46 +03:00
|
|
|
|
2021-10-20 15:04:05 +03:00
|
|
|
<div class="gh-nav-bottom">
|
2021-10-27 17:16:21 +03:00
|
|
|
<div class="gh-change-theme">
|
2021-11-01 20:48:49 +03:00
|
|
|
<LinkTo class="gh-nav-design-tab" @route="settings.design.change-theme" {{on "click" this.closeAllSections}} data-test-nav="change-theme">
|
2021-10-27 17:16:21 +03:00
|
|
|
<div>
|
|
|
|
<span>Change theme</span>
|
2021-11-01 20:48:49 +03:00
|
|
|
<span class="active-theme" data-test-text="current-theme">Current: {{this.activeTheme.name}}{{#if this.activeTheme.package.version}} - v{{this.activeTheme.package.version}}{{/if}}</span>
|
2021-10-27 17:16:21 +03:00
|
|
|
</div>
|
|
|
|
<div class="gh-nav-design-tabicon">{{svg-jar "sync"}}</div>
|
|
|
|
</LinkTo>
|
|
|
|
</div>
|
2021-10-20 15:04:05 +03:00
|
|
|
</div>
|
|
|
|
</section>
|
|
|
|
</div>
|