MediaWiki:Common.css: відмінності між версіями
place-card vertical layout + .places-grid 2-col
(fix selector: use .createboxInput (works for all field types, not only [type=text])) |
(place-card vertical layout + .places-grid 2-col) |
||
| Рядок 1: | Рядок 1: | ||
/* Place card */ | /* Place card — vertical layout (image top, body below) */ | ||
.place-card{ | .place-card { | ||
display:flex; | display: flex; | ||
flex-direction: column; | |||
background: #fff; | |||
border:1px solid # | border: 1px solid #eef1f6; | ||
border-radius: | border-radius: 14px; | ||
background:# | overflow: hidden; | ||
margin:0 0 14px 0; | box-shadow: 0 1px 2px rgba(0,0,0,.03), 0 1px 8px rgba(0,0,0,.04); | ||
transition: transform .15s ease, box-shadow .15s ease; | |||
} | |||
.place-card:hover { | |||
transform: translateY(-2px); | |||
box-shadow: 0 2px 4px rgba(0,0,0,.04), 0 6px 18px rgba(0,0,0,.08); | |||
} | |||
.place-card__img { | |||
width: 100%; | |||
aspect-ratio: 16 / 10; | |||
overflow: hidden; | |||
background: #f5f7fb; | |||
} | |||
.place-card__img a, .place-card__img img { | |||
display: block; | |||
width: 100%; | |||
height: 100%; | |||
object-fit: cover; | |||
} | |||
.place-card__body { padding: 14px 18px 18px; } | |||
.place-card__title { font-size: 17px; font-weight: 700; margin: 0 0 8px; line-height: 1.25; } | |||
.place-card__title a { color: #111827; text-decoration: none; } | |||
.place-card__title a:hover { color: #2a6df4; } | |||
.place-card__meta { font-size: 13px; color: #6b7280; margin: 0 0 10px; line-height: 1.5; } | |||
.place-card__desc { font-size: 14px; line-height: 1.5; color: #374151; } | |||
/* Grid: 2 columns desktop, 1 column mobile */ | |||
.places-grid { | |||
display: grid; | |||
grid-template-columns: repeat(2, 1fr); | |||
gap: 18px; | |||
margin: 16px 0; | |||
} | |||
@media (max-width: 640px) { | |||
.places-grid { grid-template-columns: 1fr; } | |||
} | } | ||
/* Add-place button */ | /* Add-place button */ | ||