v4.5.0

refs https://github.com/TryGhost/Team/issues/1245

- Followed the same pattern as the callout, ntf and bookmark cards.

assets/css/screen.css

@@ -995,27 +995,46 @@ is the very first element in the post content */
 }
 
 /* Now the content typography styles */
-.gh-content a:not(.gh-post-upgrade-cta a):not(.kg-bookmark-container):not(.kg-btn):not(.kg-nft-card-container) {
+.gh-content a:not(.gh-post-upgrade-cta a):not(.kg-bookmark-container):not(.kg-btn):not(.kg-nft-card-container):not(.kg-callout-card-accent a):not(a.kg-product-card-btn-accent) {
     color: var(--ghost-accent-color);
     text-decoration: underline;
     word-break: break-word;
 }
 
-.gh-content > blockquote,
+.gh-content .kg-callout-card-accent a {
+    text-decoration: underline;
+}
+
+.gh-content > blockquote:not([class]),
 .gh-content > ol,
 .gh-content > ul,
 .gh-content > dl,
-.gh-content > p,
+.gh-content > p {
-.kg-callout-text,
-.kg-toggle-content > ol,
-.kg-toggle-content > ul,
-.kg-toggle-content > p {
     font-family: var(--font-serif);
     font-weight: 400;
     font-size: 2.1rem;
     line-height: 1.6em;
 }
 
+.gh-content .kg-callout-text,
+.gh-content .kg-toggle-content > ol,
+.gh-content .kg-toggle-content > ul,
+.gh-content .kg-toggle-content > p {
+    font-family: var(--font-serif);
+    font-weight: 400;
+    font-size: 2.0rem;
+    line-height: 1.6em;
+}
+
+.gh-content .kg-callout-emoji {
+    font-size: 2.2rem;
+    line-height: 1.5em;
+}
+
+.gh-content .kg-toggle-heading-text {
+    font-size: 2.2rem;
+}
+
 .has-sans-body .gh-content > blockquote,
 .has-sans-body .gh-content > ol,
 .has-sans-body .gh-content > ul,
@@ -1034,13 +1053,13 @@ is the very first element in the post content */
     padding-left: 1.9em;
 }
 
-.gh-content > blockquote {
+.gh-content > blockquote:not([class]) {
     position: relative;
     font-style: italic;
     padding: 0;
 }
 
-.gh-content > blockquote::before {
+.gh-content > blockquote:not([class])::before {
     content: "";
     position: absolute;
     left: -1.5em;
@@ -1074,7 +1093,7 @@ is the very first element in the post content */
 }
 
 @media (max-width: 650px) {
-    .gh-content > blockquote,
+    .gh-content > blockquote:not([class]),
     .gh-content > ol,
     .gh-content > ul,
     .gh-content > dl,
@@ -1132,6 +1151,15 @@ except for when immediately preceeded by a heading */
     margin-top: min(2.4rem, 4vmin);
 }
 
+.kg-blockquote-alt {
+    font-family: var(--font-serif);
+    color: var(--color-midgrey);
+}
+
+.has-sans-body .kg-blockquote-alt {
+    font-family: var(--font-sans);
+}
+
 
 /* Captions */
 figcaption {

package.json

@@ -2,7 +2,7 @@
     "name": "casper",
     "description": "A clean, minimal default theme for the Ghost publishing platform",
     "demo": "https://demo.ghost.io",
-    "version": "4.3.0",
+    "version": "4.5.0",
     "engines": {
         "ghost": ">=4.0.0",
         "ghost-api": "v4"

partials/post-card.hbs

@@ -42,7 +42,7 @@ which templates loop over to generate a list of posts. --}}
                 <li class="author-list-item">
                     {{#if profile_image}}
                     <a href="{{url}}" class="static-avatar">
-                        <img class="author-profile-image" src="{{img_url profile_image size="xs"}}" alt="{{name}}" />
+                        <img class="author-profile-image" src="{{img_url profile_image size="xs"}}" alt="{{name}}" loading="lazy" />
                     </a>
                     {{else}}
                     <a href="{{url}}" class="static-avatar author-profile-image">{{> "icons/avatar"}}</a>