diff --git a/src/routes/a/[slug].svelte b/src/routes/a/[slug].svelte index 8f2a972..38868bf 100644 --- a/src/routes/a/[slug].svelte +++ b/src/routes/a/[slug].svelte @@ -84,6 +84,7 @@ .content :global(img) { max-width: 100%; + height: auto; } @media (min-width: 800px) { @@ -100,10 +101,10 @@ figure.article-image { height: 12rem; - width: auto; + width: auto !important; margin: -2rem; margin-bottom: 1rem; - background: #81b0cd; + background: #81b0cd; } figure.article-image img { diff --git a/src/routes/contact.svelte b/src/routes/contact.svelte index b9cf613..a6d7e92 100644 --- a/src/routes/contact.svelte +++ b/src/routes/contact.svelte @@ -9,6 +9,7 @@ } div.people > div { flex: 1 0 0; + padding: 1rem; } diff --git a/static/global.css b/static/global.css index 3a7fa2f..5d27c7e 100644 --- a/static/global.css +++ b/static/global.css @@ -48,10 +48,12 @@ code { font-size: 2rem !important; } div.article-list > a { - margin: 2rem !important; + flex-direction: row !important; } div.article-meta { - margin: 2rem; + margin: 2rem !important; + margin-right: 0 !important; + padding-top: 0.75rem !important; } div.article-list { padding: 2rem 1rem; @@ -61,6 +63,7 @@ code { } figure.article-image { max-height: 300px !important; + width: 33.33% !important; } } @media (min-width: 1280px) { @@ -74,12 +77,13 @@ div.article-list { background: #508FC3; width: 80%; margin: 0 auto; + box-shadow: 0 -5px 0.75rem black; } div.article-list > a { - margin: 0.5rem; + margin: 2rem; display: flex; text-decoration: none; - flex-direction: row; + flex-direction: column; align-items: start; } figure.article-image { @@ -87,10 +91,9 @@ figure.article-image { display: flex; align-self: center; justify-content: center; - width: 33.33%; - padding: 1rem; - max-height: 150px; margin: 0; + padding: 1rem; + max-height: 200px; } figure.article-image img { width: auto; @@ -98,12 +101,12 @@ figure.article-image img { max-width: 100%; } div.article-meta { - margin: 1rem; background: white; - margin-right: 0; padding: 0.75rem; + padding-top: 0; line-height: 1; flex: 1 0 0; + font-weight: bold; } .article-title { font-size: 2rem; @@ -116,7 +119,7 @@ div.article-meta { .content { background: #fff; - margin: 16rem 0; + margin: 12rem 0; padding: 2rem; } @@ -131,13 +134,6 @@ div.background { filter: blur(5px); } -div.article-list { - box-shadow: 0 -5px 0.75rem black; -} -div.article-meta { - font-weight: bold; -} - div.floaty { padding-top: 16rem; padding-bottom: 4rem;