TryGhost/Ghost
1
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2024-11-24 06:35:49 +03:00
Code Issues Projects Releases Wiki Activity

Removed width and alignment configuration from the header card

Browse Source 
refs https://github.com/TryGhost/Team/issues/1253

- We're simplifying the header card from a design point of view to ease integration with themes
This commit is contained in:
Thibaut Patel 2021-12-16 15:10:57 +01:00
parent 7311c2bf7b
commit 05af5cdcd4
2 changed files with 3 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
ghost/admin/lib/koenig-editor/addon/components/koenig-card-header.hbs
View File

@ -1,6 +1,6 @@
<KoenigCard
@env={{@env}}
@class={{concat "flex flex-column mih10 miw-100 relative " (kg-style "breakout" size=@payload.cardWidth)}}
@class="flex flex-column mih10 miw-100 relative koenig-breakout-full"
@headerOffset={{@headerOffset}}
@toolbar={{this.toolbar}}
@payload={{@payload}}
@ -21,7 +21,7 @@
as |card|
>
{{#if @isEditing}}
<div class="kg-header-card kg-size-{{@payload.size}} kg-align-{{@payload.alignment}} kg-style-{{@payload.style}}" style="{{if (eq @payload.style "image") this.backgroundImageStyle}}">
<div class="kg-header-card kg-size-{{@payload.size}} kg-style-{{@payload.style}}" style="{{if (eq @payload.style "image") this.backgroundImageStyle}}">
<KoenigBasicHtmlInput
@html={{@payload.header}}
@placeholder="Header"
@ -51,24 +51,6 @@
</div>
<KoenigSettingsPanel>
{{!-- <div class="kg-settings-panel-control kg-settings-panel-control-horizontal">
<div class="kg-settings-panel-control-label">Width</div>
<div class="kg-settings-panel-control-input">
<div class="gh-btn-group icons">
<button type="button" title="Normal" class="gh-btn gh-btn-icon {{if (eq @payload.cardWidth "regular") "gh-btn-group-selected"}}" {{on "click" (fn this.setCardWidth "regular")}}><span>{{svg-jar "koenig/kg-img-regular" class="fill-darkgrey"}}</span></button>
<button type="button" title="Full" class="gh-btn gh-btn-icon {{if (eq @payload.cardWidth "full") "gh-btn-group-selected"}}" {{on "click" (fn this.setCardWidth "full")}}><span>{{svg-jar "koenig/kg-img-full" class="fill-darkgrey"}}</span></button>
</div>
</div>
</div>
<div class="kg-settings-panel-control kg-settings-panel-control-horizontal">
<div class="kg-settings-panel-control-label">Alignment</div>
<div class="kg-settings-panel-control-input">
<div class="gh-btn-group icons">
<button type="button" class="gh-btn gh-btn-icon {{if (eq @payload.alignment "left") "gh-btn-group-selected"}}" {{on "click" (fn this.setAlignment "left")}}><span>{{svg-jar "align-left"}}</span></button>
<button type="button" class="gh-btn gh-btn-icon {{if (eq @payload.alignment "center") "gh-btn-group-selected"}}" {{on "click" (fn this.setAlignment "center")}}><span>{{svg-jar "align-center"}}</span></button>
</div>
</div>
</div> --}}
<div class="kg-settings-panel-control kg-settings-panel-control-horizontal">
<div class="kg-settings-panel-control-label">Size</div>
<div class="kg-settings-panel-control-input">
@ -95,7 +77,6 @@
@uploadUrl="/images/upload/"
@accept={{this.imageMimeTypes}}
@extensions={{this.imageExtensions}}
{{!-- @onStart={{this.customThumbnailUploadStarted}} --}}
@onComplete={{this.backgroundImageUploadCompleted}}
as |uploader|
>
@ -187,7 +168,7 @@
{{else}}
<div class="kg-header-card kg-size-{{@payload.size}} kg-align-{{@payload.alignment}} kg-style-{{@payload.style}}" style="{{if (eq @payload.style "image") this.backgroundImageStyle}}">
<div class="kg-header-card kg-size-{{@payload.size}} kg-style-{{@payload.style}}" style="{{if (eq @payload.style "image") this.backgroundImageStyle}}">
<h2 class="kg-header-card-header">{{{@payload.header}}}</h2>
{{#if this.hasSubheader}}
<h3 class="kg-header-card-subheader">{{{@payload.subheader}}}</h3>

14
ghost/admin/lib/koenig-editor/addon/components/koenig-card-header.js
View File

@ -68,9 +68,7 @@ export default class KoenigCardHeaderComponent extends Component {
const payloadDefaults = {
size: 'small',
alignment: 'center',
style: 'invert',
cardWidth: 'full',
buttonEnabled: false
};
@ -231,13 +229,6 @@ export default class KoenigCardHeaderComponent extends Component {
}
}
@action
setAlignment(alignment) {
if (['center', 'left'].includes(alignment)) {
this._updatePayloadAttr('alignment', alignment);
}
}
@action
setStyle(style) {
if (['invert', 'clear', 'accent', 'image'].includes(style)) {
@ -271,9 +262,4 @@ export default class KoenigCardHeaderComponent extends Component {
deleteBackgroundImage() {
this._updatePayloadAttr('backgroundImageSrc', null);
}
@action
setCardWidth(width) {
this._updatePayloadAttr('cardWidth', width);
}
}