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

Applied mobile styles to Dashboard

Browse Source
This commit is contained in:
Peter Zimon 2021-02-18 12:27:29 +01:00
parent d84a70752d
commit f464bfe085
2 changed files with 37 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
ghost/admin/app/styles/layouts/dashboard.css
View File

@ -59,7 +59,7 @@
.gh-dashboard-container.col-2 {
grid-template-columns: 1fr 1fr;
grid-gap: 32px;
grid-gap: var(--dashboard-gap);
}
/* Generic box containers */
@ -70,7 +70,7 @@
border: 1px solid var(--whitegrey);
border-radius: 3px;
padding: 24px;
margin-bottom: 32px;
margin-bottom: var(--dashboard-gap);
}
.gh-dashboard-box.grey {
@ -401,4 +401,35 @@
margin-left: 12px;
color: var(--midgrey);
font-size: 1.3rem;
}
@media (max-width: 1240px) {
.gh-dashboard {
grid-template-columns: 1fr 1fr;
}
.gh-dashboard-area.charts {
grid-template-columns: 1fr 1fr;
}
.gh-dashboard-summary {
flex-basis: 140px;
}
.gh-dashboard-summary:not(.small) .data {
font-size: 3.4rem;
}
.gh-dashboard-summary:not(.small) .growth {
font-size: 1.5rem;
}
.gh-dashboard-container.col-2 {
grid-template-columns: 1fr;
grid-gap: 0;
}
.gh-dashboard-area.charts {
min-height: 240px;
}
}

5
ghost/admin/app/templates/dashboard.hbs
View File

@ -8,7 +8,10 @@
<div class="view-container gh-dashboard">
<section class="gh-dashboard-area charts">
<div class="gh-dashboard-box mrr">
<h4 class="gh-dashboard-header">MRR</h4>
<div class="flex items-center justify-between">
<h4 class="gh-dashboard-header">MRR</h4>
<h4 class="gh-dashboard-header secondary">30 days</h4>
</div>
<div class="gh-dashboard-chart-container">
<div class="gh-dashboard-summary">
<div class="data">$359</div>