In relation to my previous posts, I am trying to make the bookmark bar show when hovering over the urlbar only instead of the whole nav bar. However replacing the suited elements with #urlbar:hover does not work. What can I do to achieve this?

  • @MrOtherGuyM
    link
    22 months ago

    #urlbar:hover won’t work because bookmarks toolbar is not inside urlbar. You could do this using the :has selector but at this point I think it would probably be best to just throw autohide_bookmarks_toolbar.css out the window and instead write some custom thing.

    So, what you could do instead is to go to customize mode and move bookmarks toolbar items out of the bookmarks toolbar and place it directly to the right of the urlbar. Then use some css like this:

    :where(#urlbar-container) + #personal-bookmarks{
      position: absolute !important;
      top: 100%;
      width: 100vw;
      transform: scaleY(0);
      transform-origin: top;
      transition: transform 100ms ease 400ms;
    }
    #urlbar-container:hover + #personal-bookmarks,
    #personal-bookmarks:hover{
      transform: scaleY(1);
    }
    #PlacesToolbar{
      justify-content: center;
    }
    #PlacesToolbarItems{
      max-width: min-content;
      background-color: var(--toolbar-bgcolor);
      border: 1px solid black;
      border-top: none;
    }
    #navigator-toolbox{
      z-index: 4 !important;
    }
    

    You can then just hide disable the bookmarks toolbar.

    • @subhasutraOP
      link
      12 months ago

      Thank you! It works exactly as intended!