sabin/deus-gaming
1
0
Fork 0
forked from achmizs/deus-gaming
Code Issues Pull Requests Releases Wiki Activity

Mobile layout for gallery view pages

Browse Source
This commit is contained in:
Said Achmiz 2020-02-13 20:38:41 -05:00
parent 106721e202
commit 2b6ad04d9e
1 changed files with 41 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
assets/css/main.css
View File

@ -603,29 +603,40 @@ main.gallery-layout {
align-items: start;
margin: 1rem 1rem 0 1rem;
}
@media only screen and (max-width: 960px) {
main.gallery-layout {
grid-template-columns: 1fr;
}
}
main.gallery-layout article {
grid-column-start: -2;
grid-row: 1;
margin-top: 5rem;
}
@media only screen and (max-width: 960px) {
main.gallery-layout article {
margin-top: 1rem;
}
}
main.gallery-layout article h1 {
@media only screen and (min-width: 961px) {
main.gallery-layout article h1 {
border: none;
background-color: transparent;
box-shadow: none;
float: none;
padding: 0;
margin: -7.5rem 0 2.75rem calc(-1 * var(--deus-post-padding));
font-size: 2.5em;
line-height: 1.1;
font-size: 3em;
}
main.gallery-layout article h1::after {
position: absolute;
padding: 0;
left: 0;
margin: 0;
bottom: calc(100% + 1.5rem);
}
main.gallery-layout article h1::after {
content: none;
}
@media only screen and (max-width: 960px) {
main.gallery-layout article h1 {
margin-left: 0;
margin-right: 0;
}
}
@ -636,12 +647,9 @@ main.gallery-layout article h1::after {
}
.gallery {
--deus-gallery-column-count: 12;
--deus-gallery-grid-gap: 0.5em;
display: grid;
grid-template-columns: repeat(var(--deus-gallery-column-count), auto);
grid-gap: var(--deus-gallery-grid-gap);
grid-template-columns: repeat(12, auto);
grid-gap: 0.5em;
align-content: start;
}
@ -654,3 +662,16 @@ main.gallery-layout article h1::after {
.gallery .small {
grid-column: span 4;
}
@media only screen and (max-width: 960px) {
.gallery {
grid-template-columns: repeat(6, auto);
grid-gap: 0.75em;
}
.gallery .large {
grid-column: span 6;
}
.gallery .small {
grid-column: span 3;
}
}