0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-02-24 23:48:13 -05:00

Post list responsive CSS fixes

no issue
- fixed title display for mobile
- fixed scrolling for content filters
- fixed list cells styles
This commit is contained in:
Peter Zimon 2019-10-18 13:05:34 +02:00
parent aee7430263
commit 02d8fe89eb
3 changed files with 38 additions and 6 deletions

View file

@ -43,6 +43,16 @@
border-bottom-right-radius: 5px; border-bottom-right-radius: 5px;
} }
.gh-list-row:not(.header):first-of-type {
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.gh-list-row:last-of-type {
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
.gh-list-cell { .gh-list-cell {
display: table-cell; display: table-cell;
vertical-align: middle; vertical-align: middle;

View file

@ -247,6 +247,19 @@
margin: 0; margin: 0;
} }
.gh-posts-list-item:nth-of-type(2) {
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.gh-posts-list-item:hover {
background: var(--whitegrey-l2);
}
.gh-posts-list-item:hover .gh-list-data {
background: none !important;
}
.gh-post-list-featured { .gh-post-list-featured {
display: block; display: block;
order: 1; order: 1;
@ -254,6 +267,7 @@
position: absolute; position: absolute;
left: -6px; left: -6px;
top: 4px; top: 4px;
border: none;
} }
.gh-post-list-title { .gh-post-list-title {
@ -324,12 +338,13 @@
flex-direction: column; flex-direction: column;
align-items: flex-end; align-items: flex-end;
margin-top: 18px; margin-top: 18px;
overflow-y: hidden;
} }
.post-header .view-actions .gh-contentfilter { .post-header .view-actions .gh-contentfilter {
order: 2; order: 2;
margin: 10px 0; margin: 10px 0 -20px;
padding: 6px 2px; padding: 6px 2px 26px 22px;
max-width: calc(100vw - 10px); max-width: calc(100vw - 10px);
overflow-x: auto; overflow-x: auto;
} }
@ -341,7 +356,7 @@
} }
.post-header .gh-canvas-title { .post-header .gh-canvas-title {
left: 20px; left: 25px;
} }
.gh-post-list-updated { .gh-post-list-updated {
@ -353,6 +368,16 @@
} }
} }
@media (max-width: 430px) {
.post-header .view-actions .gh-contentfilter {
border-right: 1px solid var(--whitegrey-d1);
}
.gh-contentfilter-sort {
padding-right: 8px;
}
}
@media (min-width: 901px) { @media (min-width: 901px) {
.gh-posts-list-item a:after { .gh-posts-list-item a:after {
display: none; display: none;

View file

@ -669,9 +669,6 @@
} }
@media (max-width: 500px) { @media (max-width: 500px) {
.gh-canvas-title {
display: block;
}
.gh-canvas-title svg { .gh-canvas-title svg {
margin: 0 5px; margin: 0 5px;
} }