diff --git a/src/components/Layout/JoinCommunity/JoinCommunity.astro b/src/components/Layout/JoinCommunity/JoinCommunity.astro
index 0cd7120..c6788df 100644
--- a/src/components/Layout/JoinCommunity/JoinCommunity.astro
+++ b/src/components/Layout/JoinCommunity/JoinCommunity.astro
@@ -11,6 +11,12 @@ import './JoinCommunity.scss';
Web3 gives people control over their data, privacy, and ownership.
+
-
diff --git a/src/components/Layout/JoinCommunity/JoinCommunity.scss b/src/components/Layout/JoinCommunity/JoinCommunity.scss
index ab6dc62..742bcca 100644
--- a/src/components/Layout/JoinCommunity/JoinCommunity.scss
+++ b/src/components/Layout/JoinCommunity/JoinCommunity.scss
@@ -2,79 +2,83 @@
@import "/src/styles/vars.scss";
#join-community {
- display: flex;
- align-items: center;
- justify-content: space-between;
- gap: 2em;
- padding: 5em 7.5%;
- background: $color-aquamarine;
- color: $color-blue-charcoal-2;
- @include fluid-font-size(0.625rem);
-
- div {
- flex-grow: 1;
-
- &:first-child {
- flex-grow: 10;
- }
-
- &:last-child {
- flex-grow: 0;
- }
- }
-
- @media screen and (max-width: 56rem) {
- flex-wrap: wrap;
- justify-content: center;
-
- div:first-child {
- flex-basis: 100%;
- margin-bottom: 2em;
- text-align: center;
- }
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 2em;
+ padding: 5em 7.5%;
+ background: $color-aquamarine;
+ color: $color-blue-charcoal-2;
+ @include fluid-font-size(0.625rem);
div {
- flex-grow: 0;
+ flex-grow: 1;
+
+ &:first-child {
+ flex-grow: 10;
+ }
+
+ &:last-child {
+ flex-grow: 0;
+ }
}
- }
- h2 {
- margin-bottom: 0.25em;
- @include fluid-font-size(2rem);
- font-weight: 700;
- line-height: 153%;
- text-transform: none;
- color: inherit;
- }
+ @media screen and (max-width: 56rem) {
+ flex-wrap: wrap;
+ justify-content: center;
- p {
- font-family: $font-family-jaldi;
- @include fluid-font-size(1.5rem);
- line-height: 157%;
- }
+ div:first-child {
+ flex-basis: 100%;
+ margin-bottom: 2em;
+ text-align: center;
+ }
- a {
- display: block;
- color: #0B3F48;
-
- &:hover {
- color: inherit;
+ div {
+ flex-grow: 0;
+ }
}
- }
- .github-logo svg {
- @include fluid-width(3.625rem);
- }
+ h2 {
+ margin-bottom: 0.25em;
+ @include fluid-font-size(2rem);
+ font-weight: 700;
+ line-height: 153%;
+ text-transform: none;
+ color: inherit;
+ }
- .discord-logo svg {
- @include fluid-width(3.625rem);
- }
+ p {
+ font-family: $font-family-jaldi;
+ @include fluid-font-size(1.5rem);
+ line-height: 157%;
+ }
- .twitter-logo svg {
- @include fluid-width(3.625rem);
- }
+ a {
+ display: block;
+ color: #0B3F48;
- .facebook-logo svg {
- @include fluid-width(3.625rem);
- }
+ &:hover {
+ color: inherit;
+ }
+ }
+
+ .github-logo svg {
+ @include fluid-width(3.625rem);
+ }
+
+ .git-logo svg {
+ @include fluid-width(3.625rem);
+ }
+
+ .discord-logo svg {
+ @include fluid-width(3.625rem);
+ }
+
+ .twitter-logo svg {
+ @include fluid-width(3.625rem);
+ }
+
+ .facebook-logo svg {
+ @include fluid-width(3.625rem);
+ }
}