mirror of
https://github.com/TryGhost/Ghost.git
synced 2025-03-18 02:21:47 -05:00
Replaced Staff Picks with Explore feed
no issue - Deleted staff picks - Added Explore Feed Dashboard resource - Added styles and svgs - Moved "What's New" resource into a split box with community box
This commit is contained in:
Aileen Nowak
Aileen Booker
parent
1f177e1c17
commit
beaf7464c6
10 changed files with 293 additions and 140 deletions
|
|
@ -0,0 +1,47 @@
|
|||
<section class="gh-dashboard-section gh-dashboard-explore-feed" {{did-insert this.load}}>
|
||||
<article class="gh-dashboard-box">
|
||||
<div class="gh-dashboard-resource-title is-large">
|
||||
<div>
|
||||
<h4>Featured publications</h4>
|
||||
<p>Explore great content being published on Ghost.</p>
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://ghost.org/explore/" target="_blank" rel="noopener noreferrer">Browse sites</a>
|
||||
<LinkTo @route="explore" class="gh-dashboard-explore-add">Add your site to Explore <span>{{svg-jar "ghost-favicon-pink" alt="Ghost" class="w4 v-mid"}}</span></LinkTo>
|
||||
</div>
|
||||
</div>
|
||||
<div class="gh-dashboard-resource-body">
|
||||
<div class="gh-dashboard-columns">
|
||||
{{#if (not (or this.loading this.error))}}
|
||||
{{#each this.sites as |entry|}}
|
||||
<a class="gh-dashboard-column gh-dashboard-explore-card" href={{entry.url}} target="_blank" rel="noopener noreferrer">
|
||||
<div class="gh-dashboard-explore-header">
|
||||
<div class="gh-dashboard-explore-icon">
|
||||
<img src={{entry.icon}} alt={{entry.title}} />
|
||||
</div>
|
||||
<div class="gh-dashboard-explore-title gap-2">
|
||||
<h5 class="truncate">{{entry.title}}</h5>
|
||||
</div>
|
||||
<p>{{entry.description}}</p>
|
||||
</div>
|
||||
<div class="gh-dashboard-explore-footer text-xs md:text-sm mt-5 gap-3 font-medium">
|
||||
<p class="truncate">{{entry.pretty_url}}</p>
|
||||
{{#if entry.mrr}}
|
||||
<div class="gh-dashboard-explore-mrr">{{entry.mrr}}</div>
|
||||
{{else if entry.members}}
|
||||
<div class="gh-dashboard-explore-members">{{entry.members}}</div>
|
||||
{{else}}
|
||||
<div class="gh-dashboard-explore-arrow">→</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
</a>
|
||||
{{else}}
|
||||
<div class="gh-dashboard-list-empty">
|
||||
<p>No sites yet.</p>
|
||||
</div>
|
||||
{{/each}}
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
import Component from '@glimmer/component';
|
||||
import fetch from 'fetch';
|
||||
import {action} from '@ember/object';
|
||||
import {task} from 'ember-concurrency';
|
||||
import {tracked} from '@glimmer/tracking';
|
||||
|
||||
const API_URL = 'https://ghost.org';
|
||||
|
||||
export default class ExploreFeed extends Component {
|
||||
@tracked loading = null;
|
||||
@tracked error = null;
|
||||
@tracked sites = null;
|
||||
|
||||
@action
|
||||
load() {
|
||||
this.loading = true;
|
||||
this.fetch.perform().then(() => {
|
||||
this.loading = false;
|
||||
}).catch((error) => {
|
||||
this.error = error;
|
||||
this.loading = false;
|
||||
});
|
||||
}
|
||||
|
||||
@task
|
||||
*fetch() {
|
||||
const response = yield fetch(`${API_URL}/explore/api/feed/`);
|
||||
if (!response.ok) {
|
||||
// eslint-disable-next-line
|
||||
console.error('Failed to fetch sites', {response});
|
||||
this.error = 'Failed to fetch';
|
||||
return;
|
||||
}
|
||||
|
||||
const result = yield response.json();
|
||||
this.sites = result.sites || [];
|
||||
}
|
||||
}
|
||||
|
|
@ -1,33 +0,0 @@
|
|||
<section class="gh-dashboard-resource gh-dashboard-staff-picks" {{did-insert this.load}}>
|
||||
<article class="gh-dashboard-resource-box">
|
||||
<div class="gh-dashboard-resource-title is-large has-border">
|
||||
<h4>Staff picks</h4>
|
||||
<p>Hand picked stories from around the web, published with Ghost.</p>
|
||||
</div>
|
||||
<div class="gh-dashboard-resource-body">
|
||||
<div class="gh-dashboard-list">
|
||||
{{#if (not (or this.loading this.error))}}
|
||||
<div class="gh-dashboard-list-body">
|
||||
{{#each this.staffPicks as |entry|}}
|
||||
<div class="gh-dashboard-list-item">
|
||||
<a class="gh-dashboard-list-post permalink" href={{set-query-params entry.link utm_source='ghost'}} target="_blank" rel="noopener noreferrer">
|
||||
<span class="gh-dashboard-list-link">
|
||||
<span>{{entry.title}}</span>
|
||||
</span>
|
||||
<div class="gh-dashboard-resource-secondary">{{entry.creator}}</div>
|
||||
</a>
|
||||
</div>
|
||||
{{else}}
|
||||
<div class="gh-dashboard-list-empty">
|
||||
<p>No staff picks yet.</p>
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="gh-dashboard-resource-footer">
|
||||
<a href="https://twitter.com/ghoststaffpicks" target="_blank" rel="noopener noreferrer">{{svg-jar "twitter-logo"}} <span>Follow on Twitter</span></a>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
|
|
@ -1,57 +0,0 @@
|
|||
import Component from '@glimmer/component';
|
||||
import fetch from 'fetch';
|
||||
import {action} from '@ember/object';
|
||||
import {task} from 'ember-concurrency';
|
||||
import {tracked} from '@glimmer/tracking';
|
||||
|
||||
const RSS_FEED_URL = 'https://zapier.com/engine/rss/678920/ghoststaffpicks';
|
||||
const LIMIT = 3;
|
||||
|
||||
export default class StaffPicks extends Component {
|
||||
@tracked loading = null;
|
||||
@tracked error = null;
|
||||
@tracked staffPicks = null;
|
||||
|
||||
@action
|
||||
load() {
|
||||
this.loading = true;
|
||||
this.fetch.perform().then(() => {
|
||||
this.loading = false;
|
||||
}, (error) => {
|
||||
this.error = error;
|
||||
this.loading = false;
|
||||
});
|
||||
}
|
||||
|
||||
@task
|
||||
*fetch() {
|
||||
let response = yield fetch(RSS_FEED_URL);
|
||||
if (!response.ok) {
|
||||
// eslint-disable-next-line
|
||||
console.error('Failed to fetch staff picks', {response});
|
||||
this.error = 'Failed to fetch';
|
||||
return;
|
||||
}
|
||||
|
||||
const str = yield response.text();
|
||||
const document = new DOMParser().parseFromString(str, 'text/xml');
|
||||
|
||||
const items = document.querySelectorAll('channel > item');
|
||||
this.staffPicks = [];
|
||||
|
||||
for (let index = 0; index < items.length && index < LIMIT; index += 1) {
|
||||
const item = items[index];
|
||||
const title = item.getElementsByTagName('title')[0].textContent;
|
||||
const link = item.getElementsByTagName('link')[0].textContent;
|
||||
const creator = item.getElementsByTagName('dc:creator')[0].textContent;
|
||||
|
||||
const entry = {
|
||||
title,
|
||||
link,
|
||||
creator
|
||||
};
|
||||
|
||||
this.staffPicks.push(entry);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,8 +1,7 @@
|
|||
<section class="gh-dashboard-resource gh-dashboard-whats-new" {{did-insert this.load}}>
|
||||
<article class="gh-dashboard-resource-box">
|
||||
<div class="gh-dashboard-resource-title is-large has-border">
|
||||
<h4>What's new</h4>
|
||||
<p>All the latest improvements.</p>
|
||||
<div class="gh-dashboard-resource-title has-border">
|
||||
<h4>{{svg-jar "gift" alt="Gift" class="v-mid"}}What's new</h4>
|
||||
</div>
|
||||
<div class="gh-dashboard-resource-body">
|
||||
<div class="gh-dashboard-list {{if this.whatsNew.hasNew "has-new"}}">
|
||||
|
|
@ -15,7 +14,7 @@
|
|||
<span>{{entry.title}}</span>
|
||||
</span>
|
||||
<div class="gh-dashboard-resource-secondary">{{moment-format entry.published_at "D MMM YYYY"}}</div>
|
||||
</LinkTo>
|
||||
</LinkTo>
|
||||
</div>
|
||||
{{else}}
|
||||
<div class="gh-dashboard-list-empty">
|
||||
|
|
|
|||
|
|
@ -1186,7 +1186,6 @@ kbd {
|
|||
}
|
||||
|
||||
.gh-dashboard-resource-box.is-secondary .gh-dashboard-resource-footer,
|
||||
.gh-dashboard-staff-picks .gh-dashboard-resource-box,
|
||||
.gh-dashboard-whats-new .gh-dashboard-resource-box {
|
||||
border-color: #26282b;
|
||||
}
|
||||
|
|
@ -1314,4 +1313,4 @@ kbd {
|
|||
|
||||
.ember-power-select-option[aria-current="true"] .kg-settings-link-url::after {
|
||||
background: linear-gradient(90deg, rgba(19,20,22,0) 0%, rgba(19,20,22,1) 100%);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard Control Panel */
|
||||
|
||||
.prototype-control-panel {
|
||||
margin-top: 50vh; /* Keep it out of view */
|
||||
}
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard Layout */
|
||||
|
||||
.gh-dashboard-layout {
|
||||
|
|
@ -33,8 +33,13 @@ Dashboard Layout */
|
|||
grid-template-columns: 2fr 1fr;
|
||||
}
|
||||
|
||||
.gh-dashboard-split.is-reverse {
|
||||
grid-template-columns: 1fr 2fr;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1320px) {
|
||||
.gh-dashboard-split {
|
||||
.gh-dashboard-split,
|
||||
.gh-dashboard-split.is-reverse {
|
||||
grid-template-columns: 1fr 1fr;
|
||||
}
|
||||
}
|
||||
|
|
@ -81,22 +86,26 @@ Dashboard Layout */
|
|||
align-items: stretch;
|
||||
}
|
||||
|
||||
.gh-dashboard-box.no-boarder {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.gh-dashboard-box.gh-dashboard-split {
|
||||
display: grid;
|
||||
padding: 24px 0;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.gh-dashboard-box.gh-dashboard-split section:nth-child(odd) {
|
||||
.gh-dashboard-box.gh-dashboard-split:not(.gh-dashboard-box.no-boarder) section:nth-child(odd) {
|
||||
margin-left: 24px;
|
||||
}
|
||||
|
||||
.gh-dashboard-box.gh-dashboard-split section:nth-child(even) {
|
||||
.gh-dashboard-box.gh-dashboard-split:not(.gh-dashboard-box.no-boarder) section:nth-child(even) {
|
||||
margin-left: 0;
|
||||
margin-right: 24px;
|
||||
}
|
||||
|
||||
.gh-dashboard-box.is-secondary {
|
||||
.gh-dashboard-resource-box {
|
||||
background: var(--main-color-content-greybg);
|
||||
border-color: var(--main-color-content-greybg);
|
||||
}
|
||||
|
|
@ -190,7 +199,7 @@ Dashboard Layout */
|
|||
width: 49%;
|
||||
margin-left: 50%;
|
||||
}
|
||||
|
||||
|
||||
.gh-dashboard-minichart.gh-dashboard-mix.is-cadence .gh-dashboard-chart-box {
|
||||
width: 64%;
|
||||
margin-left: 35%;
|
||||
|
|
@ -250,7 +259,7 @@ Dashboard Layout */
|
|||
letter-spacing: 0;
|
||||
color: var(--midgrey);
|
||||
padding: 0 0 0 16px;
|
||||
position: relative;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.gh-dashboard-legend-item::after {
|
||||
|
|
@ -390,7 +399,7 @@ Dashboard Layout */
|
|||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard Chart */
|
||||
|
||||
.gh-dashboard-chart {
|
||||
|
|
@ -486,7 +495,7 @@ Dashboard Chart */
|
|||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard Percentage */
|
||||
|
||||
.gh-dashboard-percentage {
|
||||
|
|
@ -511,7 +520,7 @@ Dashboard Percentage */
|
|||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard Metric */
|
||||
|
||||
.gh-dashboard-metric {
|
||||
|
|
@ -596,7 +605,7 @@ Dashboard Metric */
|
|||
}
|
||||
|
||||
.gh-dashboard-metric.is-tooltip .gh-dashboard-metric-label {
|
||||
font-size: 1.3rem;
|
||||
font-size: 1.3rem;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
|
|
@ -629,7 +638,7 @@ Dashboard Metric */
|
|||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard List */
|
||||
|
||||
.gh-dashboard-list {
|
||||
|
|
@ -755,7 +764,7 @@ Dashboard List */
|
|||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard Overview */
|
||||
|
||||
.gh-dashboard-overview {
|
||||
|
|
@ -789,7 +798,7 @@ Dashboard Overview */
|
|||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard Anchor */
|
||||
|
||||
@keyframes chartFadeIn {
|
||||
|
|
@ -843,7 +852,7 @@ Dashboard Anchor */
|
|||
margin-right: 2px;
|
||||
}
|
||||
|
||||
.gh-dashboard-anchor .gh-dashboard-stats-button.is-selected {
|
||||
.gh-dashboard-anchor .gh-dashboard-stats-button.is-selected {
|
||||
color: var(--black);
|
||||
background: var(--white);
|
||||
box-shadow: 0 2px 4px rgb(0 0 0 / 2%);
|
||||
|
|
@ -897,7 +906,7 @@ Dashboard Anchor */
|
|||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard Zero */
|
||||
|
||||
.gh-dashboard-zero {
|
||||
|
|
@ -974,7 +983,7 @@ Dashboard Zero */
|
|||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard Engagement */
|
||||
|
||||
.gh-dashboard-engagement {
|
||||
|
|
@ -991,7 +1000,7 @@ Dashboard Engagement */
|
|||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard Recent Posts */
|
||||
|
||||
.gh-dashboard-recent-posts {
|
||||
|
|
@ -1051,7 +1060,7 @@ Dashboard Recent Posts */
|
|||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard Recent Activity */
|
||||
|
||||
.gh-dashboard-recent-activity {
|
||||
|
|
@ -1110,7 +1119,7 @@ Dashboard Recent Activity */
|
|||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard Recents */
|
||||
|
||||
.gh-dashboard-recents {
|
||||
|
|
@ -1223,7 +1232,7 @@ Dashboard Recents */
|
|||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard Resources */
|
||||
|
||||
.gh-dashboard-resources {
|
||||
|
|
@ -1311,7 +1320,7 @@ Dashboard Resources */
|
|||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard Multi */
|
||||
|
||||
.gh-dashboard-multi {
|
||||
|
|
@ -1363,7 +1372,7 @@ Dashboard Multi */
|
|||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard Latest Newsletters */
|
||||
|
||||
.gh-dashboard-newsletter {
|
||||
|
|
@ -1403,13 +1412,38 @@ Dashboard Latest Newsletters */
|
|||
}
|
||||
}
|
||||
|
||||
/* ---------------------------------
|
||||
Dashboard What's New */
|
||||
|
||||
/* ---------------------------------
|
||||
.gh-dashboard-whats-new .gh-dashboard-resource-box {
|
||||
background: var(--main-color-content-greybg);
|
||||
border-color: var(--main-color-content-greybg);
|
||||
}
|
||||
|
||||
.gh-dashboard-whats-new .gh-dashboard-resource-title:not(.is-large) h4 {
|
||||
display: flex;
|
||||
color: var(--black);
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.gh-dashboard-whats-new .gh-dashboard-resource-title svg {
|
||||
fill: var(--pink);
|
||||
width: 1.8rem;
|
||||
height: auto;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.gh-dashboard-whats-new .gh-dashboard-list-link span {
|
||||
font-size: 1.8rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
/* ---------------------------------
|
||||
Dashboard Community */
|
||||
|
||||
.gh-dashboard-community {
|
||||
position: relative;
|
||||
grid-column: 1 / 3;
|
||||
grid-column: 2 / 3;
|
||||
}
|
||||
|
||||
.gh-dashboard-community .gh-dashboard-resource-box {
|
||||
|
|
@ -1422,7 +1456,7 @@ Dashboard Community */
|
|||
padding-top: 32px;
|
||||
transition: all 1.2s ease-in-out;
|
||||
border: 0 none;
|
||||
}
|
||||
}
|
||||
|
||||
.gh-dashboard-community .gh-dashboard-resource-box:hover {
|
||||
box-shadow: 0 54px 80px rgb(0 0 0 / 7%), 0 19.7109px 29.2013px rgb(0 0 0 / 5%), 0 9.56927px 14.1767px rgb(0 0 0 / 4%), 0 4.69103px 6.94968px rgb(0 0 0 / 3%), 0 1.85484px 2.74791px rgb(0 0 0 / 2%);
|
||||
|
|
@ -1453,7 +1487,7 @@ Dashboard Community */
|
|||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard Misc */
|
||||
|
||||
.gh-dashboard .gh-list-header {
|
||||
|
|
@ -1493,7 +1527,7 @@ Dashboard Misc */
|
|||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard Resource */
|
||||
|
||||
.gh-dashboard-resource {
|
||||
|
|
@ -1585,7 +1619,7 @@ Dashboard Resource */
|
|||
width: 100%;
|
||||
height: auto;
|
||||
background: transparent;
|
||||
background-repeat: no-repeat;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
background-image: url(img/resource-1.jpg);
|
||||
|
|
@ -1622,7 +1656,7 @@ Dashboard Resource */
|
|||
display: -webkit-box;
|
||||
line-clamp: 3;
|
||||
-webkit-line-clamp: 3;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
|
@ -1728,25 +1762,129 @@ Dashboard Resource */
|
|||
transition: all .3s ease-in-out;
|
||||
}
|
||||
|
||||
.gh-dashboard-staff-picks .gh-dashboard-resource-footer a {
|
||||
.gh-dashboard-explore-feed .gh-dashboard-resource-title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.gh-dashboard-explore-feed .gh-dashboard-resource-title a:not(.gh-dashboard-explore-add) {
|
||||
color: var(--middarkgrey);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.gh-dashboard-explore-add {
|
||||
color: var(--pink);
|
||||
margin-left: 10px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.gh-dashboard-explore-add span {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
}
|
||||
|
||||
.gh-dashboard-explore-card {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
padding: 6rem;
|
||||
height: 100%;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.gh-dashboard-explore-header {
|
||||
flex-shrink: 1;
|
||||
}
|
||||
|
||||
.gh-dashboard-explore-icon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #1DA1F2;
|
||||
font-weight: 500;
|
||||
justify-content: center;
|
||||
margin-bottom: 3rem;
|
||||
overflow: hidden;
|
||||
font-size: 1.2rem;
|
||||
color: var(--middarkgrey);
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border-radius: 999px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.gh-dashboard-staff-picks .gh-dashboard-resource-footer a:hover {
|
||||
color: #1788ce;
|
||||
.gh-dashboard-explore-icon img {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.gh-dashboard-staff-picks .gh-dashboard-resource-footer svg {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 5px;
|
||||
.gh-dashboard-explore-header p {
|
||||
margin: 8px 0 16px;
|
||||
padding: 0;
|
||||
color: var(--middarkgrey);
|
||||
font-size: 1.55rem;
|
||||
line-clamp: 2;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
.gh-dashboard-explore-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.gh-dashboard-explore-title h5 {
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.gh-dashboard-explore-footer {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.gh-dashboard-explore-footer p {
|
||||
margin: 0;
|
||||
font-weight: 600;
|
||||
color: var(--black);
|
||||
}
|
||||
|
||||
.gh-dashboard-explore-mrr,
|
||||
.gh-dashboard-explore-members {
|
||||
flex-shrink: 0;
|
||||
font-size: 1.2rem;
|
||||
font-weight: 700;
|
||||
color: var(--white);
|
||||
padding: .4rem .8rem;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.gh-dashboard-explore-members {
|
||||
background: var(--black);
|
||||
}
|
||||
|
||||
.gh-dashboard-explore-mrr {
|
||||
background: var(--pink);
|
||||
}
|
||||
|
||||
.gh-dashboard-explore-arrow {
|
||||
height: 2.4rem;
|
||||
width: 2.4rem;
|
||||
display: flex;
|
||||
border: 1px solid var(--black);
|
||||
border-radius: 999px;
|
||||
color: var(--black);
|
||||
padding: .4rem;
|
||||
line-height: 1em;
|
||||
transition: all .15s cubic-bezier(.4,0,.2,1);
|
||||
}
|
||||
|
||||
.gh-dashboard-explore-arrow:hover {
|
||||
color: var(--white);
|
||||
background: var(--black);
|
||||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard Tooltips */
|
||||
|
||||
.gh-dashboard-tooltip {
|
||||
|
|
@ -1968,6 +2106,17 @@ Dashboard Tooltips */
|
|||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 800px) and (max-width: 1000px) {
|
||||
.gh-dashboard-split.is-reverse {
|
||||
grid-template-columns: 1fr;
|
||||
grid-template-rows: auto auto;
|
||||
}
|
||||
|
||||
.gh-dashboard-community {
|
||||
grid-column: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
.gh-dashboard-box.gh-dashboard-split {
|
||||
grid-template-columns: 1fr;
|
||||
|
|
@ -1984,13 +2133,18 @@ Dashboard Tooltips */
|
|||
grid-template-rows: auto auto auto;
|
||||
}
|
||||
|
||||
.gh-dashboard-split.is-reverse {
|
||||
grid-template-columns: 1fr;
|
||||
grid-template-rows: auto auto;
|
||||
}
|
||||
|
||||
.gh-dashboard-community {
|
||||
grid-column: 1;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* ---------------------------------
|
||||
/* ---------------------------------
|
||||
Dashboard No Data */
|
||||
|
||||
.gh-no-data-list {
|
||||
|
|
|
|||
|
|
@ -35,8 +35,10 @@
|
|||
<Dashboard::Resources::Resources />
|
||||
<Dashboard::Resources::Newsletter />
|
||||
</div>
|
||||
<div class="gh-dashboard-split">
|
||||
<Dashboard::Resources::StaffPicks />
|
||||
|
||||
<Dashboard::Resources::ExploreFeed />
|
||||
|
||||
<div class="gh-dashboard-split gh-dashboard-box is-reverse no-boarder">
|
||||
<Dashboard::Resources::WhatsNew />
|
||||
<Dashboard::Resources::Community />
|
||||
</div>
|
||||
|
|
|
|||
4
ghost/admin/public/assets/icons/ghost-favicon-pink.svg
Normal file
4
ghost/admin/public/assets/icons/ghost-favicon-pink.svg
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.03084 2.44495C11.1049 2.44495 13.6007 4.92524 13.6007 7.98025C13.6007 11.0353 11.1049 13.5156 8.03084 13.5156C4.95672 13.5156 2.46094 11.0353 2.46094 7.98025C2.46094 4.92524 4.95672 2.44495 8.03084 2.44495ZM3.63479 6.81215C3.91323 4.51915 5.1428 3.37943 7.91565 3.06971C9.23768 2.92201 10.7389 4.03896 11.1629 4.5534C12.0196 5.59294 13.1007 6.83022 13.1007 8.22367C13.1007 10.1022 11.5863 11.1571 9.97081 12.016C9.24272 12.4031 8.45614 12.7778 7.55764 12.7778C5.24841 12.7778 3.30485 10.9756 3.30485 8.6807C3.30485 8.07075 3.55855 7.43995 3.63479 6.81215Z" fill="#FB2D8D" stroke="#FB2D8D" stroke-width="0.6"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.99844 14.0124C11.3674 14.0124 14.0984 11.2983 14.0984 7.9503C14.0984 4.60228 11.3674 1.88818 7.99844 1.88818C4.6295 1.88818 1.89844 4.60228 1.89844 7.9503C1.89844 11.2983 4.6295 14.0124 7.99844 14.0124ZM7.99844 13.3388C10.993 13.3388 13.4207 10.9263 13.4207 7.95029C13.4207 4.97428 10.993 2.56175 7.99844 2.56175C5.00383 2.56175 2.57622 4.97428 2.57622 7.95029C2.57622 10.9263 5.00383 13.3388 7.99844 13.3388Z" fill="#FB2D8D"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 23 KiB After Width: | Height: | Size: 226 KiB |
Loading…
Add table
Reference in a new issue