Bookmarks in Address Bar Mod



  • @j1979958 You can define the addressbar as
    adr = document.querySelector('.toolbar-addressbar.toolbar');
    and then just append the bookmarks
    adr.appendChild(morebookmarks);



  • so how will it wrap the code?

    actually i use:

    CSS:
    /width of bookmarks bar/
    :root {
    --bar-width: 495px;
    }
    @media (max-width: 700px) {
    :root {
    --bar-width: 22px;
    }
    }
    /bookmarks bar in address bar/
    #browser.bookmark-bar-top > #main > .toolbar-addressbar{
    padding-right: var(--bar-width);
    }
    #browser.bookmark-bar-top > #main > .bookmark-bar{
    width: var(--bar-width);
    position: absolute;
    right: 0;
    height: 35px;
    }
    /hide folder icons/
    #browser.bookmark-bar-top > #main > .bookmark-bar .folder-icon{
    display:none
    }
    #browser.bookmark-bar-top > #main > .bookmark-bar .folder-icon+span{
    margin-left: 0px;
    }



  • @j1979958 No idea, the solution I provided is for the javascript mod. I thought the CSS mod shows at the end of addressbar anyway, so not sure what your problem really is.



  • Re: Bookmarks in Address Bar Mod

    Okay so I added this, it creates the buttons but they are unclickable (and the whole bar is greyed out, can't click to open sites or see the rest with the >> button)
    0_1563550026553_1887fe42-928a-4310-b61a-e44f286391b8-image.png
    Any idea why? Running Vivaldi 2.6 on Windows 10 x64

    (green icon and 3 dots are normal addons, then the greyed out bookmarks)

    EDIT: FIXED!
    Replace this section in the css code (basically adding the z-index line):

    #browser.bookmark-bar-top > #main > .bookmark-bar{
    width: var(--bar-width);
    position: absolute;
    right: 0;
    height: 35px;
    z-index: 10;
    }
    

    Solution thanks to @RSD



  • I LOVE THIS MOD, better UI that the bookmarks bar.



  • Thanks for this mod. I don't know why they force you to use the bookmark bar, that wastes screen space. When they also could offer you a boomark button like in Firefox. It was the only thing that annoyed me with Chrome based browsers. I hope it will be added natively in Vivaldi some day.



  • @wadhah Adding Z-index helped, it stopped working after the update with the bookmarks.

    I'm having trouble setting up the version with the java script though, I wanted it next to the adress bar. Should it also be put into /style folder? I really don't know what I might be doing wrong here.



  • This post is deleted!


  • Using the js mod and is working very nice! 👍
    There is an annoyance though..

    The appearance of the button looks blank, like this:
    alt text
    The dropdown menu is white, too.
    They don't understand the dark skin I use.. 😟
    Is there a way to make them dark (by settings or CSS)?



  • OK, found it..
    Just added

    morebookmarks.style.background = "#666666";
    morebookmarks.style.borderWidth = "0";
    morebookmarks.setAttribute('title', "Bookmarks");
    

    and got this:
    image

    Searching for the menu color solution now..
    This looks like a global system (Windows) setting though...😠



Looks like your connection to Vivaldi Forum was lost, please wait while we try to reconnect.