Requested by: @tiagov8 via YakShaver.ai 🦬
cc: @tiagov8, @adamcogan, @GordonBeeming, @bradystroud, @jeoffreyfischer, @joshbermanssw
Hi Team!
🟥 Watch the video (3 min 21 sec)
Url from screen share: https://ssw.com.au/people/brady-stroud/
Pain
Profile skill/badge images on SSW People profiles are currently too large, lack spacing between each other, and are not visually separated from the main profile content. Badges are rendered inside the same content container, causing layout issues and inconsistency. Some profiles also contain manually added <hr> elements to compensate for the missing visual separation. The badges should be moved into their own container, resized consistently, spaced evenly, and separated from the rest of the profile content using CSS rather than manual HTML.
Acceptance Criteria
- Badge images are moved into a dedicated container separate from the main profile content div
- Badge images are displayed at a consistent size (100px x 100px)
- Badges have consistent spacing between them (e.g. 0.5rem margin)
- A visual border separates the profile content (title/skills) from the badges using CSS
- Existing manually added
<hr> elements in profile content are removed or no longer required
- Layout changes apply consistently across all SSW People profiles
- No inline styles are required for badge sizing after the change
Reproduce Steps
- Navigate to the SSW People site
- Open any staff profile with skill/badge images
- Observe that badge images are oversized, tightly spaced, and embedded within the main content area
- Compare profiles where
<hr> tags were manually added to create separation
Screenshot

Figure: Profile badges oversized and cramped, needing spacing and visual separation from content
Requested by: @tiagov8 via YakShaver.ai 🦬
cc: @tiagov8, @adamcogan, @GordonBeeming, @bradystroud, @jeoffreyfischer, @joshbermanssw
Hi Team!
🟥 Watch the video (3 min 21 sec)
Url from screen share: https://ssw.com.au/people/brady-stroud/
Pain
Profile skill/badge images on SSW People profiles are currently too large, lack spacing between each other, and are not visually separated from the main profile content. Badges are rendered inside the same content container, causing layout issues and inconsistency. Some profiles also contain manually added
<hr>elements to compensate for the missing visual separation. The badges should be moved into their own container, resized consistently, spaced evenly, and separated from the rest of the profile content using CSS rather than manual HTML.Acceptance Criteria
<hr>elements in profile content are removed or no longer requiredReproduce Steps
<hr>tags were manually added to create separationScreenshot
Figure: Profile badges oversized and cramped, needing spacing and visual separation from content