0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-01-27 22:49:56 -05:00

Added resource section to post analytics page

Refs https://github.com/TryGhost/Team/issues/1918
This commit is contained in:
Sanne de Vries 2022-09-16 16:09:54 +01:00
parent 29e5a91323
commit a4ff3e1900
5 changed files with 79 additions and 4 deletions

View file

@ -1,7 +1,7 @@
<section class="gh-dashboard-resource gh-dashboard-newsletter" {{did-insert this.load}}> <section class="gh-dashboard-resource gh-dashboard-newsletter" {{did-insert this.load}}>
<article class="gh-dashboard-resource-box"> <article class="gh-dashboard-resource-box">
<div class="gh-dashboard-resource-title"> <div class="gh-dashboard-resource-title">
<h4>Latest from the newsletter</h4> <h4>The Ghost Newsletter</h4>
</div> </div>
<div class="gh-dashboard-resource-body"> <div class="gh-dashboard-resource-body">
{{#if (not (or this.loading this.error))}} {{#if (not (or this.loading this.error))}}
@ -18,7 +18,7 @@
{{/if}} {{/if}}
</div> </div>
<div class="gh-dashboard-resource-footer"> <div class="gh-dashboard-resource-footer">
<a href="https://ghost.org/resources/newsletter/" target="_blank" class="gh-dashboard-subscribe-button" rel="noopener noreferrer">Subscribe&nbsp;<span>to the newsletter&nbsp;</span>&rarr;</a> <a href="https://ghost.org/resources/newsletter/" target="_blank" class="gh-dashboard-subscribe-button" rel="noopener noreferrer">Get weekly tips in your inbox &rarr;</a>
</div> </div>
</article> </article>
</section> </section>

View file

@ -4,7 +4,7 @@
<a href="{{this.resource.url}}" target="_blank" class="gh-dashboard-resource-thumbnail" rel="noopener noreferrer" style={{html-safe (concat "background-image: url(" this.resource.feature_image ")")}} aria-label="Resource link"></a> <a href="{{this.resource.url}}" target="_blank" class="gh-dashboard-resource-thumbnail" rel="noopener noreferrer" style={{html-safe (concat "background-image: url(" this.resource.feature_image ")")}} aria-label="Resource link"></a>
<div class="gh-dashboard-resource-contents"> <div class="gh-dashboard-resource-contents">
<div class="gh-dashboard-resource-title"> <div class="gh-dashboard-resource-title">
<h4>Resources</h4> <h4>Ghost resources</h4>
</div> </div>
<div class="gh-dashboard-resource-body"> <div class="gh-dashboard-resource-body">
<a href="{{this.resource.url}}" target="_blank" class="gh-dashboard-resource-bigarticle" rel="noopener noreferrer"> <a href="{{this.resource.url}}" target="_blank" class="gh-dashboard-resource-bigarticle" rel="noopener noreferrer">
@ -15,7 +15,7 @@
</a> </a>
</div> </div>
<div class="gh-dashboard-resource-footer"> <div class="gh-dashboard-resource-footer">
<a href="https://ghost.org/resources/" target="_blank" rel="noopener noreferrer">Learn more &rarr;</a> <a href="https://ghost.org/resources/" target="_blank" rel="noopener noreferrer">Read this article &rarr;</a>
</div> </div>
</div> </div>
{{/if}} {{/if}}

View file

@ -740,6 +740,58 @@ a.gh-post-list-signups.active:hover > span, a.gh-post-list-conversions.active:ho
flex-direction: column; flex-direction: column;
} }
.gh-post-stats-box.resources {
grid-template-columns: 1fr 2fr;
grid-gap: 24px;
}
.gh-post-stats-resource {
padding: 2.4rem;
background: var(--white);
border-radius: var(--border-radius);
box-shadow: 0 1px 4px -1px rgba(0,0,0,.1);
transition: all .3s ease-in-out;
}
.gh-post-stats-resource:hover {
transform: translateY(-4px);
transition: all .3s ease-in-out;
box-shadow:
0 54px 80px rgba(0,0,0,.07),
0 19.7109px 29.2013px rgba(0,0,0,.0482987),
0 9.56927px 14.1767px rgba(0,0,0,.0389404),
0 4.69103px 6.94968px rgba(0,0,0,.0310596),
0 1.85484px 2.74791px rgba(0,0,0,.0217013)
;
}
.gh-post-stats-resource.image {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 24px;
}
.gh-post-stats-resource .thumbnail {
border-radius: var(--border-radius);
width: 100%;
height: auto;
background: transparent;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
background-image: url(img/marketing/analytics-1.jpg);
aspect-ratio: 3 / 2;
filter: brightness(1.08);
}
.gh-post-stats-resource p {
font-size: 1.5rem;
letter-spacing: 0;
line-height: 1.55;
color: var(--middarkgrey);
margin: 0 0 1rem;
}
.gh-post-stats-title { .gh-post-stats-title {
margin: 0; margin: 0;
padding: 0 0 2px; padding: 0 0 2px;

View file

@ -62,5 +62,28 @@
</div> </div>
</div> </div>
</div> </div>
<h4 class="gh-main-section-header small bn">
Get started with analytics
</h4>
<div class="gh-post-stats-box resources">
<div class="gh-post-stats-resource flex flex-column justify-between">
<div>
<h3>📈 Understand analytics in Ghost</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
<div class="gh-btn gh-btn-link">Become an expert &rarr;</div>
</div>
<div class="gh-post-stats-resource image">
<div class="thumbnail"></div>
<div class="flex flex-column justify-between">
<div>
<h3>How to best share your shiz</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
<div class="gh-btn gh-btn-link">Sharing is caring &rarr;</div>
</div>
</div>
</div>
</section> </section>

Binary file not shown.

After

Width:  |  Height:  |  Size: 51 KiB