Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

094 make website dynamic #117

Merged
merged 19 commits into from
Sep 11, 2024
Merged

094 make website dynamic #117

merged 19 commits into from
Sep 11, 2024

Conversation

h4yleysh4rpe
Copy link
Contributor

@h4yleysh4rpe h4yleysh4rpe commented Aug 26, 2024

Context

Wanted to have the website to be responsive to various browser sizes, and modify all elements to avoid any weird behaviour.

Closes #94

What Changed?

Changes on almost all pages (home/members/about/feedback). Per pages, changes are:

  • Home - Responsive main header sizes, mission statement and image section changing to on top of each other, carousel arrows coming down under upcoming events header for small screen sizes.
  • Members - image and blurb stack for small screen sizes, chairs stack for small screen sizes, arrow blurbs removed, margins either side are even
  • About - header blurb size changes, value cards stack on top of one another for small screen sizes and fit within edges of window
  • FAQ and Feedback - active section changes from next to the FAQ/Contact buttons, to underneath.

How To Review

Please look at the above changes and ensure that all is running smoothly for various window sizes (can review commit wise if you want to ensure you have checked everything). Please also keep an eye out for any small other problems. Ignore the following as these are issues to be fixed later (after discussing with Nate although let me know if you want me to have a go with any of them soon) -

  • Header is not responsive to smallest screen sizes
  • Member modal is not responsive to screen sizes
  • Blobs on home page.

Notes

Added a new breakpoint into tailwind.css (xs) to allow for a bit more flexibility on the smallest screen sizes.

Copy link
Contributor

@Oculux314 Oculux314 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks awesome and I'm almost ready to approve - just letting you know that on medium-sized laptop screens the text gets a bit big. Let me know if you want to fix or not fix in this PR and then I'm happy to approve :)

E.g. home (I'm on a 14")
image

@@ -79,7 +79,7 @@ module.exports = {
lastname: "Team",
username: "Younite",
password: "Developer2023",
email: "ytao543@aucklanduni.ac.nz",
email: "543@aucklanduni.ac.nz",
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yo! Was this an accidental deletion?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Fixed

Copy link
Contributor

@Oculux314 Oculux314 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good per our discussion yesterday :D

Be aware of this bug I'm documenting here:
image
But I'm pretty sure this is caused by the header which we'll turn into a Hamburger menu soon anyway so we can leave it :)

@Oculux314
Copy link
Contributor

@zozzzC @jessicazeng13 quick bump on this, Hayley's so excited to merge this in she's fallen sick :)

@zozzzC
Copy link
Contributor

zozzzC commented Sep 3, 2024

Hiya, just checking if this was something that was needed to be fixed or not, but in the small screen sizes the About page cards are quite big--is there a reason for that or is it alright that way?
image

Copy link
Contributor

@jessicazeng13 jessicazeng13 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Everything looks great and is working on my end! I think there are minor styling changes that can be on the values page when it is stacked on top of each other, but I don't think that this is the job for this ticket so don't worry! Great work this looks sick!!

@h4yleysh4rpe h4yleysh4rpe merged commit e7231b4 into main Sep 11, 2024
@Oculux314 Oculux314 deleted the 094_make-website-dynamic branch October 5, 2024 07:17
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Make Website Dynamic
5 participants