feat: update /open-design content

BSA-US / dual-power-app

The Dual Power App is an app for democratic digital organizing and secure social networking that provides frameworks for the building of direct democracy in every single sphere of society, with tools for organization founding, funding, governance, and internal + external communications.

https://dualpower.app

197 stars 22 forks source link

feat: update /open-design content #109

Closed cedrycm closed 2 years ago

cedrycm commented 2 years ago

This PR covers a few changes mentions in issue https://github.com/BSA-US/dual-power-app/issues/89:

[x] Replace "Open Design" with "Open Design + Build" in app header (nav link)
[x] Replace "Open Design" with "Open Design + Build" in page header (the big guy)
[x] Remove "with Manhattan Hydraulics"
[x] Added svg files and icons for BSA and MH
[x] Updated about section to reflect current dev process
[x] Added useBreakpoints hook for responsive elements
[x] Add yarn2 compatibility
[x] add in unplugin-icons, unplugin-auto-import

vercel[bot] commented 2 years ago

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/blacksocialists/dual-power-app/79Ytz5kE8SUKNaLuKLnGRRBXirWU
✅ Preview: https://dual-power-app-git-update-open-design-content-blacksocialists.vercel.app

replygirl commented 2 years ago

📝 Changed routes:

/	/open-design
^{(view full size)}	^{(view full size)}

And 2 other routes:

Commit d3ebc0c40d47e61ea473696338386d5d4509ebbf (https://dual-power-app-3jov8hsdl-blacksocialists.vercel.app).

cedrycm commented 2 years ago

@replygirl I added some extra config options to webpack for unplugin-icons + unplugin-auto-import for us to import our custom image assets under the 'custom' collection: import BSAGlyph from '~icons/custom/bsa-glyph.jsx'

with auto-import we can also choose not to explicitly import these and use this notation instead: IconBsaGlyph which will generate global types into the auto-imports.d.ts file.

note: this file also contains globals for react hooks which could be nice imo but can be removed if needed! I also chose not to do an auto-import implementation in this PR due to a linting error that's set for jsx imports. not sure if that was something that could break the vercel deployment 🤷🏾

replygirl commented 2 years ago

getting there! quick notes

we can use something above the fold for "show more", either the first paragraph or the first two
we should only need the "show more" break on mobile
four paragraphs at the same size, evenly spaced, looks like a lot. possible changes:
- make it looks like two separate blocks by adding empty space or a divider
- put the notes for designers + engineers in an outlined box (maybe the "show more" is expanding that box?)
- use different opacities or sizes
i would left-align the logos. possible approaches:
- add justify-content-start or some other combo of grid layout utils
- add grid-cols-[auto,1fr]
- replace grid with stack-x

cedrycm commented 2 years ago

thanks for the feedback! i'll go ahead make those changes 🤝

cedrycm commented 2 years ago

that final rebase hurt took years off my life 🧎🏾

replygirl commented 2 years ago

in the live deployment, clicking on the documents tab opens one of the documents immediately for some reason

replygirl commented 2 years ago

i think i might just need to wipe out those merges and rebase properly. luckily you already did the difficult part of the rebase :)

cedrycm commented 2 years ago

my bad! looks like i changed the img tag. should be fixed now!