Add Demographics page (Closes #53) #73
Merged
e26chiu
merged 8 commits from demographics-page
into main
4 months ago
Loading…
Reference in new issue
There is no content yet.
Delete Branch 'demographics-page'
Deleting a branch is permanent. It CANNOT be undone. Continue?
Some changes may need to be done in
ComponentWrapper
component to customize space + allowingComponentWrapper
without abodyText
prop.I tried to use WordCloud on D7 and it is associating the wrong text to the wrong value.
I changed the colour of the text (might be changed later on) because pure white strains the eye (contrast is too high).
https://demographics-page-csc-class-profile-staging-snedadah.k8s.csclub.cloud/demographics/
[WIP] Add Demographics page (Closes #53)to Add Demographics page (Closes #53) 5 months agoconst { width } = useWindowDimensions();
const isMobile = useIsMobile();
const defaultGraphWidth = isMobile ? width / 1.25 : width / 2;
I believe these values (defaultGraphWidth, defaultPieChartWidth, defaultGraphHeight, etc.) should be shared across all pages. We should probably create a
util
file likeColor.ts
to contain these values. It can be changed in another PR.align="right"
>
<BarGraphVertical
data={D9} // we might want a histogram instead
Will be changed when histogram component is merged.
I reccomend adding
// TODO: change when histogram component is ready
Nice work! LGTM with a small comment.
We should make another pr for doing the refactoring the common page styles. I'm also working on debugging the word cloud issue.
data={D11}
width={defaultGraphWidth}
height={defaultGraphHeight}
margin={{
You can do
margin={ { ...defaultBarGraphMargin, ...{ left: 200 } } }
To use defaults with only one value changed. I also reccomend you use 250 instead of 200, since the "no" is still hidden on my screen with 200.
Also, this graph is pretty messed up on mobile, but I know that the other label pr will hopefully fix it.
fb9c5243ab
into main 4 months agoReviewers
fb9c5243ab
.