Add media queries for grid tour styling.
This commit is contained in:
parent
771e69c631
commit
43ac3c9cf3
|
@ -3,8 +3,16 @@
|
|||
.tours {
|
||||
display: grid;
|
||||
gap: 16px;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
grid-template-columns: repeat(var(--columns, 3), 1fr);
|
||||
margin-top: 16px;
|
||||
|
||||
@media (width <= 1200px) {
|
||||
--columns: 2;
|
||||
}
|
||||
|
||||
@media (width <= 800px) {
|
||||
--columns: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.tour {
|
||||
|
@ -21,7 +29,7 @@
|
|||
|
||||
.tour-description,
|
||||
.tour-link {
|
||||
grid-column: 1 / 3;
|
||||
grid-column: span 2;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue