www
/
cs-2022-class-profile
16
0
Fork 0
Code Issues 11 Pull Requests 1 Projects Releases Wiki Activity

Add About Component #48

Merged
j285he merged 7 commits from j285he-about into main 2022-09-12 10:20:11 -04:00
Conversation 1 Commits 7 Files Changed 4 +7 -9
2 changed files with 7 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit d3f1f08ff7 - Show all commits

13
components/About.module.css
View File

@ -1,14 +1,11 @@
.aboutWrapper {
position: relative;
flex-direction: column;
width: 90%;
j285he marked this conversation as resolved
a258wang commented 2022-09-03 01:12:49 -04:00
Review
Copy Link

Is flex-direction: column necessary? Since the wrapper only has 1 non-absolutely-positioned child

Is `flex-direction: column` necessary? Since the wrapper only has 1 non-absolutely-positioned child
}
.about {
width: 90%;
display: flex;
flex-direction: row;
background-color: var(--primary-background);
padding: calc(45rem / 16);
j285he marked this conversation as resolved
a258wang commented 2022-09-03 01:14:05 -04:00
Review
Copy Link

Is there any reason why we aren't doing width: 100% (or maybe it's not even necessary to specify the width) and then just letting padding/margin handle the spacing?

Is there any reason why we aren't doing `width: 100%` (or maybe it's not even necessary to specify the width) and then just letting padding/margin handle the spacing?
}
@ -29,8 +26,12 @@
margin: 0;
}
.about p {
color: var(--secondary-text)
.about aside p {
color: var(--primary-accent-light)
}
.about article p {
color: var(--primary-text);
}
.angle {
@ -42,7 +43,7 @@
}
.anglePath {
stroke: var(--primary-text)
stroke: var(--primary-accent)
}
.left.angle {

3
pages/_app.css
View File

@ -23,7 +23,6 @@ body {
--light--secondary-accent-light: #FEA0C8;
--light--primary-heading: #D02B53;
--light--primary-text: #483B35;
--light--secondary-text: var(--pink);
--light--link: var(--orange);
--light--link-hover: #FFBC9F;
--light--card-background: #FFFFFF;
@ -59,7 +58,6 @@ body {
--link: var(--dark--link);
--link-hover: var(--dark--link-hover);
--primary-text: var(--dark--primary-text);
--secondary-text: var(--dark--secondary-text);
--card-background: var(--dark--card-background);
--label: var(--dark--label);
@ -107,7 +105,6 @@ a:hover {
--link: var(--dark--link);
--link-hover: var(--dark--link-hover);
--primary-text: var(--dark--primary-text);
--secondary-text: var(--dark--secondary-text);
--card-background: var(--dark--card-background);
--label: var(--dark--label);
}