Session log — Past Events page restyled as a gallery
← All session logs
Session log — Past Events page restyled as a gallery
Summary
Restyled the Past Events page on the live medilearn.africa site to match a podcast-style reference Hasmukh shared. The most recent event now sits large at the top as a featured item, with all events shown below as a gallery of photo tiles. Clicking any face brings that event up into the featured spot and plays its recording there. The new look is built to grow well as more events are added. The previous layout was backed up first, and the page was checked and confirmed working.
Decisions
- Match the reference screenshot: a dark panel for impact, one featured event up top, and a gallery of faces below.
- Clicking a face loads that event into the featured area and plays the recording there, rather than opening a separate page. This keeps recordings playing on our own site, which is what the private video setting needs.
- Keep the medilearn green as the accent colour on the dark panel, so it stays on brand.
- Replace the old vertical list and the year buttons with the new gallery, to keep it clean and close to the reference.
- Feature the most recent event automatically, so the page always leads with the latest talk.
Changes made
- Gave the Past Events page the new gallery look on the live site.
- The most recent event (currently Prof Mashiko Setshedi) is featured large at the top, with photo, summary, a Read more link and a Watch the recording button.
- All events appear below as photo tiles with names. Clicking one lifts it into the featured spot and plays it there.
- Checked the page loads correctly with no new errors, and confirmed both current events show with their recordings linked.
- Kept a backup of the old layout so it can be put back at any time.
- Later in the session, at Hasmukh's request, added a "Meet our speakers" button at the foot of the panel that links to the Speakers page. Checked it works and points to the right page.
Follow-ups
- The featured Setshedi event has a test video link on it, so its Watch button plays the wrong clip. Hasmukh to send the real recording link so it can be set.
- Hasmukh to open medilearn.africa/past-events, refresh, and have a look. Easy to adjust the shade of the panel, how many faces sit across a row, or what the featured area shows.