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

Tweaking styles for post and pages to work better with more data

Browse Source 
refs https://github.com/TryGhost/Team/issues/1818
This commit is contained in:
James Morris 2022-08-23 12:22:46 +01:00
parent 934e61aa4c
commit 7f6aa78c01
3 changed files with 61 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
ghost/admin/app/components/gh-posts-list-item.hbs
View File

@ -56,6 +56,8 @@
<span class="darkgrey fw5 gh-content-email-stats">{{format-number @post.email.emailCount}}</span>
<span class="midgrey-l2 fw4 gh-content-email-stats-mobile">{{gh-pluralize @post.email.emailCount "send"}}</span>
</span>
{{else}}
{{#if this.feature.memberAttribution}}<span class="gh-list-nodata">&mdash;</span>{{/if}}
{{/if}}
</div>
</LinkTo>
@ -72,20 +74,28 @@
</span>
<span class="midgrey-l2 fw4 gh-content-email-stats-mobile">{{@post.email.openRate}}% opens</span>
</div>
{{else}}
{{#if this.feature.memberAttribution}}<span class="gh-list-nodata">&mdash;</span>{{/if}}
{{/if}}
</LinkTo>
{{/if}}
{{/if}}
{{#if this.feature.memberAttribution}}
<a href={{@post.url}} class="permalink gh-list-data gh-post-list-status" target="_blank" rel="noopener noreferrer">
{{@post.count.signups}}
<a href={{@post.url}} class="permalink gh-list-data gh-post-list-signups" target="_blank" rel="noopener noreferrer">
<span class="darkgrey fw5 gh-content-attribution-stats">{{@post.count.signups}}</span>
<span class="midgrey-l2 fw4 gh-content-attribution-stats-mobile">{{gh-pluralize @post.count.signups "signup"}}</span>
{{!-- TODO: How to show this when there is no data?
<span class="gh-list-nodata">&mdash;</span> --}}
</a>
{{/if}}
{{#if this.feature.memberAttribution}}
<a href={{@post.url}} class="permalink gh-list-data gh-post-list-status" target="_blank" rel="noopener noreferrer">
{{@post.count.conversions}}
<a href={{@post.url}} class="permalink gh-list-data gh-post-list-conversions" target="_blank" rel="noopener noreferrer">
<span class="darkgrey fw5 gh-content-attribution-stats">{{@post.count.conversions}}</span>
<span class="midgrey-l2 fw4 gh-content-attribution-stats-mobile">{{gh-pluralize @post.count.conversions "conversion"}}</span>
{{!-- TODO: How to show this when there is no data?
<span class="gh-list-nodata">&mdash;</span> --}}
</a>
{{/if}}

25
ghost/admin/app/styles/components/lists.css
View File

@ -184,11 +184,20 @@ ul.nostyle li {
color: var(--black);
}
.gh-list-nodata {
font-size: 1.5rem;
letter-spacing: 0;
text-decoration: none;
min-width: 54px;
color: var(--lightgrey);
font-weight: 500;
}
/* Helpers for smaller sizes
/* --------------------------------------------------- */
@media (max-width: 1000px) {
@media (max-width: 1200px) {
.gh-list {
border-bottom: none;
}
@ -201,6 +210,10 @@ ul.nostyle li {
.gh-list-hidecell-m {
display: none;
}
.gh-list .gh-list-nodata {
display: none;
}
}
@media (max-width: 800px) {
@ -447,13 +460,3 @@ ul.nostyle li {
height: calc(100vh - 96px);
}
}
.gh-list-nodata {
font-size: 1.5rem;
letter-spacing: 0;
text-decoration: none;
min-width: 54px;
color: var(--lightgrey);
font-weight: 500;
}

36
ghost/admin/app/styles/layouts/content.css
View File

@ -205,7 +205,9 @@
.gh-post-list-updated,
.gh-post-list-author,
.gh-post-list-recipients,
.gh-post-list-opens {
.gh-post-list-opens,
.gh-post-list-signups,
.gh-post-list-conversions {
color: var(--middarkgrey);
font-size: 1.3rem;
}
@ -251,6 +253,10 @@
display: none;
}
.gh-content-attribution-stats-mobile {
display: none;
}
.gh-content-status-draft,
.gh-content-status-published,
.gh-content-status-scheduled,
@ -348,7 +354,7 @@
}
/* Mobile style of post list */
@media (max-width: 1000px) {
@media (max-width: 1200px) {
.gh-posts-list-item {
display: flex;
flex-wrap: wrap;
@ -389,7 +395,9 @@
.gh-post-list-status,
.gh-post-list-recipients,
.gh-post-list-opens {
.gh-post-list-opens,
.gh-post-list-signups,
.gh-post-list-conversions {
display: inline-block;
border: none;
padding: 0 4px 20px 0;
@ -412,6 +420,14 @@
order: 5;
}
.gh-post-list-signups {
order: 6;
}
.gh-post-list-conversions {
order: 7;
}
.gh-post-list-updated {
display: inline-block;
order: 6;
@ -451,6 +467,20 @@
.gh-content-email-stats-mobile {
display: inherit;
padding: 0 0.25em;
}
.gh-content-attribution-stats {
display: none;
}
.gh-content-attribution-stats-mobile {
display: inherit;
padding: 0 0.25em;
}
.posts-list .gh-list-nodata {
display: none;
}
}