Ghost/ghost/admin/app/components/settings/form-fields/publication-icon.hbs
Sanne de Vries a2fc31aa0a Cleaned up icon styles
Refs https://www.notion.so/ghost/Unify-icons-across-Admin-7e3d124d5db34c63beccca029af595e7

- Reduced duplicate plus icons
- Replaced fill trash, info and pen icons by stroke icons
- Removed fill styles from default button classes
- Removed launch-wizard css
2022-09-02 16:56:02 +01:00

48 lines
2.0 KiB
Handlebars

<div data-test-setting="icon" ...attributes>
<GhUploader
@extensions={{this.iconExtensions}}
@paramsHash={{hash purpose="icon"}}
@onComplete={{this.imageUploaded}}
as |uploader|
>
<div class="gh-setting-content">
<label class="gh-setting-title" for="publication-icon">Publication icon</label>
<div class="gh-setting-desc">A square, social icon, at least 60x60px</div>
{{#each uploader.errors as |error|}}
<div class="gh-setting-error" data-test-error="icon">{{or error.context error.message}}</div>
{{/each}}
</div>
<div class="gh-setting-action gh-uploadbutton-container gh-setting-action-smallimg flex flex-column">
{{#if uploader.isUploading}}
{{uploader.progressBar}}
{{else if this.settings.icon}}
<div class="gh-branding-image-container transparent-bg">
<input
id="publication-icon"
type="image"
class="blog-icon"
src={{this.settings.icon}}
{{on "click" uploader.triggerFileDialog}}
data-test-icon-img
>
<button type="button" class="gh-setting-action-smallimg-delete" {{on "click" (fn this.update null)}} data-test-delete-image="icon">
{{svg-jar "trash" class="w4 h4"}}
</button>
</div>
{{else}}
<button id="publication-icon" type="button" class="gh-btn gh-btn-white self-center" {{on "click" uploader.triggerFileDialog}} data-test-image-upload-btn="icon">
<span>Upload icon</span>
</button>
{{/if}}
<div class="dn">
<GhFileInput
@multiple={{false}}
@action={{uploader.setFiles}}
@accept={{this.iconMimeTypes}}
@onInsert={{uploader.registerFileInput}}
data-test-file-input="icon"
/>
</div>
</div>
</GhUploader>
</div>