mirror of
https://github.com/TryGhost/Ghost.git
synced 2024-12-27 12:53:13 +03:00
721d7202a0
no issue Added truncation to custom theme setting description to prevent overly long custom setting descriptions from diminishing the settings UX
38 lines
2.2 KiB
Handlebars
38 lines
2.2 KiB
Handlebars
<div class="gh-stack-item {{if (eq @index 0) "gh-setting-first" "gh-setting"}}">
|
|
<GhUploader
|
|
@extensions={{this.imageExtensions}}
|
|
@onComplete={{this.imageUploaded}}
|
|
as |uploader|
|
|
>
|
|
<div class="{{if @setting.value "" "flex flex-grow-1 items-center justify-between"}}">
|
|
<div class="gh-setting-content">
|
|
<div class="gh-setting-title mb0 {{if @setting.value "gh-theme-setting-title"}}">{{humanize-setting-key @setting.key}}</div>
|
|
{{#each uploader.errors as |error|}}
|
|
<div class="gh-setting-error" data-test-error="icon">{{or error.context error.message}}</div>
|
|
{{/each}}
|
|
{{#if @setting.description}}
|
|
<div class="gh-setting-desc" style="margin-top: 8px">{{truncate @setting.description 100}}</div>
|
|
{{/if}}
|
|
</div>
|
|
<div class="gh-setting-action gh-uploadbutton-container flex flex-column items-stretch">
|
|
{{#if uploader.isUploading}}
|
|
{{uploader.progressBar}}
|
|
{{else if @setting.value}}
|
|
<div class="gh-branding-image-container largeimg justify-start">
|
|
<img class="blog-cover" src={{@setting.value}} {{on "click" uploader.triggerFileDialog}}>
|
|
<button type="button" class="gh-setting-action-largeimg-delete" {{on "click" (fn this.updateValue null)}} data-test-delete-image="icon">
|
|
{{svg-jar "trash" class="w4 h4 fill-white"}}
|
|
</button>
|
|
</div>
|
|
{{else}}
|
|
<button type="button" class="gh-btn gh-btn-white self-start" {{on "click" uploader.triggerFileDialog}} data-test-image-upload-btn="icon">
|
|
<span>Upload</span>
|
|
</button>
|
|
{{/if}}
|
|
<div style="display:none">
|
|
<GhFileInput @multiple={{false}} @action={{uploader.setFiles}} @accept={{this.imageMimeTypes}} @onInsert={{uploader.registerFileInput}} data-test-file-input="icon" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</GhUploader>
|
|
</div> |