98 lines
1.5 KiB
SCSS
98 lines
1.5 KiB
SCSS
.newsWrapper {
|
|
margin: 0 calc(var(--spacing-sitepadding-inline)*-1);
|
|
padding: var(--spacing-sitepadding-block) var(--spacing-sitepadding-inline);
|
|
}
|
|
|
|
.newsList {
|
|
display: grid;
|
|
grid-template-columns: repeat(12, 1fr);
|
|
column-gap: var(--spacing-gap-column);
|
|
row-gap: var(--spacing-gap-row);
|
|
|
|
li {
|
|
grid-column: span 3;
|
|
|
|
h2 {
|
|
font-size: 1.4rem;
|
|
}
|
|
|
|
&:nth-child(1),
|
|
&:nth-child(2) {
|
|
grid-column: span 6;
|
|
|
|
h2 {
|
|
font-size: 1.8rem;
|
|
}
|
|
}
|
|
|
|
&:nth-child(3),
|
|
&:nth-child(4),
|
|
&:nth-child(5) {
|
|
grid-column: span 4;
|
|
|
|
h2 {
|
|
font-size: 1.6rem;
|
|
}
|
|
}
|
|
}
|
|
|
|
&.featured {
|
|
li {
|
|
|
|
&:nth-child(1),
|
|
&:nth-child(2),
|
|
&:nth-child(3),
|
|
&:nth-child(4),
|
|
&:nth-child(5) {
|
|
grid-column: span 3;
|
|
|
|
h2 {
|
|
font-size: 1.4rem;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.showMore {
|
|
margin-top: var(--spacing-s);
|
|
text-align: center;
|
|
}
|
|
|
|
@media (max-width: 900px) {
|
|
.newsList, .newsList.featured {
|
|
li {
|
|
grid-column: span 6;
|
|
&:nth-child(1),
|
|
&:nth-child(2),
|
|
&:nth-child(3),
|
|
&:nth-child(4),
|
|
&:nth-child(5){
|
|
grid-column: span 6;
|
|
|
|
h2 {
|
|
font-size: 1.4rem;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
@media (max-width: 600px) {
|
|
.newsList, .newsList.featured {
|
|
li {
|
|
grid-column: span 12;
|
|
&:nth-child(1),
|
|
&:nth-child(2),
|
|
&:nth-child(3),
|
|
&:nth-child(4),
|
|
&:nth-child(5){
|
|
grid-column: span 12;
|
|
|
|
h2 {
|
|
font-size: 1.2rem;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
} |