Ghost/ghost/admin/app/components/gh-theme-table.hbs
Kevin Ansfield 5a8753fb8f Added ability to install free themes directly from GitHub (#1837)
refs https://github.com/TryGhost/Ghost/issues/12608
requires https://github.com/TryGhost/Ghost/pull/12635

- adds `/settings/themes/install` route with `source` and `ref` query params that match the API. Shows a confirmation modal when accessed asking to confirm installation and activation
  - does not allow Casper to be installed
  - warns if installing the theme will overwrite an existing one
  - follows similar process to zip uploads for error handling
- adds install/preview links for Massively in the free themes showcase

Co-authored-by: Sanne de Vries <sannedv@protonmail.com>
2021-02-12 09:19:25 +00:00

46 lines
2.2 KiB
Handlebars

<div class="apps-grid" data-test-themes-list>
{{#if this.sortedThemes}}
{{#each this.sortedThemes as |theme|}}
<div class="apps-grid-cell" data-test-theme-id="{{theme.name}}" data-test-theme-active="{{theme.active}}">
<div class="apps-card-app {{if theme.active "theme-list-item--active"}}">
<div class="apps-card-left">
<div class="apps-card-meta">
<h3 class="apps-card-app-title" data-test-theme-title>{{theme.label}}</h3>
<p class="apps-card-app-desc" data-test-theme-description><span class="description">Version {{theme.version}}</span></p>
</div>
</div>
<div class="apps-card-right">
<div class="apps-configured">
{{!--Delete--}}
{{#if theme.isDeletable}}
<a href="#" {{action this.deleteTheme theme}} disabled={{theme.active}} class="apps-configured-action darkgrey red-hover red-bg-hover" data-test-theme-delete-button>Delete</a>
{{/if}}
{{!--Download--}}
<a href="#" {{action this.downloadTheme theme}} class="apps-configured-action darkgrey darkgrey-hover lightgrey-bg-hover" data-test-theme-download-button>Download</a>
{{!--Active Label / Activate Button--}}
{{#if theme.active}}
<span class="gh-badge gh-badge-black apps-configured-action" data-test-theme-badge>Active</span>
{{else}}
<a href="#" {{action this.activateTheme theme.model}} class="apps-configured-action darkgrey apps-configured-action-activate green-hover green-bg-hover" data-test-theme-activate-button>
Activate
</a>
{{/if}}
</div>
</div>
</div>
</div>
{{/each}}
{{else}}
<div class="apps-card-app">
<div class="apps-card-left">
<div class="apps-card-meta">
<h3 class="apps-card-app-title">No themes found</h3>
<p class="apps-card-app-desc"><span class="description">Please upload a theme to continue</span></p>
</div>
</div>
</div>
{{/if}}
</div>