Fixing the admin sidebar in mobile

Profile Picture
Published on Sep 5, 2019🌏 Public

In GitDuck, instead of having regular pages to edit a content, we decided to add an admin sidebar open it to edit the content they see. To make this work the sidebar squeezes the content by adding some css classes.

The issue found was that in mobile (or smaller screens) the username link in the header was pushing the settings icon (that opens the sidebar) to be on top of the admin sidebar when it was open.

We managed to solve it by making sure that the username is not visible when the admin sidebar is open and in the process we make these improvements:

  • Settings icon stays in the correct position now.
  • GitDuck logo changes to icon when in mobile.
  • Hided footer when admin is open.
  • Admin goes almost full-screen in smaller screens.

Thank you for reporting this issue @moshfeu!