mirror of
https://github.com/TryGhost/Ghost.git
synced 2024-12-23 19:02:29 +03:00
e9e169fdfc
No ref - Moved from 5-column to 4-column grid - Moved Marketplace link out of the grid - Improved hover animation
103 lines
4.3 KiB
Handlebars
103 lines
4.3 KiB
Handlebars
<section class="gh-canvas">
|
|
<GhCanvasHeader class="gh-canvas-header">
|
|
<h2 class="gh-canvas-title" data-test-screen-title>
|
|
<LinkTo @route="settings">Settings</LinkTo>
|
|
<span>{{svg-jar "arrow-right"}}</span>
|
|
Theme
|
|
</h2>
|
|
</GhCanvasHeader>
|
|
|
|
{{#if this.showLeaveSettingsModal}}
|
|
<GhFullscreenModal @modal="leave-settings"
|
|
@confirm={{action "leaveSettings"}}
|
|
@close={{action "toggleLeaveSettingsModal"}}
|
|
@modifier="action wide" />
|
|
{{/if}}
|
|
|
|
<section class="view-container">
|
|
<div class="gh-setting-header gh-first-header flex justify-between">
|
|
<span>Ghost theme directory</span>
|
|
<a href="https://ghost.org/marketplace/" target="_blank" rel="noopener noreferrer" class="gh-td-marketplace">
|
|
<span>View more {{svg-jar "arrow-right-small"}}</span>
|
|
</a>
|
|
</div>
|
|
<div class="gh-theme-directory-container">
|
|
<div class="theme-directory">
|
|
{{#each this.marketplaceThemes as |theme|}}
|
|
<a class="td-item" href={{theme.url}} target="_blank" rel="noopener noreferrer">
|
|
<div class="td-item-screenshot relative">
|
|
<img style="object-fit:contain;" src={{theme.image}} alt="{{theme.name}} Theme" />
|
|
<div class="td-item-overlay">
|
|
<LinkTo class="td-item-action gh-btn gh-btn-black mb4" @route="settings.theme.install" @query={{hash source="github" ref=theme.ref}}><span>Install</span></LinkTo>
|
|
<a href={{theme.previewUrl}} class="td-item-action gh-btn" target="_blank" rel="noopener"><span>Preview</span></a>
|
|
</div>
|
|
</div>
|
|
<div class="td-item-desc">
|
|
<div>{{theme.name}}</div>
|
|
<span>• {{theme.category}}</span>
|
|
</div>
|
|
</a>
|
|
{{/each}}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="gh-setting-header">Installed Themes</div>
|
|
<div class="gh-themes-container">
|
|
|
|
<GhThemeTable
|
|
@themes={{this.themes}}
|
|
@activateTheme={{action "activateTheme"}}
|
|
@downloadTheme={{action "downloadTheme"}}
|
|
@deleteTheme={{action "deleteTheme"}} />
|
|
|
|
<div class="flex justify-between mt6">
|
|
<LinkTo id="upload-theme" @route="settings.theme.uploadtheme" class="gh-btn gh-btn-green" data-test-button="uploadtheme">
|
|
<span>Upload a theme</span>
|
|
</LinkTo>
|
|
|
|
<a href="https://ghost.org/docs/themes/" target=_"blank" rel="noopener noreferrer" class="gh-btn gh-btn-outline">
|
|
<span>Theme developer docs</span>
|
|
</a>
|
|
</div>
|
|
|
|
|
|
{{#if this.showDeleteThemeModal}}
|
|
<GhFullscreenModal @modal="delete-theme"
|
|
@model={{hash
|
|
theme=this.themeToDelete
|
|
download=(action "downloadTheme" this.themeToDelete)
|
|
}}
|
|
@close={{action "hideDeleteThemeModal"}}
|
|
@confirm={{action "deleteTheme"}}
|
|
@modifier="action wide" />
|
|
{{/if}}
|
|
|
|
{{#if this.showThemeWarningsModal}}
|
|
<GhFullscreenModal @modal="theme-warnings"
|
|
@model={{hash
|
|
title="Activation successful"
|
|
warnings=this.themeWarnings
|
|
errors=this.themeErrors
|
|
canActivate=true
|
|
}}
|
|
@close={{action "hideThemeWarningsModal"}}
|
|
@modifier="action wide" />
|
|
{{/if}}
|
|
|
|
{{#if this.showThemeErrorsModal}}
|
|
<GhFullscreenModal @modal="theme-warnings"
|
|
@model={{hash
|
|
title="Activation failed"
|
|
errors=this.themeErrors
|
|
fatalErrors=this.themeFatalErrors
|
|
canActivate=false
|
|
}}
|
|
@close={{action "hideThemeWarningsModal"}}
|
|
@modifier="action wide" />
|
|
{{/if}}
|
|
</div>
|
|
|
|
</section>
|
|
</section>
|
|
|
|
{{outlet}} |