mirror of
https://github.com/TryGhost/Ghost.git
synced 2024-11-27 18:52:14 +03:00
Updated post list item hover state
Refs https://github.com/TryGhost/Team/issues/1895
This commit is contained in:
Sanne de Vries
parent
1c6c737a22
commit
b5904d9956
@ -12,23 +12,33 @@
|
||||
{{@post.title}} {{svg-jar "external" class="gh-post-list-external"}}
|
||||
</h3>
|
||||
{{#unless @hideAuthor }}
|
||||
<p>
|
||||
<span class="gh-content-entry-meta">
|
||||
By <span class="midgrey-l2 fw5">{{post-author-names @post}}</span>
|
||||
<p class="gh-content-entry-meta">
|
||||
<span class="gh-content-entry-author">
|
||||
By {{post-author-names @post}}
|
||||
|
||||
{{#if @post.primaryTag}}
|
||||
in <span class="midgrey-l2 fw5">{{@post.primaryTag.name}}</span>
|
||||
{{/if}}
|
||||
|
||||
• <span data-tooltip="{{gh-format-post-time @post.updatedAtUTC "D MMM YYYY"}}">{{gh-format-post-time @post.updatedAtUTC draft=true}}</span>
|
||||
|
||||
•
|
||||
</span>
|
||||
<span class="gh-content-entry-date">
|
||||
{{#if this.isHovered}}
|
||||
{{gh-format-post-time @post.updatedAtUTC "D MMM YYYY"}}
|
||||
{{else}}
|
||||
{{gh-format-post-time @post.updatedAtUTC draft=true}}
|
||||
{{/if}}
|
||||
</span>
|
||||
</p>
|
||||
<p>
|
||||
<span class="gh-content-status-published nowrap">
|
||||
<p class="gh-content-entry-status">
|
||||
<span class="published">
|
||||
Published
|
||||
{{#if @post.hasEmail}}
|
||||
& Sent
|
||||
{{#if isHovered}}
|
||||
and sent to 2,467 free subscribers
|
||||
{{else}}
|
||||
and sent
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</span>
|
||||
</p>
|
||||
@ -41,39 +51,55 @@
|
||||
</h3>
|
||||
{{#unless @hideAuthor }}
|
||||
<p class="gh-content-entry-meta">
|
||||
By {{post-author-names @post}}
|
||||
<span class="gh-content-entry-author">
|
||||
By {{post-author-names @post}}
|
||||
|
||||
{{#if @post.primaryTag}}
|
||||
in {{@post.primaryTag.name}}
|
||||
{{/if}}
|
||||
|
||||
• <span data-tooltip="{{gh-format-post-time @post.updatedAtUTC "D MMM YYYY"}}">{{gh-format-post-time @post.updatedAtUTC draft=true}}</span>
|
||||
{{#if @post.primaryTag}}
|
||||
in <span class="midgrey-l2 fw5">{{@post.primaryTag.name}}</span>
|
||||
{{/if}}
|
||||
•
|
||||
</span>
|
||||
<span class="gh-content-entry-date">
|
||||
{{#if this.isHovered}}
|
||||
{{gh-format-post-time @post.updatedAtUTC "D MMM YYYY"}}
|
||||
{{else}}
|
||||
{{gh-format-post-time @post.updatedAtUTC draft=true}}
|
||||
{{/if}}
|
||||
</span>
|
||||
</p>
|
||||
<p class="gh-content-entry-meta">
|
||||
<p class="gh-content-entry-status">
|
||||
{{#if @post.isScheduled}}
|
||||
<span class="gh-content-status scheduled" title="Scheduled" data-tooltip="To be published {{if @post.newsletter "& sent at "}}{{capitalize this.scheduledText}} to {{@post.emailSegment}} members">
|
||||
<span class="scheduled" title="Scheduled" data-tooltip="To be published {{if @post.newsletter "& sent at "}}{{capitalize this.scheduledText}} to {{@post.emailSegment}} members">
|
||||
Scheduled
|
||||
</span>
|
||||
{{/if}}
|
||||
|
||||
{{#if @post.isDraft}}
|
||||
<span class="gh-content-status draft">
|
||||
<span class="draft">
|
||||
Draft
|
||||
</span>
|
||||
{{/if}}
|
||||
|
||||
{{#if @post.isPublished}}
|
||||
<span class="gh-content-status published">
|
||||
<span class="published">
|
||||
Published
|
||||
{{#if @post.hasEmail}}
|
||||
and sent
|
||||
{{#if isHovered}}
|
||||
and sent to 2,467 free subscribers
|
||||
{{else}}
|
||||
and sent
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</span>
|
||||
{{/if}}
|
||||
|
||||
{{#if @post.isSent}}
|
||||
<span class="gh-content-status sent">
|
||||
Sent
|
||||
<span class="sent">
|
||||
{{#if isHovered}}
|
||||
Sent to 2,467 free subscribers
|
||||
{{else}}
|
||||
Sent
|
||||
{{/if}}
|
||||
</span>
|
||||
{{/if}}
|
||||
</p>
|
||||
@ -95,28 +121,32 @@
|
||||
{{else}}
|
||||
<span class="darkgrey fw5 gh-content-email-stats">
|
||||
{{#if this.isHovered}}
|
||||
{{format-number @post.email.openedCount}}
|
||||
1,283
|
||||
{{else}}
|
||||
{{@post.email.openRate}}%
|
||||
52%
|
||||
{{/if}}
|
||||
</span>
|
||||
{{/if}}
|
||||
<span class="midgrey-l2 fw4 gh-content-email-stats-mobile">{{@post.email.openRate}}% opens</span>
|
||||
</div>
|
||||
{{else}}
|
||||
<span class="gh-list-nodata">—</span>
|
||||
{{/if}}
|
||||
</LinkTo>
|
||||
|
||||
{{!-- Clicks column --}}
|
||||
<LinkTo @route="editor.edit" @models={{array @post.displayName @post.id}} class="permalink gh-list-data gh-post-list-clicks">
|
||||
<span class="gh-list-nodata">—</span>
|
||||
{{#if (and @post.email.trackOpens (eq @post.email.status "submitted"))}}
|
||||
{{#if this.isHovered}}
|
||||
444
|
||||
{{else}}
|
||||
18%
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</LinkTo>
|
||||
{{/if}}
|
||||
|
||||
{{!-- Button column --}}
|
||||
<LinkTo @route="editor.edit" @models={{array @post.displayName @post.id}} class="permalink gh-list-data gh-post-list-cta">
|
||||
{{#if @post.isPublished}}
|
||||
{{#if (or @post.isSent @post.isPublished)}}
|
||||
<LinkTo @route="posts.analytics" @model={{@post}} class="gh-btn gh-btn-outline gh-btn-icon">
|
||||
<span>
|
||||
{{svg-jar "stats" class="stats"}} Stats
|
||||
|
||||
@ -427,10 +427,6 @@ a.gh-post-list-signups.active:hover > span, a.gh-post-list-conversions.active:ho
|
||||
stroke-width: 1.5;
|
||||
}
|
||||
|
||||
.gh-content-entry-author {
|
||||
color: var(--middarkgrey);
|
||||
}
|
||||
|
||||
.gh-posts-placeholder {
|
||||
width: 60px;
|
||||
fill: var(--lightgrey);
|
||||
@ -721,7 +717,7 @@ a.gh-post-list-signups.active:hover > span, a.gh-post-list-conversions.active:ho
|
||||
|
||||
.gh-post-stats-box.grey {
|
||||
border: none;
|
||||
background: var(--whitegrey-l2);
|
||||
background: var(--main-color-content-greybg);
|
||||
}
|
||||
|
||||
.gh-post-stats-title {
|
||||
@ -830,7 +826,7 @@ a.gh-post-list-signups.active:hover > span, a.gh-post-list-conversions.active:ho
|
||||
/* ---------------------------------------------------------- */
|
||||
|
||||
.gh-posts-list-item-labs .gh-list-data {
|
||||
padding: 2rem;
|
||||
padding: 1.6rem 0 3.2rem;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
@ -839,21 +835,26 @@ a.gh-post-list-signups.active:hover > span, a.gh-post-list-conversions.active:ho
|
||||
}
|
||||
|
||||
.gh-posts-list-item-labs .gh-content-entry-title {
|
||||
margin: 0 0 1rem;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.gh-posts-list-item-labs .gh-content-entry-meta {
|
||||
.gh-posts-list-item-labs .gh-content-entry-meta,
|
||||
.gh-posts-list-item-labs .gh-content-entry-status {
|
||||
margin: 2px 0 0 0;
|
||||
font-size: 1.35rem;
|
||||
color: var(--midlightgrey-d1);
|
||||
}
|
||||
|
||||
.gh-posts-list-item-labs .gh-content-status.draft {
|
||||
.gh-content-entry-author,
|
||||
.gh-content-entry-date {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.gh-content-entry-status .draft {
|
||||
color: var(--pink);
|
||||
}
|
||||
|
||||
.gh-posts-list-item-labs .gh-content-status.scheduled {
|
||||
.gh-content-entry-status .scheduled {
|
||||
color: var(--purple);
|
||||
}
|
||||
|
||||
@ -869,6 +870,10 @@ a.gh-post-list-signups.active:hover > span, a.gh-post-list-conversions.active:ho
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.gh-posts-list-item-labs:hover .gh-btn-outline {
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.gh-posts-list-item-labs svg.edit {
|
||||
color: var(--midgrey);
|
||||
}
|
||||
|
||||
@ -27,34 +27,32 @@
|
||||
</GhCanvasHeader>
|
||||
|
||||
<section class="view-container content-list">
|
||||
<div class="gh-list-sticky">
|
||||
<ol class="posts-list gh-list {{unless this.postsInfinityModel "no-posts"}} feature-memberAttribution">
|
||||
<ol class="posts-list gh-list {{unless this.postsInfinityModel "no-posts"}} feature-memberAttribution">
|
||||
|
||||
{{#each this.postsInfinityModel as |post|}}
|
||||
<PostsList::ListItemClicks
|
||||
@post={{post}}
|
||||
data-test-post-id={{post.id}}
|
||||
/>
|
||||
{{else}}
|
||||
<li class="no-posts-box">
|
||||
<div class="no-posts">
|
||||
{{#if this.showingAll}}
|
||||
{{svg-jar "posts-placeholder" class="gh-posts-placeholder"}}
|
||||
<h4>Start creating content.</h4>
|
||||
<LinkTo @route="editor.new" @model="post" class="gh-btn gh-btn-green">
|
||||
<span>Write a new post</span>
|
||||
</LinkTo>
|
||||
{{else}}
|
||||
<h4>No posts match the current filter</h4>
|
||||
<LinkTo @route="posts" @query={{hash type=null author=null tag=null}} class="gh-btn">
|
||||
<span>Show all posts</span>
|
||||
</LinkTo>
|
||||
{{/if}}
|
||||
</div>
|
||||
</li>
|
||||
{{/each}}
|
||||
</ol>
|
||||
</div>
|
||||
{{#each this.postsInfinityModel as |post|}}
|
||||
<PostsList::ListItemClicks
|
||||
@post={{post}}
|
||||
data-test-post-id={{post.id}}
|
||||
/>
|
||||
{{else}}
|
||||
<li class="no-posts-box">
|
||||
<div class="no-posts">
|
||||
{{#if this.showingAll}}
|
||||
{{svg-jar "posts-placeholder" class="gh-posts-placeholder"}}
|
||||
<h4>Start creating content.</h4>
|
||||
<LinkTo @route="editor.new" @model="post" class="gh-btn gh-btn-green">
|
||||
<span>Write a new post</span>
|
||||
</LinkTo>
|
||||
{{else}}
|
||||
<h4>No posts match the current filter</h4>
|
||||
<LinkTo @route="posts" @query={{hash type=null author=null tag=null}} class="gh-btn">
|
||||
<span>Show all posts</span>
|
||||
</LinkTo>
|
||||
{{/if}}
|
||||
</div>
|
||||
</li>
|
||||
{{/each}}
|
||||
</ol>
|
||||
|
||||
<GhInfinityLoader
|
||||
@infinityModel={{this.postsInfinityModel}}
|
||||
|
||||
@ -1 +1 @@
|
||||
Subproject commit 005211ff8f58753cce794d4ef9924b99dfbedd3b
|
||||
Subproject commit 657bb8f98653c5f1aea034a726e53f46ccf83b23
|
||||
Loading…
Reference in New Issue
Block a user