background on urlbar buttons



  • /* UrlBar buttons mod */
    .button-addressfield.bookmark svg .bookmark-outline, 
    .button-addressfield {fill: var(--colorBg);}
    .ignore-react-onclickoutside.button-addressfield.permission-flash,
    .button-addressfield.permission-location.is-allowing, 
    .button-addressfield.permission-popup.is-blocking,
    .button-addressfield.dragging-cancelled,
    .button-addressfield.input-dropdown, 
    .button-addressfield.reader-mode,
    .button-addressfield.bookmark,
    .siteinfo-symbol {background-color: var(--colorFg); opacity: .7;} /*was Bg*/
    

    Note: It seems to work on any theme combination.
    Tested only on windows. Add flash button :P

    What it does (or should do at least XD)
    0_1507762631862_96f31eb3-7678-48cd-bf1d-e2a765a01835.png
    0_1507762668552_3b5680b5-cff9-4282-a119-6efcf5aeaf35.png



  • What I've been running for a very long time is this:

    .button-addressfield.bookmark svg .bookmark-animated-fill {
    	fill: var(--colorHighlightBg);
    }
    

    Changes the color of the active bookmarks button to the highlight color of the theme. Should be standard in Vivaldi imo.



  • I've been using something very similar but toned down for my dark theme

    .button-addressfield.bookmark.bookmarked svg .bookmark-outline {
        fill: var(--colorHighlightBgDark);
    }
    
    .button-addressfield.bookmark svg .bookmark-animated-fill {
        fill: var(--colorHighlightBgAlpha);
    }
    


  • @luetage I did it but did not change the color, continued gray



  • @mioni

    That code only changes the colour of pages that have been bookmarked.

    If you want to change the colour of the normal bookmark icon, use this selector

    .button-addressfield.bookmark svg .bookmark-outline



  • @sjudenim
    But I wanted it to be filled with red 0_1507770736040_1dec49f9-9c2d-4cd6-9bf9-0074521e0a00.png

    I tested several options and none changed the color.
    strange



  • @mioni

    So it is the bookmarked icon you are after. @luetage's code should work.

    what is the Hightlight colour you are using in your theme?



  • @sjudenim #e2526e



  • @mioni

    Not sure why it isn't working then, there must be some code over riding it. Try adding !important

    .button-addressfield.bookmark svg .bookmark-animated-fill {
    	fill: var(--colorHighlightBg) !important;
    }
    

    or you can do it manually like this

    .button-addressfield.bookmark svg .bookmark-animated-fill {
    	fill: #e2526e !important;
    }
    


  • @sjudenim It worked!


Log in to reply
 

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