From 5e1612774a9c6cd7fa3a67483219eb0338666f2a Mon Sep 17 00:00:00 2001 From: Paul Brinkmeier Date: Thu, 20 Feb 2025 12:32:36 +0100 Subject: [PATCH] Make index responsive --- extra/index.css | 32 ++++++++++++++++++++++++++++++++ index.hbs | 1 + photo.hbs | 1 + 3 files changed, 34 insertions(+) diff --git a/extra/index.css b/extra/index.css index 8ec9b0b..ec0e444 100644 --- a/extra/index.css +++ b/extra/index.css @@ -63,3 +63,35 @@ h1 { footer { text-align: center; } + +@media (max-width: 90em) { + .container { + width: 65em; + } +} + +@media (max-width: 68em) { + .container { + width: 43em; + } +} + +@media (max-width: 46em) { + .container { + width: auto; + margin: 2em 1em; + } + + .photo-cards { + display: block; + } + + .photo-card-image img { + width: 100%; + height: auto; + } + + .photo-card + .photo-card { + margin-top: 1em; + } +} diff --git a/index.hbs b/index.hbs index 570277d..2aee9ee 100644 --- a/index.hbs +++ b/index.hbs @@ -2,6 +2,7 @@ + photo gallery diff --git a/photo.hbs b/photo.hbs index ba2c1aa..775b05a 100644 --- a/photo.hbs +++ b/photo.hbs @@ -2,6 +2,7 @@ + {{ path.name }}