0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-02-17 23:44:39 -05:00

Typography updates (#2317)

* Updated Editor typography
* Updated email header border logic
This commit is contained in:
Peter Zimon 2022-03-28 17:09:08 +02:00 committed by GitHub
parent 8d3c1dacc2
commit d32f4fc5e3
4 changed files with 31 additions and 11 deletions

View file

@ -206,7 +206,7 @@
</div> </div>
{{/if}} {{/if}}
{{#if this.showHeader}} {{#if this.showHeader}}
<div class="gh-members-emailpreview-header"> <div class={{if this.showHeaderTitle "gh-members-emailpreview-header bordered" "gh-members-emailpreview-header"}}>
{{#if (and this.settings.icon this.showHeaderIcon)}} {{#if (and this.settings.icon this.showHeaderIcon)}}
<img src={{this.settings.icon}} /> <img src={{this.settings.icon}} />
{{/if}} {{/if}}

View file

@ -61,42 +61,57 @@
.koenig-editor__editor h5, .koenig-editor__editor h5,
.koenig-editor__editor h6 { .koenig-editor__editor h6 {
font-family: -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif; font-family: -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif;
font-weight: 600; font-weight: 700;
color: var(--black); color: var(--black);
} }
.koenig-editor__editor h1 strong,
.koenig-editor__editor h2 strong,
.koenig-editor__editor h3 strong,
.koenig-editor__editor h4 strong,
.koenig-editor__editor h5 strong,
.koenig-editor__editor h6 strong {
font-weight: 800;
}
/* H1 should be almost the same size as the post title to suggest avoid using it */ /* H1 should be almost the same size as the post title to suggest avoid using it */
.koenig-editor__editor h1 { .koenig-editor__editor h1 {
font-size: 4.4rem; font-size: 4.4rem;
line-height: 1.15em; line-height: 1.15em;
letter-spacing: -0.015em;
} }
.koenig-editor__editor h2 { .koenig-editor__editor h2 {
font-size: 3.2rem; font-size: 3.2rem;
line-height: 1.32em; line-height: 1.2em;
letter-spacing: -0.014em;
} }
.koenig-editor__editor h3 { .koenig-editor__editor h3 {
font-size: 2.5rem; font-size: 2.5rem;
line-height: 1.35em; line-height: 1.3em;
letter-spacing: -0.013em;
} }
/* H4 is almost the same size as H3 to discourage using it */ /* H4 is almost the same size as H3 to discourage using it */
.koenig-editor__editor h4 { .koenig-editor__editor h4 {
font-size: 2.2rem; font-size: 2.2rem;
line-height: 1.4em; line-height: 1.35em;
letter-spacing: -0.011em;
} }
.koenig-editor__editor h5 { .koenig-editor__editor h5 {
font-size: 2.0rem; font-size: 2.0rem;
line-height: 1.4em; line-height: 1.35em;
font-weight: 700; font-weight: 700;
letter-spacing: -0.011em;
} }
.koenig-editor__editor h6 { .koenig-editor__editor h6 {
font-size: 1.85rem; font-size: 1.85rem;
line-height: 1.6em; line-height: 1.4em;
font-weight: 700; font-weight: 700;
letter-spacing: -0.008em;
} }
.koenig-editor__editor p + h1, .koenig-editor__editor p + h1,

View file

@ -552,7 +552,8 @@ body[data-user-is-dragging] .gh-editor-feature-image-dropzone {
border: none; border: none;
color: var(--black); color: var(--black);
font-size: 4.8rem; font-size: 4.8rem;
line-height: 1.15em; letter-spacing: -0.017em;
line-height: 1.1em;
font-weight: 700; font-weight: 700;
overflow: hidden; overflow: hidden;
box-shadow: none; box-shadow: none;

View file

@ -1827,9 +1827,13 @@ p.gh-members-import-errordetail:first-of-type {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
padding: 50px 0;
border-bottom: 1px solid #e5eff5;
margin-bottom: -10px; margin-bottom: -10px;
padding: 50px 0 0;
}
.gh-members-emailpreview-header.bordered {
border-bottom: 1px solid #e5eff5;
padding: 50px 0;
} }
.gh-members-emailpreview-header.hide { .gh-members-emailpreview-header.hide {
@ -1866,7 +1870,7 @@ p.gh-members-import-errordetail:first-of-type {
.gh-members-emailpreview-title h2 { .gh-members-emailpreview-title h2 {
font-size: 4.2rem; font-size: 4.2rem;
line-height: 1.1em; line-height: 1.1em;
font-weight: 600; font-weight: 700;
text-align: center; text-align: center;
margin: 0; margin: 0;
padding: 0 0 10px; padding: 0 0 10px;