Being a Front-end Developer isn't just about creating new components or functionality. Sometimes you need to update existing components for improvements or bug fixes.

Search tray display on large breakpoint

Users accessing our pages on a large breakpoint and above were complaining that site search was not obvious enough. We decided to change the display so that it always displays the search tray (input field) where there is space to do so.

The video shows an archived version of our staff landing page where the user had to click on the icon to show the search tray. Then you will see my changes on the current page. When the screen is reduced to our medium breakpoint, functionality reverts to display just the icon, as there is less space.

External homepage pinned item display

Whilst we were developing our new external homepage, we needed to ensure that content would be responsive. I looked at

Orbit controls for media embed

We opted to use the Foundation Orbit carousel for our video embed section, but we wanted to adapt how the controls are displayed. On larger breakpoints, where there is room, we wanted them to sit outside the embed itself. When the screen size is reduced, the controls shift so they are within the embed frame.