Make the website responsive so it has good layout on phones
A
Andy Edwards
The layout of the website on mobile is so broken that it seems like no one cares about the mobile experience.
I check build failures all the time on my phone but it can be really difficult to work with various portions of the UI like looking at step logs.
The logs should have a minimum width and horizontal scrolling, and the padding for desktop takes up way too much space on small screens. There are like 5 separate levels of padding between the edges of the screen and the log output, leaving around 20 characters per line which causes catastrophic wrapping.
Step titles also get wrapped so badly that they take up half the screen height because most of the horizontal space is taken up my icons and duration. Either flex-wrap the icon buttons to a second line, or collapse them into a single menu button on small screens.
On a small screen the step headers should occupy the full screen width instead of being inside two levels of padding.
I was trying to create a personal API token on my phone to connect a 3rd party iPhone app with better UX, the API tokens UI is also really mangled on mobile. Table cells too narrow, dialogs wider than the screen. (unfortunately the iPhone app isn’t working, it seems like the PAT format has changed)
Mitchell Jeff
A responsive design is essential today because many visitors access websites primarily through smartphones. The layout should automatically adjust to smaller screens so that text, images, buttons, menus, and forms remain easy to read and use. I would recommend using a mobile-first approach and testing the website across different phone sizes and orientations. Navigation should be simple, with buttons large enough to tap comfortably without accidentally selecting other elements. Images should resize properly without becoming distorted, while unnecessary spacing and oversized sections should be reduced on smaller screens. Font sizes and line heights should also remain readable without requiring users to zoom in. It’s equally important to check page speed, since mobile users may have slower connections. A well-optimized responsive layout can improve usability, reduce bounce rates, and create a much more professional experience for visitors on phones.
Autopilot
Merged in a post:
Fix mobile responsive design
F
Federico Bond
I sometimes open CircleCI on my phone to retry a failed workflow or to approve an approval type job, but with the new UX I feel like I am constantly fighting the layout and not seeing the buttons I need. A little attention to responsiveness and a couple of adjustments here and there could go a long way.