diff --git a/htdocs/common/topnav.html b/htdocs/common/topnav.html index c503986..0dcdb43 100644 --- a/htdocs/common/topnav.html +++ b/htdocs/common/topnav.html @@ -7,6 +7,7 @@
Independent software, open-source projects, music, and games—made in Raleigh, North Carolina.
@@ -106,6 +107,19 @@ + +
diff --git a/htdocs/static/home.css b/htdocs/static/home.css
index 6d51dc4..fbe8704 100755
--- a/htdocs/static/home.css
+++ b/htdocs/static/home.css
@@ -518,6 +518,44 @@ main {
justify-content: flex-start;
}
+.newsletter-section {
+ display: grid;
+ grid-template-columns: minmax(0, 0.9fr) minmax(360px, 1.1fr);
+ align-items: center;
+ gap: clamp(2rem, 7vw, 7rem);
+ padding: clamp(3.5rem, 7vw, 6rem) clamp(1.5rem, 9vw, 9rem);
+ background: var(--page-deep);
+ border-top: 1px solid var(--border);
+ border-bottom: 1px solid var(--border);
+}
+
+.newsletter-copy {
+ max-width: 600px;
+}
+
+.newsletter-copy h2 {
+ margin-bottom: 0.9rem;
+}
+
+.newsletter-form-wrap {
+ min-width: 0;
+}
+
+.newsletter-embed {
+ display: block;
+ width: 100%;
+ height: 570px;
+ background: transparent;
+ border: 0;
+ border-radius: 1rem;
+}
+
+.newsletter-fallback {
+ margin: 0.6rem 0 0;
+ color: var(--subtle);
+ font-size: 0.82rem;
+}
+
.quiet-link {
color: var(--muted);
font-size: 0.88rem;
@@ -667,6 +705,11 @@ main {
grid-template-columns: 1fr;
gap: 1.5rem;
}
+
+ .newsletter-section {
+ grid-template-columns: 1fr;
+ gap: 1.5rem;
+ }
}
@media (max-width: 640px) {
@@ -785,6 +828,15 @@ main {
.support-actions .button {
width: 100%;
}
+
+ .newsletter-section {
+ grid-template-columns: minmax(0, 1fr);
+ padding: 3.5rem 1.25rem;
+ }
+
+ .newsletter-embed {
+ height: 590px;
+ }
}
@media (max-width: 380px) {