how to add "scroll buttons" or "scroll arrows" to Office and Firefox

[sbroccolo]

I created this to put all the info in one place without having to follow several threads,
Those little arrows on the scroll bar that used to let you step a line at time have disappeared from most Linux apps. Been gone for awhile.
This is how to add what some call "scroll buttons" others call "scroll arrows" but the official term appears to be "Scrollbar Stepper", to all your apps at once.
I have personally tried this to make sure it works.
I tested LibreOffice,a few text editors, most of the Cinnamon System Settings tools, and Firefox. They are now there, although the first time you run an app they don't look there but as soon as you mouse over it, pop, there they are.
I made these changes on Linux Mint Cinnamon 18.2 but I expect it will work on any Linux distro that uses GTK2 or GTK3.

To give proper credit, the actual changes came from mostly two members of http://www.linuxquestions.org - maxreason and TxLonghorn

Open a terminal.
This procedure uses Mint-X as the theme being changed, replace it with the theme you are using
Use your favorite editor, I've used xed here:

For GTK2 Programs
Make a backup copy first

Code: Select all

sudo cp /usr/share/themes/Mint-X/gtk-2.0/gtkrc /usr/share/themes/Mint-X/gtk-2.0/gtkrc.bak

Edit the file

Code: Select all

gksudo xed /usr/share/themes/Mint-X/gtk-2.0/gtkrc

#Added this line to create Scrollbar stepper
GtkScrollbar::stepper-size = 18
#Modified these lines to enable stepper behavior
GtkScrollbar::has-backward-stepper = 1
GtkScrollbar::has-forward-stepper = 1
GtkScrollbar::slider-width = 18
GtkScrollbar::trough-border = 1
GtkScrollbar::activate-slider = 1
GtkScrollbar::min-slider-length = 24


After making the changes, save and reboot.

For GTK3 Programs
Make a backup copy first

Code: Select all

sudo cp /usr/share/themes/Mint-X/gtk-3.0/gtk-widgets.css /usr/share/themes/Mint-X/gtk-3.0/gtk-widgets.css.bak

Edit the file

Code: Select all

gksudo xed /usr/share/themes/Mint-X/gtk-3.0/gtk-widgets.css

(the section needing change will be around line 1640, depending an the theme, so search on "scrollbar", really only two changes normally)

/*************
* scrollbar *
*************/
/*The following lines have been modified to add scrollbar steppers */

.scrollbar {
background-clip: padding-box;
-GtkRange-trough-border: 2;
-GtkScrollbar-has-backward-stepper: 1;
-GtkScrollbar-has-forward-stepper: 1;
-GtkRange-slider-width: 10;
-GtkScrollbar-min-slider-length: 30;
-GtkRange-stepper-spacing: 0;
-GtkRange-trough-under-steppers: 1;
}

After making the changes, save and reboot.
Yes, you can change both and save both, before rebooting. But I prefer to make one change at a time.
The bolding of the comment lines is simply to draw your attention to them. Not required.
The comment lines are optional but I did program maintenance for too many years, I comment my code changes. If sharing these entire files I would add to the comments - Modified by <yourname> on MM/DD/YYYY, but that's me.

Good Luck. I hope this helps someone.

[Joe2Shoe]

Thank you so much for this addition.
It has been very annoying that all Linux programs do not have scrolling arrows on the right-side of apps, thereby making me cursor-grab the scroll bar and move it up and down manually, therefore causing the window to go "scroll crazy" whenever I need to scroll up or down.
This "fix" has now added scroll arrows in Firefox/Google Chrome/Chromium, etc.
I applied this "fix" to all GTK2 and GTK3 apps.
Good job.

[wings515]

I have just started using Linux Mint and noticed missing scroll bar pointers on Firefox. I searched and found a solution posted in 2017. I tried to perform the requires changes to the files but an error message stating I did not have permission to do this change.
What am I doing incorrectly?
Thank you,
wings515

[smurphos]

Hi,

The 'best' way in current Mint 19 is to make a gtk3 override file. This was it's theme agnostic.

Open / Create your gtk3 over-ride file by running this command in a terminal

Code: Select all

xed ~/.config/gtk-3.0/gtk.css

Then add the following code block to the file, save and log out and back in.
How this looks does vary by theme but it looks reasonable on most gtk themes I've tried.
Note for Mint 19.2 + Cinnamon users - this over-ride will interfere with the GUI option to set scrollbar width in the Themes module.

Code: Select all

/* Scrollbar width fixes */
scrollbar.vertical slider,
scrollbar.slider.vertical
{
    min-width: 1em;
}
scrollbar.horizontal slider,
scrollbar.slider.horizontal
{
    min-height: 1em;
}

/* Steppers */
* {
    -GtkScrollbar-has-backward-stepper: 1;
    -GtkScrollbar-has-forward-stepper: 1;
}

scrollbar button {
    min-width: 1em;
    min-height: 1em;
}

scrollbar.vertical button.down {
    -gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
}

scrollbar.vertical button.up {
    -gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
}

scrollbar.horizontal button.down {
    -gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
}

scrollbar.horizontal button.up {
    -gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
}

[sjmathis]

Wow! Amazing. Seems to have added 'scroll buttons' to everything that has a scroll bar? I tried the second method, since I'm running 19, and it worked like a charm.

Since this is a tutorial, could you also explain what GTK is? I gather that it's a piece of software that does things to things running on your desktop, but What else does it do? Why are there two of them (GTK3 and GTK2)?

By very strange coincidence, my wife, who is a non-techie Windows user, was trying to scroll a window on our laptop that we use for a music player, and I was unable to tell her how to do it using something that she understood, so I had to get off the couch and do it for her. Now I know how to fix that. Many thanks!

[smurphos]

Since this is a tutorial, could you also explain what GTK is? I gather that it's a piece of software that does things to things running on your desktop, but What else does it do? Why are there two of them (GTK3 and GTK2)?

So GTK (aka GTK+ and originally the Gimp ToolKit) is one of several toolkits for building GUI applications and desktop UIs (the other main one in the Linux world being QT), basically a set of building blocks or elements (buttons, text boxes, menus etc) that app developers can reference in their code to build what you see on your screen, modified by the end-users choice of GTK theme. It saves app developers having to develop UI elements from the ground up.

It's had a number of iterations and versions jumps but at the time of writing has two supported versions that can and do coexist - GTK2 whose most recent major release was in 2011 and it's successor GTK3 which was in development since 2011 and whose final version 3.24 was released in 2018. The next iteration GTK4 is in the works but I suspect that won't be a 'thing' for Mint users until Mint 21 in 2022.

As of Mint 19.x all the supported desktop environments are GTK based and the majority of your applications are GTK3 based albeit there are still significant numbers of GTK2 based apps (GIMP being the main once installed in Mint by default) . You can install and run QT based apps as-well.

Cinnamon and Mate are GTK3 based desktop environments, XFCE is in the process of moving from GTK2 to GTK3. Mint 19.3's XFCE should be fully GTK3.

More info

https://en.wikipedia.org/wiki/GTK
https://en.wikipedia.org/wiki/Qt_(software)

[sbroccolo]

Thank you smurphos for adding that explanation. I have not tried it yet but I believe the gtk css override method is a better solution than my original. Thanks!

[MintJack]

Smurphos,

Thanks for posting this solution! Before I try this, is it important to copy or back up that css file first?

[smurphos]

Smurphos,

Thanks for posting this solution! Before I try this, is it important to copy or back up that css file first?

It doesn't exist out of the box so there's nothing to copy / backup unless you've already added the file.

[MintJack]

Thanks very much for this. Will try the command set above.

Related:

Is there a way to submit a feature request for a future update of Mint? On older hardware when trackpads are a bit worn, it becomes really difficult to two-finger scroll with any precision. Especially on a long document or page, the jumps become huge. A stepper is a big help.

It would be great if it could be added to the GUI customization tools for the theme, just as scroll-bar width is now. I'm a new user, so not sure where to feed this in for consideration. Judging by search results, it seems like an item users want. Thanks for any advice!

[pbear]

There is a sub-forum called Suggestions & New Ideas. Don't expect any change on this issue, though. Linux developers on the whole seem to have decided scroll arrows are passe. Ubuntu Mate is the only distro I've noticed to include them by default.

On the bright side, once you've created your gtk.css file, it's very portable. Has worked in nearly every desktop and distro I've tested.