65 lines
1.3 KiB
CSS
65 lines
1.3 KiB
CSS
/* /assets/css/layout/_grids.css */
|
|
|
|
.about-grid {
|
|
display: grid;
|
|
grid-template-columns: 1fr;
|
|
gap: var(--spacing-l);
|
|
align-items: flex-start;
|
|
}
|
|
|
|
.image-grid {
|
|
display: grid;
|
|
grid-template-columns: 1fr;
|
|
gap: var(--spacing-l);
|
|
margin-bottom: var(--spacing-xl);
|
|
}
|
|
|
|
.services-grid {
|
|
display: grid;
|
|
grid-template-columns: 1fr;
|
|
gap: var(--spacing-l);
|
|
}
|
|
|
|
.blog-grid {
|
|
display: grid;
|
|
grid-template-columns: 1fr;
|
|
gap: var(--spacing-l);
|
|
}
|
|
|
|
.contact-grid {
|
|
display: grid;
|
|
grid-template-columns: 1fr;
|
|
gap: var(--spacing-xl);
|
|
}
|
|
|
|
|
|
/* --- MEDIA QUERIES --- */
|
|
|
|
@media (max-width: 768px) {
|
|
.image-grid, .services-grid, .blog-grid, .contact-grid {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
}
|
|
|
|
@media (min-width: 768px) {
|
|
/* Stili za večje tablice */
|
|
.image-grid { grid-template-columns: 1fr 1fr; }
|
|
.services-grid { grid-template-columns: repeat(2, 1fr); }
|
|
.blog-grid { grid-template-columns: repeat(2, 1fr); }
|
|
}
|
|
|
|
@media (min-width: 992px) {
|
|
/* Stili za namizje */
|
|
.about-grid {
|
|
grid-template-columns: 1fr 2fr;
|
|
gap: var(--spacing-xl);
|
|
}
|
|
.services-grid, .blog-grid {
|
|
grid-template-columns: repeat(3, 1fr);
|
|
gap: var(--spacing-xl);
|
|
}
|
|
.contact-grid {
|
|
grid-template-columns: 1fr 1fr;
|
|
align-items: flex-start;
|
|
}
|
|
} |