diff --git a/ghost/admin/app/components/gh-post-bookmark.hbs b/ghost/admin/app/components/gh-post-bookmark.hbs index 2fa981bcaa..0c178d2c44 100644 --- a/ghost/admin/app/components/gh-post-bookmark.hbs +++ b/ghost/admin/app/components/gh-post-bookmark.hbs @@ -1,19 +1,20 @@
- {{#if @post.featureImage}} -
- -
- {{/if}} + {{#let (or @post.featureImage (get-setting "coverImage")) as |imageUrl|}} + {{#if imageUrl}} +
+ +
+ {{/if}} + {{/let}}
{{@post.title}}
{{@post.excerpt}}
- {{#if @post.primaryAuthor.profileImage}} -
- -
+ {{#if (get-setting "icon")}} +
{{/if}} +
{{get-setting "title"}}
{{post-author-names @post}}
diff --git a/ghost/admin/app/helpers/get-setting.js b/ghost/admin/app/helpers/get-setting.js new file mode 100644 index 0000000000..adbbc7be6f --- /dev/null +++ b/ghost/admin/app/helpers/get-setting.js @@ -0,0 +1,11 @@ +import Helper from '@ember/component/helper'; +import {get} from '@ember/object'; +import {inject as service} from '@ember/service'; + +export default class GetSetting extends Helper { + @service settings; + + compute([key = '']) { + return get(this.settings, key); + } +} diff --git a/ghost/admin/app/styles/components/publishmenu.css b/ghost/admin/app/styles/components/publishmenu.css index 83e60c8842..4eae783ae0 100644 --- a/ghost/admin/app/styles/components/publishmenu.css +++ b/ghost/admin/app/styles/components/publishmenu.css @@ -657,8 +657,8 @@ } .gh-post-bookmark { - display: flex; - align-items: center; + display: grid; + grid-template-columns: 1fr minmax(0, 2fr); width: 100%; max-width: 640px; margin-top: 1.6rem; @@ -681,33 +681,39 @@ } .gh-post-bookmark-image { - max-width: 33%; - max-height: 152px; display: inherit; } .gh-post-bookmark-image img { width: 100%; + height: 100%; + max-height: 152px; object-fit: cover; border-radius: var(--border-radius) 0 0 var(--border-radius); } .gh-post-bookmark-content { - max-width: 67%; + display: flex; + flex-direction: column; + justify-content: space-between; padding: 2rem; } .gh-post-bookmark-title { + display: -webkit-box; margin-bottom: .4rem; color: var(--darkgrey); font-size: 1.5rem; font-weight: 600; - line-height: 1.4em; + line-height: 1.4em;line-clamp: 2; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + overflow: hidden; } .gh-post-bookmark-text { margin-bottom: 1.6rem; - color: var(--midgrey); + color: var(--middarkgrey); font-size: 1.4rem; font-weight: 400; } @@ -715,15 +721,27 @@ .gh-post-bookmark-details { display: flex; align-items: center; - color: var(--midgrey); + color: var(--middarkgrey); font-size: 1.4rem; - font-weight: 500; + font-weight: 400; overflow: hidden; text-overflow: ellipsis; } +.gh-post-bookmark-site-title { + color: var(--darkgrey); + font-weight: 500; +} + +.gh-post-bookmark-authors:before { + content: "•"; + margin: 0 6px; + color: var(--darkgrey); +} + +.gh-post-bookmark-site-icon, .gh-post-bookmark-author-image { width: 20px; height: 20px; margin-right: 6px; -} +} \ No newline at end of file