-
diff --git a/src/components/Newsletter/Newsletter.scss b/src/components/Newsletter/Newsletter.scss
index 5db6a17..24e661a 100644
--- a/src/components/Newsletter/Newsletter.scss
+++ b/src/components/Newsletter/Newsletter.scss
@@ -1,36 +1,46 @@
@import '../../styles/variables.scss';
.newsletter {
- border: 2px solid #6394F7;
border-radius: 7px;
- padding: 30px 25px;
+ background: linear-gradient(135.9deg, #f5f9ff, #f5f9ff 0.01%, #f6f4fb 98.96%);
+ padding: 25px 25px;
& .newsletter-heading {
- font-size: 21px;
+ font-size: 24px;
font-weight: 700;
- margin-bottom: 15px;
+ margin-bottom: 10px;
color: $black-clr;
+ text-align: center;
}
& .newsletter-content {
+ text-align: center;
+ & p {
+ font-size: 15px;
+ margin-bottom: 10px;
+ }
& form {
+ display: flex;
+ justify-content: center;
& p {
margin-bottom: 40px;
font-size: 15px;
color: $black-clr;
}
& .email-field {
- display: flex;
+ margin-top: 10px;
+ display: inline-flex;
& input {
- width: 250px;
- height: 40px;
+ width: 300px;
+ height: 35px;
padding: 10px;
font-family: 'Inter', sans-serif;
font-size: 13px;
- border-radius: 5px 0px 0px 5px;
+ border-radius: 5px;
}
& button {
background: linear-gradient(112.92deg, #6395F8 0%, #463EAC 100%);
- border-radius: 0px 5px 5px 0px;
- height: 40px;
+ border-radius: 5px;
+ margin-left: 5px;
+ height: 35px;
width: 130px;
font-size: 13px;
padding: 0 15px;
@@ -46,10 +56,14 @@
.dark {
& .newsletter {
+ background: #2A2A2A;
& .newsletter-heading {
color: $white-clr;
}
& .newsletter-content {
+ & p {
+ color: $white-clr;
+ }
& form {
& p {
color: $white-clr;
diff --git a/src/styles/global.scss b/src/styles/global.scss
index 18249ab..7440fc9 100644
--- a/src/styles/global.scss
+++ b/src/styles/global.scss
@@ -343,8 +343,12 @@ html {
body {
font-family: 'Inter', sans-serif;
margin: 0;
- display: flex;
height: 85%;
+}
+
+#gatsby-focus-wrapper {
+ display: flex;
+ min-height: 100vh;
flex-direction: column;
}