I have created a standard hover background which, using various stanzas, applies to everything except the toolbar bookmark items and buttons. The following code doesn’t have the desired effect on bookmarks. What will? The browser toolbox only shows the main window so I have improvised.

toolbarbutton.bookmark-item(hover) { background-color: #6495ed !important; }

I can’t think what to use for toolbar buttons such as UBlock Origin.

    • @MrOtherGuyM
      link
      12 months ago

      Unless I’m missing something, that looks pretty much as it should be. What’s wrong with it?

      • tjn21OP
        link
        fedilink
        12 months ago

        Thanks. I tried selecting every category and nothing pointed to the bookmark items. They are all folders and are on the menu bar, as are the toolbar buttons. I did find what seems to be the set of toolbar buttons but the following code has no effect on the hover colour :

        #mainPopupSet { --toolbar-field-focus-background-color: #6495ed !important; }

        • @MrOtherGuyM
          link
          12 months ago

          I think you should take a screenshot that shows the thing you are trying to change background color of, because currently I have no idea what it might be.

          • tjn21OP
            link
            fedilink
            12 months ago

            Thanks. Below is a screenshot of toolbar buttons and bookmarks shown on the menu bar. When I hover over any item, the background colour is a light grey (probably the default).

            https://imgur.com/9hQHw6u

            • @MrOtherGuyM
              link
              12 months ago

              In that case the code you posted should work, provided that you fix the hover syntax:

              toolbarbutton.bookmark-item:hover { background-color: #6495ed !important; }
              
              • tjn21OP
                link
                fedilink
                12 months ago

                Thanks. What about the toolbar buttons?

                • @MrOtherGuyM
                  link
                  12 months ago

                  You could do this:

                  toolbar .toolbarbutton-1:not([disabled]):hover > :is(.toolbarbutton-icon, .toolbarbutton-text, .toolbarbutton-badge-stack){
                    background-color: #6495ed !important;
                  }
                  

                  But if you want to just change the background-color of all the elements where that same color gets used (so buttons, bookmark-items, tabs scrollbuttons, sidebar switcher button etc.) then it would be much easier to redefine the value for the variable they all use:

                  :root{
                    --toolbarbutton-hover-background: #6495ed !important;
                  }
                  
                  • tjn21OP
                    link
                    fedilink
                    12 months ago

                    Thanks again. That does not have the desired result on my browser. The following code changes the hover colour of all toolbar buttons including bookmark items.

                    toolbarbutton:hover { background-color: #6495ed !important; }