responsive homepage

This commit is contained in:
John Hess 2024-06-25 18:18:25 -05:00
parent 187368f716
commit 9aac1b0b8f
3 changed files with 34 additions and 4 deletions

View file

@ -55,11 +55,13 @@ a:active {
// center content vertically
display: flex;
align-items: center;
justify-content: center;
.header-container {
display: flex;
align-items: center;
width: 100%;
max-width: 920px;
padding: 0 20px;
}
@ -156,7 +158,6 @@ a:active {
text-decoration: none;
}
.content {
padding: 20px;
}
@ -171,11 +172,36 @@ a:active {
.card-set {
grid-template-columns: repeat(4, 1fr); /* 4 columns for larger screens */
}
.drippy {
display: block;
width: 90px;
margin-left: auto;
margin-right: auto;
}
h1.homepage-title {
text-align: center;
}
}
@media (max-width: 900px) {
.drippy {
display: none;
}
.homepage-subtitle {
display: none;
}
}
h1.homepage-title {
margin: 30px 0;
}
.homepage-subtitle {
color: #9b9a98;
font-size: 16px;
font-weight: 400;
margin: 0 auto 50px auto;
max-width: 340px;
text-align: center;
}
.card {
align-items: center;