More responsive tweaks so new Dashboard works on mobile

refs: https://github.com/TryGhost/Team/issues/1531

- better resource breakpoints at mobile widths
- also fixed the active mobile button in mobile as it was white in dark mode
This commit is contained in:
James Morris 2022-05-05 15:53:49 +01:00
parent 0fda84d71e
commit 27cb5a9fec
2 changed files with 31 additions and 0 deletions

View File

@ -175,6 +175,11 @@ input:focus,
.gh-mobile-nav-bar {
background: #191b1f;
}
.gh-mobile-nav-bar a.active {
background: #111213;
color: #fff;
}
}
.gh-nav-search .ember-power-select-trigger {
@ -1157,3 +1162,7 @@ kbd {
.gh-dashboard5-list-item:hover {
background: #1c1e21;
}
.gh-dashboard5-community .gh-dashboard5-resource-footer {
color: #fff;
}

View File

@ -1730,3 +1730,25 @@ Dashboard v5 Tooltips */
padding-bottom: 0;
}
}
@media screen and (max-width: 600px) {
.gh-dashboard5-box.gh-dashboard5-split {
grid-template-columns: 1fr;
grid-template-rows: auto auto;
}
.gh-dashboard5-box.gh-dashboard5-split section {
margin-left: 24px !important;
margin-right: 24px !important;
}
.gh-dashboard5-split {
grid-template-columns: 1fr;
grid-template-rows: auto auto auto;
}
.gh-dashboard5-community {
grid-column: 1;
}
}