Arch Linux

quellen

Member

From: Italy

Registered: 2014-05-24

Posts: 364

GTK3 change scrollbar color

hello,
how can i change color of gtk3 scrollbar?

this is my theme:
https://anonymfile.com/EnP8/cacca.zip

EDIT:
maybe i have solved using this gtk-3.0/gtk.css

@import url("resource:///org/gtk/libgtk/theme/Adwaita/gtk-contained-dark.css");
/*************
 * scrollbar *
 *************/
.scrollbar {
    -GtkScrollbar-has-backward-stepper: 0;
    -GtkScrollbar-has-forward-stepper: 0;
    -GtkRange-slider-width: 13;
}
#.scrollbar.trough,
#scrollbar trough {
#    background-color: black;
#}
scrollbar 
{ 
  background-color: black; 
        transition: 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }

* 
{ 
-GtkScrollbar-has-backward-stepper: false; 
 -GtkScrollbar-has-forward-stepper: false;
}
scrollbar.top 
{ 
     border-bottom: 1px solid @borders;
}

scrollbar.bottom {
        border-top: 1px solid @borders;
}

scrollbar.left {
      border-right: 1px solid @borders;
}
scrollbar.right
{ 
       border-left: 1px solid @borders;
}
scrollbar slider { 

         min-width: 6px;
        min-height: 6px;
            margin: -1px; 
            border: 3px solid transparent; 
     border-radius: 8px;
   background-clip: padding-box; 
#  background-color: #9ca0a1;
  background-color: #bf6b18;
}
scrollbar slider:hover
{ 
#  background-color: #7e8182;
  background-color: #bf6b18;
      border-color: transparent; 
}
scrollbar slider:hover:active
{ 
 
  background-color: #bf6b18;
      border-color:transparent;
}
scrollbar slider:disabled
{ 
  background-color: transparent;
}
scrollbar.fine-tune slider
{ 
            margin:-3px;
         min-width: 6px;
        min-height: 6px;
}
scrollbar.fine-tune.horizontal slider
{ 
      border-width: 5px 4px;
}
scrollbar.fine-tune.vertical slider
{ 
      border-width: 4px 5px;
}
scrollbar.overlay-indicator:not(.dragging):not(.hovering)
{ 
      border-color: transparent; 
           opacity: 0.4; 
  background-color: transparent;
}
scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider
{ 
            margin: 0; 
         min-width: 3px;
        min-height: 3px;
  background-color: #363636; 
            border: 1px solid @button_color;
}
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button
{ 
         min-width: 5px;
        min-height: 5px;
  background-color: #363636; 
   background-clip: padding-box; 
     border-radius: 100%; 
            border: 1px solid @button_color; 
  -gtk-icon-source: none;
}
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider
{ 
            margin: 0 2px; 
         min-width: 40px;
}
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal button { 

            margin: 1px 2px; 
         min-width: 5px;
}
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider
{ 
            margin: 2px 0; 
        min-height: 40px;
}
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical button
{ 
            margin: 2px 1px; 
        min-height: 5px;
}
scrollbar.overlay-indicator.dragging, 
scrollbar.overlay-indicator.hovering
{ 
           opacity: 0.8;
}
scrollbar.horizontal slider
{ 
         min-width: 40px;
}
scrollbar.vertical slider
{ 
        min-height: 40px;
}
scrollbar button 
{ 
              padding: 0; 
            min-width: 12px;
           min-height: 12px;
         border-style: none; 
        border-radius: 0; 
  transition-property: min-height, min-width, color; 
         border-color: transparent; 
     background-color: transparent; 
     background-image: none; 
           box-shadow: inset 0 1px rgba(255, 255, 255, 0); 
          text-shadow: none; 
     -gtk-icon-shadow: none; 
                color: #7e8182;
}
scrollbar button:hover
{ 
      border-color: transparent; 
  background-color: transparent; 
  background-image: none; 
        box-shadow: inset 0 1px rgba(255, 255, 255, 0); 
       text-shadow: none; 
  -gtk-icon-shadow: none; 
  background-color: #565b5c;
}
scrollbar button:active, 
scrollbar button:checked
{ 
      border-color: transparent; 
  background-color: transparent; 
  background-image: none; 
        box-shadow: inset 0 1px rgba(255, 255, 255, 0); 
       text-shadow: none; 
  -gtk-icon-shadow: none; 
             color: @color_700;
}
scrollbar button:disabled
{ 
      border-color: transparent; 
  background-color: transparent; 
  background-image: none; 
        box-shadow: inset 0 1px rgba(255, 255, 255, 0); 
       text-shadow: none; 
  -gtk-icon-shadow: none; 
             color: rgba(126, 129, 130, 0.2); 
}
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");
}

Last edited by quellen (2023-11-14 13:37:35)

---

sorry for my bad english