Change UI of bookmark window

  • I'm new here and with Vivaldi. And tried to search a lot (and found a lot of answers for my other questions) before asking the most propably stupid questions, for which I was not able to find something 'till now:

    How can I hide the count/number of folders?
    How can I hide the arrow in front of the folders?
    How can I hide the link/folder description/preview?

    Would be more than great, if someone can help with this newbie-questions. 🙂

  • @arganto
    No with a feature/setting yet.
    But should work via a mod:

    .vivaldi-tree .tree-row label span.item-count,
    .vivaldi-tree .tree-row .expand-icon {display: none;}

    About hiding link/folder, you may drag the separator on bottom to hide elements.

  • Thanks a lot. Works perfectly for arrow and numbers! More than great!

    Any way to hide the element completely? Firstly it popped always back to normal heigh, but now this worked as well, but the line is then still visible


    Is there such css-way to delete the whitespace in front of the links as well?


  • @arganto

    This should hide the whole element:

    .panel-bookmarks .panel-bookmarks-edit {display: none;}

    About the whitespace, what exactly do you mean?
    There was a mod of some time ago, but may mess with subfolders layout and other mods, and is not exactly simple to start with.

  • @Hadden89 Thanks again. Great great great. The css tweak and the link to the mod. I took what I needed from there now. This is what I wanted with the "whitespace"/indent.

    And because of that I changed your icon-display= none for me to

    .vivaldi-tree .tree-row .expand-icon svg {
      fill: #ffffff;
      stroke-width: 0;

    and combined with the mod-link-code via

    /* Top level */
    .panel-bookmarks .vivaldi-tree .tree-item
    .tree-row label > :not(.expand-icon):first-child[style*="margin-left: 16px"] {
        margin-left: 0px !important;
    .panel-bookmarks .vivaldi-tree .tree-item
    .tree-row label > .expand-icon:first-child[style*="margin-left: 0px"] {
        margin-left: -16px !important;
    /* Second level */
    .panel-bookmarks .vivaldi-tree .tree-item
    .tree-row label > :not(.expand-icon):first-child[style*="margin-left: 32px"] {
        margin-left: 8px !important;
    .panel-bookmarks .vivaldi-tree .tree-item
    .tree-row label > .expand-icon:first-child[style*="margin-left: 16px"] {
        margin-left: -8px !important;

    Then I have still the indent.

    But anyway. Without your tipps/hints, wouldn't be able to find/do this. 🙂

Log in to reply

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