From 00c1138e12d0885b76295ade80ea7236818791eb Mon Sep 17 00:00:00 2001 From: Ben Halverson Date: Mon, 30 Mar 2020 01:26:10 -0700 Subject: [PATCH 1/2] fix(homepage): Removed mailing list signup The mailing list for nodejs hasnt been published in many months. Closes #331 --- src/pages/index.tsx | 22 ---------------------- 1 file changed, 22 deletions(-) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index b69e84e8a9..52e9cf1350 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -71,28 +71,6 @@ export default function Index(): JSX.Element { -
-

- Join the community -

-
-

- We’ll never share your information and always respect your inbox - - quality content only, we promise.{' '} -

-
- - -
-
-
-

Trusted by development teams around the world From 4a5ce41a2fdea66eb0b1326e4900e4d819dafc5c Mon Sep 17 00:00:00 2001 From: Ben Halverson Date: Mon, 30 Mar 2020 12:36:45 -0700 Subject: [PATCH 2/2] style(index.css): Removed unused css This removes the unused css from the homepage as part of the removal of the mailing list form --- src/styles/index.css | 338 +++++++++++++++++++------------------------ 1 file changed, 147 insertions(+), 191 deletions(-) diff --git a/src/styles/index.css b/src/styles/index.css index 3bb8dcb12f..046fb0cdd4 100644 --- a/src/styles/index.css +++ b/src/styles/index.css @@ -1,295 +1,251 @@ .home-page { - max-width: 960px; - margin: 0 auto; - margin-bottom: var(--space-80); - position: relative; + max-width: 960px; + margin: 0 auto; + margin-bottom: var(--space-80); + position: relative; - --section-margin-bottom: 340px; + --section-margin-bottom: 340px; } .pentagon-illustration-big1 { - position: absolute; - top: 1200px; - z-index: -1; - right: 0; + position: absolute; + top: 1200px; + z-index: -1; + right: 0; } .pentagon-illustration-big2 { - position: absolute; - z-index: -2; - left: 0; - bottom: -2000px; + position: absolute; + z-index: -2; + left: 0; + bottom: -2000px; } .double-background { - position: absolute; - width: 100%; - height: 1954px; - top: 808px; - background: var(--color-fill-canvas); - z-index: -10; + position: absolute; + width: 100%; + height: 1954px; + top: 808px; + background: var(--color-fill-canvas); + z-index: -10; } .home-page-hero { - display: flex; - align-items: center; - justify-content: center; - flex-direction: column; - text-align: center; - padding-top: var(--space-96); - margin-bottom: 160px; + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + text-align: center; + padding-top: var(--space-96); + margin-bottom: 160px; } .home-page-hero h1 { - margin: 0; + margin: 0; } .home-page-hero p { - margin: 0; + margin: 0; } .home-page-hero h1 { - max-width: 840px; + max-width: 840px; } .home-page-hero .sub-title { - max-width: 780px; - color: var(--color-text-secondary); - margin: var(--space-32) 0 var(--space-80) 0; - font-weight: var(--font-weight-light); + max-width: 780px; + color: var(--color-text-secondary); + margin: var(--space-32) 0 var(--space-80) 0; + font-weight: var(--font-weight-light); } .download-lts-container { - position: relative; + position: relative; } .download-lts-container .links { - color: var(--color-text-secondary); - margin: var(--space-08) 0 0 0; - position: absolute; - left: calc(var(--space-16) * -1); + color: var(--color-text-secondary); + margin: var(--space-08) 0 0 0; + position: absolute; + left: calc(var(--space-16) * -1); } .home-page-hero .btn-ctas { - display: flex; + display: flex; } .home-page-hero .btn-ctas button { - border: none; - box-sizing: border-box; - width: 20rem; - height: 5.6rem; - padding: 0 var(--space-16); - font-weight: var(--font-weight-semibold); - margin: 0; + border: none; + box-sizing: border-box; + width: 20rem; + height: 5.6rem; + padding: 0 var(--space-16); + font-weight: var(--font-weight-semibold); + margin: 0; } .home-page-hero .btn-ctas .download-lts-cta { - border-radius: 5.6rem; - background: var(--color-fill-action); - color: var(--black0); - margin-right: var(--space-32); - position: relative; + border-radius: 5.6rem; + background: var(--color-fill-action); + color: var(--black0); + margin-right: var(--space-32); + position: relative; } .home-page-hero .btn-ctas .learn-cta { - border-radius: 5.6rem; - border: var(--color-fill-action) var(--space-02) solid; - color: var(--color-fill-action); + border-radius: 5.6rem; + border: var(--color-fill-action) var(--space-02) solid; + color: var(--color-fill-action); } .node-demo-container { - position: relative; + position: relative; } .node-demo { - width: 832px; - margin: 0 auto; - margin-bottom: 240px; - height: 374px; - background: var(--black9); - border-radius: var(--space-04); - box-shadow: 5px 10px 50px rgba(0, 0, 0, .25); - color: var(--black0); - z-index: 2; + width: 832px; + margin: 0 auto; + margin-bottom: 240px; + height: 374px; + background: var(--black9); + border-radius: var(--space-04); + box-shadow: 5px 10px 50px rgba(0, 0, 0, 0.25); + color: var(--black0); + z-index: 2; } .leafs-front { - position: absolute; - top: 145px; - right: -16px; - z-index: -1; - animation: leafs-animation 10s infinite alternate ease-in-out; - filter: drop-shadow(10px 5px 50px rgba(0, 0, 0, .1)); + position: absolute; + top: 145px; + right: -16px; + z-index: -1; + animation: leafs-animation 10s infinite alternate ease-in-out; + filter: drop-shadow(10px 5px 50px rgba(0, 0, 0, 0.1)); } .leafs-middle { - position: absolute; - top: -32px; - right: 20px; - z-index: -2; - animation: leafs-animation 15s infinite alternate ease-in-out; - filter: drop-shadow(6px 5px 25px rgba(0, 0, 0, .1)); + position: absolute; + top: -32px; + right: 20px; + z-index: -2; + animation: leafs-animation 15s infinite alternate ease-in-out; + filter: drop-shadow(6px 5px 25px rgba(0, 0, 0, 0.1)); } .leafs-back { - position: absolute; - top: -48px; - left: -62px; - z-index: -3; - animation: leafs-animation 18s infinite alternate ease-in-out; + position: absolute; + top: -48px; + left: -62px; + z-index: -3; + animation: leafs-animation 18s infinite alternate ease-in-out; } .dots { - position: absolute; - top: 180px; - left: -24px; - z-index: -4; + position: absolute; + top: 180px; + left: -24px; + z-index: -4; } .node-features { - width: 100%; - display: flex; - align-items: center; - justify-content: space-around; - margin-bottom: var(--section-margin-bottom); + width: 100%; + display: flex; + align-items: center; + justify-content: space-around; + margin-bottom: var(--section-margin-bottom); } .node-features__feature { - max-width: 188px; - color: var(--color-text-secondary); + max-width: 188px; + color: var(--color-text-secondary); } .node-features__feature > p { - margin-top: var(--space-16); -} - -.join-node .accent { - color: var(--pink5); -} - -.join-node { - width: 200%; - margin: 0 auto; - margin-bottom: var(--section-margin-bottom); - max-width: 851px; -} - -.join-node-form-container { - display: flex; - flex-direction: row; - justify-content: space-between; -} - -.input-subscribe { - box-sizing: border-box; - padding: var(--space-16) var(--space-24); - border-radius: 3px; - border: var(--space-02) solid var(--color-border-primary); - height: 5.6rem; -} - -.join-node p { - max-width: 390px; - color: var(--color-text-secondary); + margin-top: var(--space-16); } .see-more-events { - margin-top: var(--space-48); - color: var(--pink5); - display: block; + margin-top: var(--space-48); + color: var(--pink5); + display: block; } .see-more-events span { - margin-left: var(--space-08); -} - -.btn-subscribe { - border: none; - box-sizing: border-box; - height: 5.6rem; - padding: 0 var(--space-24); - font-weight: var(--font-weight-semibold); - background: var(--color-fill-action); - border-radius: var(--space-04); - color: var(--black0); - margin: 0; - margin-left: var(--space-08); - cursor: pointer; + margin-left: var(--space-08); } .trusted-by { - margin-bottom: var(--section-margin-bottom); - text-align: center; - width: 100%; + margin-bottom: var(--section-margin-bottom); + text-align: center; + width: 100%; } .trusted-by p { - color: var(--color-text-secondary); - margin-bottom: var(--space-64); + color: var(--color-text-secondary); + margin-bottom: var(--space-64); } .trusted-by .logos-container { - display: flex; - align-items: center; - flex-direction: row; - justify-content: space-between; - filter: grayscale(); + display: flex; + align-items: center; + flex-direction: row; + justify-content: space-between; + filter: grayscale(); } .get-started-callouts { - width: 100%; - display: flex; - flex-direction: row; - text-align: center; - justify-content: space-between; - margin-bottom: var(--space-80); + width: 100%; + display: flex; + flex-direction: row; + text-align: center; + justify-content: space-between; + margin-bottom: var(--space-80); } .get-started-callout { - text-decoration: none; - display: flex; - flex-direction: column; + text-decoration: none; + display: flex; + flex-direction: column; } .get-started-callout h5 { - color: var(--color-text-primary); - margin: 0; - margin-top: var(--space-24); + color: var(--color-text-primary); + margin: 0; + margin-top: var(--space-24); } .get-started-callout p { - margin-top: var(--space-16); - color: var(--color-text-secondary); - width: 422px; + margin-top: var(--space-16); + color: var(--color-text-secondary); + width: 422px; } .btn-primary { - display: block; - width: 141px; - margin: 0 auto; - cursor: pointer; - border: none; - box-sizing: border-box; - padding: var(--space-08) var(--space-24); - font-weight: var(--font-weight-semibold); - background: var(--color-fill-action); - color: var(--black0); - border-radius: var(--space-04); - text-decoration: none; - line-height: var(--line-height-body1); -} - -.btn-primary:hover, .btn-primary:focus { - color: var(--black0); + display: block; + width: 141px; + margin: 0 auto; + cursor: pointer; + border: none; + box-sizing: border-box; + padding: var(--space-08) var(--space-24); + font-weight: var(--font-weight-semibold); + background: var(--color-fill-action); + color: var(--black0); + border-radius: var(--space-04); + text-decoration: none; + line-height: var(--line-height-body1); +} + +.btn-primary:hover, +.btn-primary:focus { + color: var(--black0); } @keyframes leafs-animation { - 50% { - transform: rotate(5deg); - } - 100% { - transform: rotate(8deg); - } -} - \ No newline at end of file + 50% { + transform: rotate(5deg); + } + 100% { + transform: rotate(8deg); + } +}