Hide admin toolbar completely (on non-admin-routes)

Created on 19 August 2022, over 2 years ago
Updated 13 February 2023, about 2 years ago

Motivation

I was missing the functionality to completely toggle away the toolbar.
Because on different projects i had different problems with the auto-pushdown if you have fixed elements in your layout or if you are developing and your kint/dpm hides behind the toolbar and i just wanted to quickly check how it would look without the toolbar without loging out or open an inkognito-tab.

Implementation

It´s a quick and dirty js and css solution, which adds a toggle button to hide and show the toolbar in the topleft, i implemented it only on non-admin-routes because it didnt bother me on admin routes. It´s quick and dirty because i made it for myself, but why not share it with you because it kinda does it´s job.

Caveats

Its not fancy at all, it does not save it´s state through request, it´s css is optimized for Claro admin, the "toggle" is fixed on mobile even though (parts) of the mobile toolbar are not.

Feature request
Status

Needs review

Version

3.1

Component

Code

Created by

🇩🇪Germany sascha_meissner Planet earth

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Merge Requests

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

  • 🇩🇪Germany sascha_meissner Planet earth

    I´m not sure why this works for me and not for you.
    Within the patch i use utf-8 symbols ▲ and ▼

  • 🇮🇳India vinaymahale

    Any updates or work done here?

  • 🇩🇪Germany Anybody Porta Westfalica

    Really good and helpful idea! Especially when theming projects and you need to be logged in, but the admin toolbar should be toggled away. In mobile devices it's quite space-consuming.

    So yes, would be nice to proceed here.
    As a first step, the patch might be turned into a MR for easier review and merge?

  • 🇩🇪Germany sascha_meissner Planet earth

    Thanks Anybody,
    so what really needs to be done IMHO is to make it work properly with oliviero and probably also with gin admin theme. Besides that making it a MR seems to be a good step. I hope i can take a dive into this again soon, because on the sites i´m using this it´s actually very handy and on other sites where i dont/cant use this i find myself often in the browsers element inspector and remove the toolbar to see whats under it ... :)

  • Status changed to Needs work over 1 year ago
  • 🇩🇪Germany Anybody Porta Westfalica

    Thanks, might also go into https://www.drupal.org/project/gin_toolbar - what do you think makes more sense? Or should you ask the admin_toolbar maintainers first, if they are interested in this feature?

  • 🇨🇭Switzerland handkerchief

    +1 for this feature! I've wanted that for a long time for the same reason as the author of this issue.

  • 🇩🇪Germany Anybody Porta Westfalica
  • 🇩🇪Germany sascha_meissner Planet earth

    Thank you for the feedback :-)
    This was my first try to contribute something when i started learning Drupal, it turned out to be more complicated than i thought due to the fact that admin-themes are variable and come with their own markup. Now two years later i´m thinking that it would still be a nice feature, gin-theme tried to adress it a little bit by putting stuff into the sidebar but still there is no way to also remove the top-bar. So what i am thinking of right now is that the toggling could be made with a keyboard-combination sth. like "shift + h" with no button at all, so there the whole problem-layer with positioning and styling the button would disappear. I´ll try to code something up when i have an oppurtunity/time :)

  • 🇨🇭Switzerland handkerchief

    Great! Until now, we have always had to solve this by creating a new role especially for this scenario, which is an unnecessary effort.

  • Open on Drupal.org →
    Core: 9.5.x + Environment: PHP 7.4 & MySQL 8
    last update about 1 year ago
    Waiting for branch to pass
  • Status changed to Needs review about 1 year ago
  • 🇩🇪Germany sascha_meissner Planet earth

    Hey i just implemented what I was describing in my last comment.
    You can now use the key-combination "Shift + H" to toggle the toolbar, IMHO this is working veeeery good, i like it very much, also my team does :P
    Due to the fact that there is no css required anymore it just works, no matter if you use Claro or Oliviero or other theme. I also removed the differenciation between admin and non admin routes, because i didnt see the point anymore.
    Also i created an issue fork and a mergerequest.
    Please test and review my changes :)

  • 🇨🇭Switzerland handkerchief

    Thank you very much for your work. But I am a bit confused. The toolbar on the left disappears, but:
    - The padding on the left remains
    - The toolbar at the top of the screen remains

    Just the icons of the toolbar on the left are gone. I currently have zero benefit. The goal would be to be able to hide the admin areas in the frontend as if you were viewing the website anonymously. But the admin bars still disrupt the whole layout.

  • Status changed to Needs work about 1 year ago
  • 🇩🇪Germany sascha_meissner Planet earth

    @handkerchief, now I see what you mean... it works good for the "regular" admin-toolbar in bartik or oliviero, but it has issues on gin-theme i didnt test. Let me see if i can figure something out for gin

  • Open on Drupal.org →
    Core: 9.5.x + Environment: PHP 7.4 & MySQL 8
    last update about 1 year ago
    Waiting for branch to pass
  • Status changed to Needs review about 1 year ago
  • 🇩🇪Germany sascha_meissner Planet earth

    @handkerchief Works fine now with gin as admin-theme as well :-)
    Built in a little check if it´s gin and if so also hiding the "gin-secondary-toolbar--frontend" and correctly overwriting the paddings, this didnt work before because gin uses !important rules here, please review and test.

  • 🇨🇭Switzerland handkerchief

    @sascha_meissner thank you very much, it's working now.
    When hidden and when reloading, the page jumps because the toolbar is displayed first. This is due to the nature of the thing when the script is executed, so probably not much can be changed. In any case, a big step forward, thanks again.

  • Open on Drupal.org →
    Core: 9.5.x + Environment: PHP 7.4 & MySQL 8
    last update 11 months ago
    Waiting for branch to pass
  • 🇩🇪Germany sascha_meissner Planet earth
  • First commit to issue fork.
  • Pipeline finished with Failed
    2 months ago
    Total: 503s
    #412536
  • First commit to issue fork.
  • 🇩🇰Denmark ressa Copenhagen

    Thanks! Perhaps the "Implementation" section could include an image or two, based on the latest MR?

  • 🇩🇪Germany sascha_meissner Planet earth

    Sry guys, i started this but didnt find the time to come back to finish.

    IMHO there is two things left that need work

    1. Put this into a submodule, so it is better isolated, optionally and probably preferred by the maintainers.
    2. Have an indicator that your toolbar is currently not displayed somewhere.

  • 🇩🇰Denmark ressa Copenhagen

    Thank you for fast feedback @sascha_meissner, it's greatly appreciated. And I understand, things can get in the way. I have added the remaining tasks in the Issue Summary.

    There is also the new feature of letting the menu stay at the top, which may help in some cases.

  • Pipeline finished with Success
    about 2 months ago
    Total: 453s
    #436592
  • 🇩🇪Germany sascha_meissner Planet earth

    Thank you @ressa !

    So i already putted this into a submodule for now :)
    IDK whether this feature will ever make its way into the module, but personally i still like it and have the personal motivation to at least leave this clean because it´s the first contribution i ever created when i started with drupal :P

  • 🇩🇰Denmark ressa Copenhagen

    Nice thanks! The first contribution is always special :)

Production build 0.71.5 2024