Hello,
Is there any way to put the arrows on pages?
Im using 20.04,4 LTS Focal Fossa.
Thanks.
Do you want to put arrows on the scrollbar?
You need to modify you theme gtk.css (don't know exactly how, sorry), or just download a new theme from mate-look.org that have that feature.
Most of the themes in the mate-themes package should contain scroll bar arrows. As stated above they are defined in the gtk3 theme and sometimes called scroll bar steppers.
There are a ton of "incomplete" themes out there (only work for one DE, scroll bar steppers aren't defined etc.). This is the price for almost unlimited gtk3 customization.
I borrowed the scroll bar section from the Menta theme and put it into a Mint-X theme, because Mint-X had a non-functional scroll bar stepper implementation. It was there and commented out, but it was obvious it had never been tested.
EDIT: Below is the text/code I copied from Menta. It gave me working scroll bar steppers in Mint-X. I'm not a gtk themer. I copy and paste and sometimes I get lucky.
/**************
* Scrollbars *
**************/
scrollbar {
background-image: none;
border-style: solid;
border-color: shade (@theme_bg_color, 0.94);
-GtkScrollbar-has-backward-stepper: true;
-GtkScrollbar-has-forward-stepper: true;
}
scrollbar.vertical {
border-width: 0px 0px 0px 1px;
min-width: 10px;
}
scrollbar.horizontal {
border-width: 1px 0px 0px 0px;
min-height: 10px;
}
scrollbar trough,
scrollbar.vertical trough,
.sidebar scrollbar trough,
.sidebar scrollbar.vertical trough,
placessidebar scrollbar trough,
placessidebar scrollbar.vertical trough {
min-width: 13px;
background-image: linear-gradient(to right,
@scrollbar_trough,
shade (@scrollbar_trough, 1.08));
border-width: 1px 0px 1px 0px;
border-style: solid;
border-color: shade (@theme_bg_color, 0.94);
border-radius: 0;
border-image: none;
}
scrollbar.horizontal trough,
.sidebar scrollbar.horizontal trough,
placessidebar scrollbar.horizontal trough {
min-width: 13px;
background-image: linear-gradient(to bottom,
@scrollbar_trough,
shade (@scrollbar_trough, 1.08));
border-width: 0px 1px 0px 1px;
border-style: solid;
border-color: shade (@theme_bg_color, 0.94);
border-radius: 0;
border-image: none;
}
/* Buttons */
scrollbar.vertical button,
scrollbar.vertical .button {
min-width:13px;
min-height: 16px;
padding: 1px 0px;
}
scrollbar.horizontal button,
scrollbar.horizontal .button {
min-width:16px;
min-height: 13px;
padding: 0px 1px;
}
scrollbar.vertical button.up,
scrollbar.vertical .button.up {
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
}
scrollbar.vertical button.down,
scrollbar.vertical .button.down {
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
}
scrollbar.horizontal button.up,
scrollbar.horizontal .button.up {
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
}
scrollbar.horizontal button.down,
scrollbar.horizontal .button.down {
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
}
scrollbar button,
scrollbar button:checked,
scrollbar button:hover:active,
scrollbar button:disabled,
scrollbar .button,
scrollbar .button:checked,
scrollbar .button:hover:active,
scrollbar .button:disabled {
border-style: none;
border-image: none;
border-radius: 0;
}
scrollbar button:checked,
scrollbar button:hover:active,
scrollbar .button:checked,
scrollbar .button:hover:active {
background-color: alpha(shade(@scrollbar_trough, 0.8), 0.5);
}
scrollbar.top button:hover,
scrollbar.top .button:hover {
box-shadow: inset 0 -1px mix(@scrollbar_slider, @scrollbar_trough, 0.8);
}
scrollbar.bottom button:hover,
scrollbar.bottom .button:hover {
box-shadow: inset 0 1px mix(@scrollbar_slider, @scrollbar_trough, 0.8);
}
scrollbar.right button:hover,
scrollbar.right .button:hover {
box-shadow: inset 1px 0 mix(@scrollbar_slider, @scrollbar_trough, 0.8);
}
scrollbar.left button:hover,
scrollbar.left .button:hover {
box-shadow: inset -1px 0 mix(@scrollbar_slider, @scrollbar_trough, 0.8);
}
scrollbar button,
scrollbar .button,
scrollbar button:backdrop,
scrollbar .button:backdrop {
background-image: linear-gradient(to bottom,
shade (@button_active_gradient_color_a, 1.12),
shade (@button_active_gradient_color_b, 1.12));
background-color: transparent;
}
scrollbar button:hover,
scrollbar .button:hover {
background-color: transparent;
background-image: linear-gradient(to bottom,
shade (@button_active_gradient_color_a, 1.20),
shade (@button_active_gradient_color_b, 1.15));
color: @theme_selected_bg_color;
}
scrollbar button:disabled,
scrollbar .button:disabled {
color: @insensitive_fg_color;
}
scrollbar button:checked,
scrollbar .button:checked {
color: @theme_fg_color;
}
scrollbar button:backdrop {
color: @theme_unfocused_fg_color;
}
scrollbar slider,
scrollbar .slider,
scrollbar button,
scrollbar .button {
transition: all 400ms ease-out;
}
Hi @sydsider66, do you mean in Firefox? They do their own scrollbars. If so, the about:config setting is:
widget.non-native-theme.gtk.scrollbar.allow-buttons
Set it to true and restart firefox to see the change.