TryGhost/Ghost
1
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2024-12-26 12:21:36 +03:00
Code Issues Projects Releases Wiki Activity

Updated callout card class for consistency

Browse Source 
No ref

- Swapped "kg-card-callout" for "kg-callout-card"
This commit is contained in:
Sanne de Vries 2021-12-01 14:23:47 +00:00
parent 48742a1b15
commit 9fcaae4475
2 changed files with 17 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
ghost/admin/app/styles/components/koenig.css
View File

@ -21,7 +21,7 @@
.koenig-editor__editor.__has-no-content:after, .koenig-editor__editor.__has-no-content:after,
.koenig-text-replacement-html-input__editor.__has-no-content:after, .koenig-text-replacement-html-input__editor.__has-no-content:after,
.koenig-basic-html-textarea__editor.__has-no-content:after, .koenig-basic-html-textarea__editor.__has-no-content:after,
.kg-card-callout .koenig-basic-html-input__editor.__has-no-content:after { .kg-callout-card .koenig-basic-html-input__editor.__has-no-content:after {
font-family: georgia,serif; font-family: georgia,serif;
font-weight: 300; font-weight: 300;
letter-spacing: .02rem; letter-spacing: .02rem;
@ -1395,7 +1395,7 @@
/* Callout card /* Callout card
/* --------------------------------------------------------------- */ /* --------------------------------------------------------------- */
.kg-card-callout-container { .kg-callout-card-container {
position: relative; position: relative;
min-height: 4rem; min-height: 4rem;
min-width: 100%; min-width: 100%;
@ -1403,52 +1403,52 @@
padding: 0; padding: 0;
} }
.kg-card-callout { .kg-callout-card {
display: flex; display: flex;
padding: 20px 28px; padding: 20px 28px;
background: var(--whitegrey-l1); background: var(--whitegrey-l1);
border-radius: var(--border-radius); border-radius: var(--border-radius);
} }
.kg-card-callout-grey { .kg-callout-card-grey {
background: rgba(124, 139, 154, 0.13); background: rgba(124, 139, 154, 0.13);
} }
.kg-card-callout-white { .kg-callout-card-white {
background: transparent; background: transparent;
box-shadow: inset 0 0 0 1px rgba(124, 139, 154, 0.25); box-shadow: inset 0 0 0 1px rgba(124, 139, 154, 0.25);
} }
.kg-card-callout-blue { .kg-callout-card-blue {
background: rgba(33, 172, 232, 0.12); background: rgba(33, 172, 232, 0.12);
} }
.kg-card-callout-green { .kg-callout-card-green {
background: rgba(52, 183, 67, 0.12); background: rgba(52, 183, 67, 0.12);
} }
.kg-card-callout-yellow { .kg-callout-card-yellow {
background: rgba(240, 165, 15, 0.13); background: rgba(240, 165, 15, 0.13);
} }
.kg-card-callout-red { .kg-callout-card-red {
background: rgba(209, 46, 46, 0.11); background: rgba(209, 46, 46, 0.11);
} }
.kg-card-callout-pink { .kg-callout-card-pink {
background: rgba(225, 71, 174, 0.11); background: rgba(225, 71, 174, 0.11);
} }
.kg-card-callout-purple { .kg-callout-card-purple {
background: rgba(135, 85, 236, 0.12); background: rgba(135, 85, 236, 0.12);
} }
.kg-card-callout-accent { .kg-callout-card-accent {
background: var(--adjusted-accent-color); background: var(--adjusted-accent-color);
} }
.kg-card-callout-accent p, .kg-callout-card-accent p,
.kg-card-callout-accent a { .kg-callout-card-accent a {
color: var(--white) !important; color: var(--white) !important;
} }

6
ghost/admin/lib/koenig-editor/addon/components/koenig-card-callout.hbs
View File

@ -1,6 +1,6 @@
<KoenigCard <KoenigCard
@env={{@env}} @env={{@env}}
@class={{concat (kg-style "container-card") " kg-card-callout-container"}} @class={{concat (kg-style "container-card") " kg-callout-card-container"}}
@headerOffset={{@headerOffset}} @headerOffset={{@headerOffset}}
@toolbar={{this.toolbar}} @toolbar={{this.toolbar}}
@payload={{@payload}} @payload={{@payload}}
@ -22,7 +22,7 @@
> >
{{#if @isEditing}} {{#if @isEditing}}
<div class="kg-card kg-card-callout kg-card-callout-{{@payload.backgroundColor}}"> <div class="kg-card kg-callout-card kg-callout-card-{{@payload.backgroundColor}}">
{{#if @payload.calloutEmoji}} {{#if @payload.calloutEmoji}}
<button type="button" class="kg-callout-emoji {{if this.isPickerVisible "kg-emoji-picker-active"}}" {{on "click" this.changeEmoji}}>{{@payload.calloutEmoji}}</button> <button type="button" class="kg-callout-emoji {{if this.isPickerVisible "kg-emoji-picker-active"}}" {{on "click" this.changeEmoji}}>{{@payload.calloutEmoji}}</button>
{{/if}} {{/if}}
@ -74,7 +74,7 @@
{{else}} {{else}}
<div class="kg-card kg-card-callout kg-card-callout-{{@payload.backgroundColor}}"> <div class="kg-card kg-callout-card kg-callout-card-{{@payload.backgroundColor}}">
{{#if @payload.calloutEmoji}} {{#if @payload.calloutEmoji}}
<div class="kg-callout-emoji {{if this.isPickerVisible "kg-emoji-picker-active"}}">{{@payload.calloutEmoji}}</div> <div class="kg-callout-emoji {{if this.isPickerVisible "kg-emoji-picker-active"}}">{{@payload.calloutEmoji}}</div>
{{/if}} {{/if}}