www
/
www-new
12
3
Fork 5
Code Issues 58 Pull Requests 42 Projects Releases Wiki Activity

Make padding-bottom consistent for pages with EmailSignup component #247

Merged
j285he merged 8 commits from jared-fix-padding-bottom-101 into main 2021-09-02 17:35:43 -04:00
Conversation 5 Commits 8 Files Changed 5 +21 -5
5 changed files with 21 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
pages/about/index.module.css
View File

@ -34,6 +34,10 @@
} }
@media only screen and (max-width: calc(768rem / 16)) { @media only screen and (max-width: calc(768rem / 16)) {
.page {
margin-bottom: calc(30rem / 16);
}
.titleContainer { .titleContainer {
display: flex; display: flex;
flex-direction: column; flex-direction: column;

8
pages/about/our-supporters.module.css
View File

@ -1,3 +1,7 @@
.page {
margin-bottom: calc(60rem / 16);
}
.headerContainer { .headerContainer {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -18,6 +22,10 @@
} }
@media only screen and (max-width: calc(768rem / 16)) { @media only screen and (max-width: calc(768rem / 16)) {
.page {
margin-bottom: calc(30rem / 16);
}
.headerContainer { .headerContainer {
flex-direction: column-reverse; flex-direction: column-reverse;
align-items: center; align-items: center;

4
pages/about/our-supporters.tsx
View File

@ -9,7 +9,7 @@ import styles from "./our-supporters.module.css";
export default function OurSupporters() { export default function OurSupporters() {
return ( return (
<> <div className={styles.page}>
<Title>Our Supporters</Title> <Title>Our Supporters</Title>
<div className={styles.headerContainer}> <div className={styles.headerContainer}>
<h1 className={styles.header}>Our Supporters</h1> <h1 className={styles.header}>Our Supporters</h1>
@ -18,6 +18,6 @@ export default function OurSupporters() {
<div className={styles.content}> <div className={styles.content}>
<Content /> <Content />
</div> </div>
</> </div>
); );
} }

6
pages/get-involved.module.css
View File

@ -1,5 +1,5 @@
.page { .page {
margin: calc(50rem / 16) 0; margin: calc(60rem / 16) 0;
a3thakra commented 2021-09-04 20:43:28 -04:00
Review
Copy Link

This is changing the margins on the side as well, which make the page super narrow.

This is changing the margins on the side as well, which make the page super narrow.
} }
.page > header { .page > header {
@ -51,6 +51,10 @@
} }
@media only screen and (max-width: calc(768rem / 16)) { @media only screen and (max-width: calc(768rem / 16)) {
.page {
margin: calc(30rem / 16);
a258wang commented 2021-09-04 21:02:19 -04:00
Review
Copy Link

Continuing from Adi's comment: this should be margin: calc(30rem / 16) 0 so we don't change the side margins.

Continuing from Adi's comment: this should be `margin: calc(30rem / 16) 0` so we don't change the side margins.
}
.page > header { .page > header {
display: flex; display: flex;
flex-direction: column-reverse; flex-direction: column-reverse;

4
pages/index.module.css
View File

@ -1,5 +1,5 @@
.page { .page {
padding-bottom: calc(60rem / 16); margin-bottom: calc(60rem / 16);
} }
.intro { .intro {
@ -126,7 +126,7 @@
@media only screen and (max-width: calc(768rem / 16)) { @media only screen and (max-width: calc(768rem / 16)) {
.page { .page {
padding-bottom: calc(30rem / 16); margin-bottom: calc(30rem / 16);
} }
.intro { .intro {