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

Updated comments link UI in email preview

Browse Source 
Refs https://github.com/TryGhost/Team/issues/2714
This commit is contained in:
Sanne de Vries 2023-03-15 10:01:42 +01:00
parent b27c7bc707
commit c538e39d33
4 changed files with 35 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
ghost/admin/app/components/modals/newsletters/edit/preview-labs.hbs
View File

@ -28,9 +28,14 @@
{{#if @newsletter.showPostTitleSection}} {{#if @newsletter.showPostTitleSection}}
<div class="gh-members-emailpreview-title {{if (eq @newsletter.titleAlignment "left") "gh-members-emailpreview-title-left"}}"> <div class="gh-members-emailpreview-title {{if (eq @newsletter.titleAlignment "left") "gh-members-emailpreview-title-left"}}">
<h2 class="{{if (eq @newsletter.titleFontCategory "serif") "serif"}}">Your email newsletter</h2> <h2 class="{{if (eq @newsletter.titleFontCategory "serif") "serif"}}">Your email newsletter</h2>
<div> <div class="flex justify-between w-100">
<p>By {{or this.session.user.name this.session.user.email}} on {{moment-format (moment-site-tz) "D MMM YYYY"}}</p> <p>By {{or this.session.user.name this.session.user.email}} on {{moment-format (moment-site-tz) "D MMM YYYY"}}</p>
<a href="javascript:">{{svg-jar "arrow-top-right"}} View online</a> <a href="javascript:"> {{svg-jar "comments"}} Comments</a> <div>
<a href="javascript:">View in browser</a>
{{!-- {{#if newsletter.showCommentCta}} --}}
<a href="javascript:"> {{svg-jar "comments"}}</a>
{{!-- {{/if}} --}}
</div>
</div> </div>
</div> </div>
{{/if}} {{/if}}
@ -44,24 +49,28 @@
<p>So, you can trust that every email you send with Ghost will look great and work well. Just like the rest of your site.</p> <p>So, you can trust that every email you send with Ghost will look great and work well. Just like the rest of your site.</p>
</div> </div>
{{#if (and @newsletter.feedbackEnabled (feature "audienceFeedback"))}} {{!-- {{#if (or (and @newsletter.feedbackEnabled (feature "audienceFeedback")) newsletter.showCommentCta)}} --}}
<div class="gh-members-emailpreview-feedback gh-members-emailpreview-content"> <div class="gh-members-emailpreview-feedback gh-members-emailpreview-content">
<div class="gh-members-emailpreview-feedback-buttons-group"> <div class="gh-members-emailpreview-feedback-buttons-group">
<Modals::Newsletters::Components::FeedbackButton {{#if (and @newsletter.feedbackEnabled (feature "audienceFeedback"))}}
@text="More like this" <Modals::Newsletters::Components::FeedbackButton
@icon="thumbs-up" /> @text="More like this"
@icon="thumbs-up" />
<Modals::Newsletters::Components::FeedbackButton <Modals::Newsletters::Components::FeedbackButton
@text="Less like this" @text="Less like this"
@icon="thumbs-down" /> @icon="thumbs-down" />
{{/if}}
<Modals::Newsletters::Components::FeedbackButton {{!-- {{#if newsletter.showCommentCta}} --}}
@text="Comments" <Modals::Newsletters::Components::FeedbackButton
@icon="comments" /> @text="Comments"
@icon="comments" />
{{!-- {{/if}} --}}
</div> </div>
</div> </div>
{{/if}} {{!-- {{/if}} --}}
<div class="gh-members-emailpreview-footer"> <div class="gh-members-emailpreview-footer">
<div class="gh-members-emailpreview-footercontent"> <div class="gh-members-emailpreview-footercontent">

14
ghost/admin/app/styles/layouts/members.css
View File

@ -2083,10 +2083,8 @@ p.gh-members-import-errordetail:first-of-type {
} }
.gh-members-emailpreview-labs .gh-members-emailpreview-title a { .gh-members-emailpreview-labs .gh-members-emailpreview-title a {
padding-right: 8px; text-decoration: underline;
text-decoration: none; color: var(--midgrey);
text-transform: uppercase;
color: #15212A;
font-size: 1.3rem; font-size: 1.3rem;
line-height: 1; line-height: 1;
letter-spacing: 0.2px; letter-spacing: 0.2px;
@ -2094,10 +2092,10 @@ p.gh-members-import-errordetail:first-of-type {
.gh-members-emailpreview-labs .gh-members-emailpreview-title a svg { .gh-members-emailpreview-labs .gh-members-emailpreview-title a svg {
display: inline-block; display: inline-block;
margin-top: -2px; margin: -2px 0 0 12px;
vertical-align: middle; vertical-align: middle;
width: 14px; width: 16px;
height: 14px; height: 16px;
stroke-width: 1.5px; stroke-width: 1.5px;
} }
@ -2264,6 +2262,8 @@ p.gh-members-import-errordetail:first-of-type {
} }
.gh-members-emailpreview-labs .gh-members-emailpreview-feedback-button svg { .gh-members-emailpreview-labs .gh-members-emailpreview-feedback-button svg {
width: 20px;
height: 20px;
stroke-width: 1.5px; stroke-width: 1.5px;
} }

4
ghost/admin/public/assets/icons/thumbs-down.svg
View File

@ -1 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><path d="M20.237 7.97c-.322-.166-.645-.33-.97-.493-5.972-3.019-5.68-2.43-10.794-2.43-2.135 0-3.22 1.389-3.851 3.423v.014l-1.552 5.18v.01a1.621 1.621 0 0 0 1.557 2.091h3.99a1.643 1.643 0 0 1 1.29.631 1.61 1.61 0 0 1 .284 1.402l-.718 2.709a1.376 1.376 0 0 0 .77 1.612 1.398 1.398 0 0 0 1.717-.463l3.979-6.117a1.642 1.642 0 0 1 1.33-.685h2.968m0 2.246V5" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/></svg> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M2 14.429h3.444a1.906 1.906 0 0 1 1.543.794l4.617 7.095a1.622 1.622 0 0 0 1.992.537 1.597 1.597 0 0 0 .894-1.87l-.833-3.142a1.867 1.867 0 0 1 .993-2.164 1.91 1.91 0 0 1 .833-.193h4.63a1.882 1.882 0 0 0 1.806-2.426v-.011l-1.8-6.008v-.016c-.733-2.36-1.992-3.97-4.469-3.97-5.934 0-5.595-.684-12.524 2.818-.377.188-.752.379-1.126.572V16.5"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 504 B

After

Width:  |  Height:  |  Size: 516 B

4
ghost/admin/public/assets/icons/thumbs-up.svg
View File

@ -1 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="26" height="24" fill="none"><path d="M4 17.275c.323.165.646.33.97.492 5.973 3.019 5.68 2.43 10.794 2.43 2.135 0 3.221-1.389 3.852-3.423v-.013l1.552-5.18v-.01a1.622 1.622 0 0 0-1.557-2.092H15.62a1.643 1.643 0 0 1-1.29-.63 1.61 1.61 0 0 1-.283-1.403l.717-2.708a1.377 1.377 0 0 0-.769-1.613 1.397 1.397 0 0 0-1.717.463l-3.98 6.117a1.643 1.643 0 0 1-1.33.685H4.001M4 8.748v11.496" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/></svg> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M2.001 10.571h3.443a1.907 1.907 0 0 0 1.543-.794l4.618-7.095a1.62 1.62 0 0 1 1.992-.537 1.598 1.598 0 0 1 .892 1.871l-.832 3.14a1.867 1.867 0 0 0 .993 2.165c.259.127.544.193.832.194h4.63a1.883 1.883 0 0 1 1.807 2.426v.011l-1.8 6.008v.015c-.733 2.36-1.993 3.97-4.47 3.97-5.933 0-5.593.684-12.524-2.818-.375-.188-.75-.38-1.125-.57v-9.89"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 501 B

After

Width:  |  Height:  |  Size: 516 B