Skip to content

Issue 107 committee page frontend fixes#110

Open
Games4Doritos wants to merge 2 commits intomainfrom
issue-107-committee_page_frontend_fixes
Open

Issue 107 committee page frontend fixes#110
Games4Doritos wants to merge 2 commits intomainfrom
issue-107-committee_page_frontend_fixes

Conversation

@Games4Doritos
Copy link
Collaborator

@Games4Doritos Games4Doritos commented Feb 14, 2026 •
edited by github-actions bot
Loading

Change Summary

-Increased the font size of the committee portrait labels to sm

  • Increased the sizes of the committee frames and photos to accomodate this larger font size, whilst maintaining the same photo width : frame width and photo height : frame height ratios, rounded to one decimal place (see commit history for exact values)
  • Increased bottom padding of the committee section as requested
  • To be able to put Links to the committee's member pages on their photos and names in the about page, the member serializer was updated to include the "pk" field (the member's integer id). This field will now be fetched as well on the about page, and will complete the link to each committee member's member page. This field as been added to all other instances of fetching a member in the codebase, though only used for this page.
  • Conditional rendering has been implemented in the about page, where committee member's page links will only render if they have a valid id (0 is the placeholder and is invalid, as id's start at 1)
image

Change Form

  • The pull request title has an issue number
  • The change works by "Smoke testing" or quick testing
  • The change has tests
  • The change has documentation

Other Information

Related issue

@Games4Doritos
Solved all issues?
07a3cca 
- Increased the font size of the committee portrait labels from 0.5rem to sm (0.875rem = 14px for my device)
- Increased committee photo and frame sizes to accommodate new font size. The width and height of the frames are now a nice number of 56 in tailwind = 14rem. The ratios of photo width: frame width (0.6) and photo height: frame height (0.6444..) have been maintained with this adjustment, rounded to 1 decimal place (9rem for photo height and 8.4rem for photo width)
- Gave the committee section a bottom padding of 20 (tailwind), so there is now equal padding on the bottom and top
- Updated MemberSerializer to now include the Member Object's primary key (integer id), denoted as pk. This is necessary for make committee portraits link to their respective member pages
- Updated all instances in the codebase where a Member object if fetched, adding the pk attribute to match the updated MemberSerializer
- Added conditional rendering logic in the about page: each committee member's photo and name will render as wrapped in a Link to their respective member page, only if the fetched Member object does not have the placeholder pk value of 0 (don't worry, the member id's start at 1, so 0 is never valid), otherwise it will render the photo and name without Link wrappers
@Games4Doritos
Reduced <Image/> repetition
d65832e 
- Removed repetition of the same Image component for each conditional render for the committee photos. This was done be simply turning the Image into a function called committeeImage(profilePic: string)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

committee page frontend fixes

1 participant

@Games4Doritos