Ghost/ghost/admin/app/templates/settings/integrations/unsplash.hbs

67 lines
3.2 KiB
Handlebars
Raw Normal View History

<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>
<LinkTo @route="settings.integrations" data-test-link="integrations-back">Integrations</LinkTo>
<span>{{svg-jar "arrow-right"}}</span>
Unsplash
</h2>
<section class="view-actions">
<GhTaskButton @task={{this.saveTask}} @class="gh-btn gh-btn-primary gh-btn-icon" data-test-save-button={{true}} />
</section>
</GhCanvasHeader>
{{#if this.showLeaveSettingsModal}}
<GhFullscreenModal @modal="leave-settings"
@confirm={{action "leaveSettings"}}
@close={{action "toggleLeaveSettingsModal"}}
@modifier="action wide" />
{{/if}}
<section class="view-container">
<section class="gh-main-section bt app-grid">
<div class="gh-main-section-block app-detail-heading app-grid">
<div class="app-cell">
<img class="app-icon pa2 id-unsplash" src="assets/icons/unsplash.svg" />
</div>
<div class="app-cell">
<h3>Unsplash</h3>
<p>Beautiful, free photos</p>
</div>
</div>
</section>
<section class="gh-main-section">
<h4 class="gh-main-section-header small bn">Unsplash configuration</h4>
<div class="gh-main-section-block">
<div class="gh-main-section-content grey">
<div class="gh-setting-first gh-setting-last" id="unsplash-toggle">
<div class="gh-setting-content">
<div class="gh-setting-title">Enable Unsplash</div>
<div class="gh-setting-desc mb0">Enable <a href="https://unsplash.com" target="_blank" rel="noopener noreferrer">Unsplash</a> image integration for your posts</div>
</div>
<div class="gh-setting-action">
<div class="form-group right gh-setting-unsplash-checkbox">
<div class="for-checkbox">
<label for="unsplash" class="checkbox">
<input
type="checkbox"
checked={{this.settings.unsplash}}
id="unsplash"
name="unsplash"
onclick={{action "update" value="target.checked"}}
data-test-unsplash-checkbox
>
<span class="input-toggle-component"></span>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</section>
</section>