Ghost/ghost/admin/lib/koenig-editor/addon/components/koenig-card-code.hbs
Kevin Ansfield 242106d596 Migrated code card to Octane syntax
refs https://github.com/TryGhost/Ghost/issues/14101

- applying boyscout rule and upgrading/cleaning up when touching files
- nothing out of the ordinary to report with this migration
2022-07-14 17:32:44 +01:00

60 lines
2.3 KiB
Handlebars

<KoenigCard
@class={{concat "ba b--white relative kg-card-hover miw-100" (if @isEditing " bw2 pt1 pb1 pl2 nl6 pr6 nr6")}}
@style={{this.cardStyle}}
@headerOffset={{@headerOffset}}
@toolbar={{this.toolbar}}
@payload={{@payload}}
@isSelected={{@isSelected}}
@isEditing={{@isEditing}}
@selectCard={{@selectCard}}
@deselectCard={{@deselectCard}}
@editCard={{@editCard}}
@saveCard={{@saveCard}}
@saveAsSnippet={{@saveAsSnippet}}
@onEnterEdit={{this.enterEditMode}}
@onLeaveEdit={{this.leaveEditMode}}
@addParagraphAfterCard={{@addParagraphAfterCard}}
@moveCursorToPrevSection={{@moveCursorToPrevSection}}
@moveCursorToNextSection={{@moveCursorToNextSection}}
@editor={{@editor}}
as |card|
>
{{#if @isEditing}}
<GhCmEditor @value={{@payload.code}}
@class="koenig-card-code--editor koenig-card-html--editor"
@textareaClass="o-0"
@autofocus={{true}}
@lineWrapping={{true}}
@update={{this.updateCode}}
@mode={{this.cmMode}}
/>
<input
aria-label="Code card language"
type="text"
value={{@payload.language}}
{{on "blur" this.updateLanguage}}
placeholder="Language..."
class="absolute w-20 pa1 ba b--lightgrey br2 f8 tracked-2 fw4 z-999 outline-0 anim-normal"
style={{this.languageInputStyle}}
/>
{{else}}
<div class="koenig-card-html-rendered">
<pre><code class="line-numbers {{if @payload.language (concat "language-" @payload.language)}}">{{this.escapedCode}}</code></pre>
</div>
{{#if @payload.language}}
<div class="absolute top-2 right-2 flex justify-center items-center pa2">
<span class="db nudge-top--2 fw5 f8 midlightgrey">{{@payload.language}}</span>
</div>
{{/if}}
<div class="koenig-card-click-overlay"></div>
{{/if}}
{{#if (and (not @isEditing) (or @isSelected (clean-basic-html @payload.caption)))}}
<card.CaptionInput
@class="z-999"
@caption={{@payload.caption}}
@update={{this.updateCaption}}
@placeholder="Type caption for code block (optional)"
/>
{{/if}}
</KoenigCard>