Firefox Scrollbars

JtringJtring Major grinsCaliforniaRegistered Users Posts: 582 Major grins
edited November 4, 2019 in SmugMug Feature Requests

I observe that sometime in the last few days, SmugMug updated the color of the Firefox scrollbars. It now appears the thumb (the sliding part) on a Firefox scrollbar inside the body of Smugmug page takes on the text color defined by the active theme. That certainly makes the scrollbar more visible, which is mostly but not entirely a positive.

The upside is that the scrollbars are now clearly visible in places like the carousel display where they all but vanished before. The downside, however, is that the theme text color is not a great choice for the scrollbars in the lightbox photo details sidebar display. That harsh dividing line between the text in the sidebar and the image is back again, at least for me. Since I hide the camera details "show more" button when not logged in, this isn't that big a deal for me. A user has to come in with a fairly small screen or small window to require a scroll bar. But it can happen, and when it does, it isn't pretty.

So what would I like to see?

A different color choice related to the page color could work. The text color but with reduced opacity (alpha) could work too. Best, as I've noted before, would be to let the user set the scrollbar thumb and track colors via custom CSS. Right now, that's possible in the Chrome/webkit world, but not for Firefox. SmugMug's interpreter removes the Firefox scrollbar rules in user CSS rather than sending them out with the site web pages. Note neither they, nor the Chrome/webkit rules, are "standard" CSS. Both are special extensions. But only the Firefox ones get stripped.

Jim Ringland . . . . . jtringl.smugmug.com

Comments

  • AllenAllen "tweak 'til it squeaks" St. Louis, MoRegistered Users Posts: 9,817 Major grins
    edited November 3, 2019

    This is what is now controlling the scroll bars. The percent of transparency has been removed.

        .sm-user-ui body * {
            scrollbar-color: #d3d4d4 transparent;
        }
    

    When all that was needed was the change the transparency from 0.1 to about 0.3.

    .sm-user-ui body * {
        scrollbar-color: rgba(211,212,212,0.1) transparent;
    }
    

    This was located in this file, same file new change is.
    https://cdn.smugmug.com/css/color/p/4444/1571064758-32688df7ba67ea5798b84220e6868b0c.css

        .sm-user-ui body * {
            /* scrollbar-color: #d3d4d4 transparent; */
            scrollbar-color: rgba(211,212,212,0.3) transparent;
        }
    
    Al - Just a volunteer here having fun
    My Website | My Blog
  • AllenAllen "tweak 'til it squeaks" St. Louis, MoRegistered Users Posts: 9,817 Major grins
    edited November 3, 2019

    Actually, if they would reverse the thumb color with its "clicked on" hover color it would be close to perfect.

    Al - Just a volunteer here having fun
    My Website | My Blog
Sign In or Register to comment.