Ghost/ghost/admin/app/templates/settings/design.hbs
Kevin Ansfield 73daa80b7f Migrate to latest ember, ember-mocha and modern ember testing (#1044)
no issue
- upgrade to latest `ember-source` and related dependencies including `ember-cli`
- upgrade to latest `ember-mocha` and modern ember testing setup
    - https://github.com/emberjs/rfcs/blob/master/text/0268-acceptance-testing-refactor.md
    - switch from using global acceptance test helpers and `native-dom-helpers` to using the new `ember-test-helpers` methods
    - use [`chai-dom`](https://github.com/nathanboktae/chai-dom) assertions where in some places (still a lot of places in the tests that could use these)
- pin `ember-in-viewport` to 3.0.x to work around incompatibilities between different versions used in `ember-light-table`, `ember-infinity`, and `ember-sticky-element`
    - incompatibilities manifested as "Invalid value used as weak map key" errors thrown when using `ember-light-table` (subscribers screen)
- pin `ember-power-datepicker` to unreleased version that contains a move from global acceptance test helpers to modern test helpers
2019-01-02 09:58:55 +00:00

186 lines
8.5 KiB
Handlebars

<section class="gh-canvas">
<header class="gh-canvas-header">
<h2 class="gh-canvas-title" data-test-screen-title>Design</h2>
<section class="view-actions">
{{gh-task-button task=save class="gh-btn gh-btn-blue gh-btn-icon" data-test-save-button=true}}
</section>
</header>
{{#if showLeaveSettingsModal}}
{{gh-fullscreen-modal "leave-settings"
confirm=(action "leaveSettings")
close=(action "toggleLeaveSettingsModal")
modifier="action wide"}}
{{/if}}
<section class="view-container">
<div class="gh-setting-header">Navigation</div>
<div class="gh-blognav-container">
<form id="settings-navigation" class="gh-blognav" novalidate="novalidate">
{{#sortable-objects sortableObjectList=settings.navigation useSwap=false}}
{{#each settings.navigation as |navItem index|}}
{{#draggable-object content=navItem dragHandle=".gh-blognav-grab" isSortable=true}}
{{gh-navitem
navItem=navItem
baseUrl=blogUrl
addItem=(action "addNavItem")
deleteItem=(action "deleteNavItem")
updateUrl=(action "updateUrl")
updateLabel=(action "updateLabel")
data-test-navitem=index}}
{{/draggable-object}}
{{/each}}
{{/sortable-objects}}
{{gh-navitem
navItem=newNavItem
baseUrl=blogUrl
addItem=(action "addNavItem")
updateUrl=(action "updateUrl")
data-test-navitem="new"}}
</form>
</div>
<div class="gh-setting-header">Theme Directory</div>
<div class="gh-theme-directory-container">
<div class="theme-directory">
<a class="td-item" href="https://github.com/TryGhost/Massively" target="_blank" rel="noopener noreferrer">
<div class="td-item-screenshot">
<img style="object-fit:contain;" src="assets/img/themes/massively.jpg" alt="Massively Theme" />
</div>
<div class="td-item-desc">
<div>Massively <span>— Free</span></div>
</div>
</a>
<a class="td-item" href="https://themeforest.net/item/nurui-multipurpose-ghost-blog-theme/22243886" target="_blank" rel="noopener noreferrer">
<div class="td-item-screenshot">
<img style="object-fit:contain;" src="assets/img/themes/nurui.jpg" alt="Nurui Theme" />
</div>
<div class="td-item-desc">
<div>Nurui <span>— Premium</span></div>
</div>
</a>
<a class="td-item" href="https://themeforest.net/item/pacific-big-bold-photographydriven-theme/19774541" target="_blank" rel="noopener noreferrer">
<div class="td-item-screenshot">
<img style="object-fit:contain;" src="assets/img/themes/pacific.jpg" alt="Pacific Theme" />
</div>
<div class="td-item-desc">
<div>Pacific <span>— Premium</span></div>
</div>
</a>
<a class="td-item" href="https://www.hauntedthemes.com/" target="_blank" rel="noopener noreferrer">
<div class="td-item-screenshot">
<img style="object-fit:contain;" src="assets/img/themes/farafra.jpg" alt="Farafra Theme" />
</div>
<div class="td-item-desc">
<div>Farafra <span>— Premium</span></div>
</div>
</a>
<a class="td-item" href="https://themeforest.net/item/valkyrie-a-highly-visual-ghost-blog/22576630" target="_blank" rel="noopener noreferrer">
<div class="td-item-screenshot">
<img style="object-fit:contain;" src="assets/img/themes/valkyrie.jpg" alt="Valkyrie Theme" />
</div>
<div class="td-item-desc">
<div>Valkyrie <span>— Premium</span></div>
</div>
</a>
<a class="td-item" href="https://themeforest.net/item/sente-magazine-ghost-blog-theme/21019644" target="_blank" rel="noopener noreferrer">
<div class="td-item-screenshot">
<img style="object-fit:contain;" src="assets/img/themes/sente.jpg" alt="Sente Theme" />
</div>
<div class="td-item-desc">
<div>Sente <span>— Premium</span></div>
</div>
</a>
</div>
<div class="td-cta">
<a class="td-cta-box td-cta-marketplace" href="https://marketplace.ghost.org" target="_blank" rel="noopener">
<div class="td-cta-icon">{{svg-jar "store"}}</div>
<div class="td-cta-content-wrapper">
<div class="td-cta-content">
<h4>Theme Marketplace</h4>
<p>Explore a huge range of free and premium themes for Ghost with a range of design and layout options</p>
</div>
<div class="td-cta-arrow">
{{svg-jar "arrow-right"}}
</div>
</div>
</a>
<a class="td-cta-box td-cta-docs" href="https://docs.ghost.org/api/handlebars-themes/" target="_blank" rel="noopener">
<div class="td-cta-icon">{{svg-jar "book-open"}}</div>
<div class="td-cta-content-wrapper">
<div class="td-cta-content">
<h4>Developer Docs</h4>
<p>Build your own custom Ghost theme from scratch using our comprehensive Handlebars.js SDK</p>
</div>
<div class="td-cta-arrow">
{{svg-jar "arrow-right"}}
</div>
</div>
</a>
</div>
</div>
<div class="gh-setting-header">Installed Themes</div>
<div class="gh-themes-container">
{{gh-theme-table
themes=themes
activateTheme=(action "activateTheme")
downloadTheme=(action "downloadTheme")
deleteTheme=(action "deleteTheme")}}
{{#link-to "settings.design.uploadtheme" class="gh-btn gh-btn-green gh-themes-uploadbtn" data-test-upload-theme-button=true}}
<span>Upload a theme</span>
{{/link-to}}
{{#if showDeleteThemeModal}}
{{gh-fullscreen-modal "delete-theme"
model=(hash
theme=themeToDelete
download=(action "downloadTheme" themeToDelete)
)
close=(action "hideDeleteThemeModal")
confirm=(action "deleteTheme")
modifier="action wide"}}
{{/if}}
{{#if showThemeWarningsModal}}
{{gh-fullscreen-modal "theme-warnings"
model=(hash
title="Activation successful"
warnings=themeWarnings
errors=themeErrors
message=message
canActivate=true
)
close=(action "hideThemeWarningsModal")
modifier="action wide"}}
{{/if}}
{{#if showThemeErrorsModal}}
{{gh-fullscreen-modal "theme-warnings"
model=(hash
title="Activation failed"
errors=themeErrors
fatalErrors=themeFatalErrors
canActivate=false
)
close=(action "hideThemeWarningsModal")
modifier="action wide"}}
{{/if}}
</div>
</section>
</section>
{{outlet}}
{{gh-tour-item "upload-a-theme"
target=".gh-themes-uploadbtn"
throbberAttachment="top middle"
popoverTriangleClass="bottom"
}}