Added in a better responsive design to the new empty state for new Dashboard

refs: https://github.com/TryGhost/Team/issues/1594
This commit is contained in:
James Morris 2022-05-09 16:47:34 +01:00
parent 53235a2c33
commit c0fd3e288b
3 changed files with 14 additions and 7 deletions

View File

@ -7,7 +7,7 @@
<Dashboard::V5::Charts::Overview />
{{/if}}
<div class="gh-dashboard5-group">
<div class="gh-dashboard5-group {{if this.isTotalMembersZero 'is-zero'}}">
<Dashboard::V5::Charts::Anchor />
{{#if this.areNewslettersEnabled}}

View File

@ -4,21 +4,21 @@
@label="Engagement" />
<div class="gh-dashboard5-columns">
<div class="gh-dashboard5-column">
<div class="gh-dashboard5-column gh-dashboard5-engagement-30days">
<Dashboard::v5::Parts::Metric
@label="Engaged in the last 30 days"
@value={{this.data30Days}}
@secondary={{true}}
/>
</div>
<div class="gh-dashboard5-column">
<div class="gh-dashboard5-column gh-dashboard5-engagement-7days">
<Dashboard::v5::Parts::Metric
@label="Engaged in the last 7 days"
@value={{this.data7Days}}
@secondary={{true}}
/>
</div>
<div class="gh-dashboard5-column">
<div class="gh-dashboard5-column gh-dashboard5-engagement-subscribers">
<Dashboard::v5::Parts::Metric
@label="Newsletter subscribers"
@value={{this.dataSubscribers}}

View File

@ -907,7 +907,7 @@ Dashboard v5 Zero */
background: #fff url(icons/analytics.svg) no-repeat 50% 36px;
background-size: 48px 48px;
min-width: 400px;
padding: 96px 64px 48px;
padding: 96px 48px 48px;
border-radius: 8px;
text-align: center;
box-shadow: 0 4px 24px rgba(0,0,0,0.066);
@ -1817,8 +1817,15 @@ Dashboard v5 Tooltips */
border-bottom: 0 none;
padding-bottom: 0;
}
}
.is-zero .gh-dashboard5-mrr,
.is-zero .gh-dashboard5-breakdown,
.is-zero .gh-dashboard5-mix,
.is-zero .gh-dashboard5-engagement-30days,
.is-zero .gh-dashboard5-engagement-7days {
display: none;
}
}
@media screen and (max-width: 600px) {
.gh-dashboard5-box.gh-dashboard5-split {
@ -1839,4 +1846,4 @@ Dashboard v5 Tooltips */
.gh-dashboard5-community {
grid-column: 1;
}
}
}