[Boomarks & History] Alternating row colours



  • Finding the wall of text in the new history panel difficult to read? Try alternating row colours

    Results may vary depending on what colour your theme is using for the containers so play around with the background-color to find something you like. You can also change from (odd) to (even) in the following code or add both

    For all list panels use this

    .vivaldi-tree div + div:nth-child(even) { 
    background-color: var(--colorBgDark);
    }
    

    If you want only the bookmarks and history managers to have them then use this

    .manager .manager-treeview div + div:nth-child(even),
    .startpage .history .manager-content .history-tree div + div:nth-child(even) { 
    background-color: var(--colorBgDark);
    }
    

    If you want to have the side panel different from the managers use both and simply change the background colour.

    You can add more colour by now changing the the odd rows as well like this

     .vivaldi-tree div + div:nth-child(odd) { 
    background-color: var(--colorBg);
    }
    

    One last thing. Now that our managers have a little more flavor lets do something for that wallpaper we like too much to cover up by adding a little transparency

    .manager .manager-content,
    .manager .manager-content .toolbar-wrapper,
    .startpage .history .navigation,
    .startpage .history .manager-content,
    .addbookmark-cardwrapper,
    .manager-editor,
    .startpage .history .Cal__Container__root .ReactVirtualized__List  {
    background-color: var(--colorBgDarker) !important;
    opacity: .95 !important;
    }
    

    Give it try



  • Nice, only I notice a "bug" on download panel with first script...
    the label is always --ColorBg (even when should be brighter or transparent). Other than, works as it should ;)

    0_1490921394330_8189b9d8-fd6d-46ca-9833-f68c700f3565.png



  • @Hadden89

    Thank you for pointing that out. The filename and size seem to need a separate background declared. Just add this

    .panel#downloads li .file,
    .panel#downloads li .file .filename,
    .panel#downloads li .file .size {
    background-color: transparent;    
    }


  • Thanks, now is perfect ;)


Log in to reply
 

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