MediaWiki:Common.css: Difference between revisions
No edit summary |
No edit summary |
||
| Line 41: | Line 41: | ||
/* Category Tiles Grid */ | /* Category Tiles Grid */ | ||
.category-tiles-container { | .category-tiles-container { | ||
display: grid; | |||
grid-template-columns: repeat(3, 1fr); | |||
gap: 20px; | |||
margin: 0 auto; | |||
max-width: 1200px; | |||
} | } | ||
.category-tile { | .category-tile { | ||
position: relative; | |||
background: var(--background-color-neutral-subtle); | |||
border-radius: 8px; | |||
border: 1px solid var(--border-color-subtle); | |||
overflow: hidden; | |||
} | } | ||
.category-tile:hover { | .category-tile:hover { | ||
background: var(--background-color-neutral); | |||
border: 1px solid var(--border-color-base); | |||
} | } | ||
| Line 69: | Line 68: | ||
.tile-image { | .tile-image { | ||
text-align: center; | |||
} | } | ||
.tile-title { | .tile-title { | ||
text-align: center; | |||
font-weight: bold; | |||
font-size: 1.2em; | |||
} | } | ||
.tile-title a, | .tile-title a, | ||
.tile-title a:hover { | .tile-title a:hover { | ||
padding: 0.75rem; | |||
color: var(--color-base); | |||
text-decoration: none; | |||
} | } | ||
/* Responsive adjustments */ | /* Responsive adjustments */ | ||
@media (max-width: 768px) { | @media (max-width: 768px) { | ||
.category-tiles-container { | |||
grid-template-columns: repeat(2, 1fr); | |||
} | |||
.tile-image { | |||
height: 140px; | |||
} | |||
.tile-image img { | |||
height: 140px; | |||
width: 140px; | |||
} | |||
} | } | ||
@media (max-width: 300px) { | @media (max-width: 300px) { | ||
.category-tiles-container { | |||
grid-template-columns: 1fr; | |||
} | |||
} | } | ||