more styling fixes

This commit is contained in:
James Shiffer 2020-08-10 17:18:38 -07:00
parent e62fcf59f7
commit 137d449af3
No known key found for this signature in database
GPG Key ID: C0DB8774A1B3BA45
3 changed files with 17 additions and 19 deletions

View File

@ -84,6 +84,7 @@
.content :global(img) { .content :global(img) {
max-width: 100%; max-width: 100%;
height: auto;
} }
@media (min-width: 800px) { @media (min-width: 800px) {
@ -100,10 +101,10 @@
figure.article-image { figure.article-image {
height: 12rem; height: 12rem;
width: auto; width: auto !important;
margin: -2rem; margin: -2rem;
margin-bottom: 1rem; margin-bottom: 1rem;
background: #81b0cd; background: #81b0cd;
} }
figure.article-image img { figure.article-image img {

View File

@ -9,6 +9,7 @@
} }
div.people > div { div.people > div {
flex: 1 0 0; flex: 1 0 0;
padding: 1rem;
} }
</style> </style>

View File

@ -48,10 +48,12 @@ code {
font-size: 2rem !important; font-size: 2rem !important;
} }
div.article-list > a { div.article-list > a {
margin: 2rem !important; flex-direction: row !important;
} }
div.article-meta { div.article-meta {
margin: 2rem; margin: 2rem !important;
margin-right: 0 !important;
padding-top: 0.75rem !important;
} }
div.article-list { div.article-list {
padding: 2rem 1rem; padding: 2rem 1rem;
@ -61,6 +63,7 @@ code {
} }
figure.article-image { figure.article-image {
max-height: 300px !important; max-height: 300px !important;
width: 33.33% !important;
} }
} }
@media (min-width: 1280px) { @media (min-width: 1280px) {
@ -74,12 +77,13 @@ div.article-list {
background: #508FC3; background: #508FC3;
width: 80%; width: 80%;
margin: 0 auto; margin: 0 auto;
box-shadow: 0 -5px 0.75rem black;
} }
div.article-list > a { div.article-list > a {
margin: 0.5rem; margin: 2rem;
display: flex; display: flex;
text-decoration: none; text-decoration: none;
flex-direction: row; flex-direction: column;
align-items: start; align-items: start;
} }
figure.article-image { figure.article-image {
@ -87,10 +91,9 @@ figure.article-image {
display: flex; display: flex;
align-self: center; align-self: center;
justify-content: center; justify-content: center;
width: 33.33%;
padding: 1rem;
max-height: 150px;
margin: 0; margin: 0;
padding: 1rem;
max-height: 200px;
} }
figure.article-image img { figure.article-image img {
width: auto; width: auto;
@ -98,12 +101,12 @@ figure.article-image img {
max-width: 100%; max-width: 100%;
} }
div.article-meta { div.article-meta {
margin: 1rem;
background: white; background: white;
margin-right: 0;
padding: 0.75rem; padding: 0.75rem;
padding-top: 0;
line-height: 1; line-height: 1;
flex: 1 0 0; flex: 1 0 0;
font-weight: bold;
} }
.article-title { .article-title {
font-size: 2rem; font-size: 2rem;
@ -116,7 +119,7 @@ div.article-meta {
.content { .content {
background: #fff; background: #fff;
margin: 16rem 0; margin: 12rem 0;
padding: 2rem; padding: 2rem;
} }
@ -131,13 +134,6 @@ div.background {
filter: blur(5px); filter: blur(5px);
} }
div.article-list {
box-shadow: 0 -5px 0.75rem black;
}
div.article-meta {
font-weight: bold;
}
div.floaty { div.floaty {
padding-top: 16rem; padding-top: 16rem;
padding-bottom: 4rem; padding-bottom: 4rem;