Re: Changing GTK+ theme colors

[Tomasz Jankowski <tomcioj gmail com>]

Hello,

Thank you for response, but there's problem. I forgot to mention, that
I'm using GTK+ 2.24. It's software for embedded device and I cannot
upgrade to GTK+ 3. How can I achieve the same with GTK+ 2?

2013/2/14 Mariano Gaudix <marianocordobario3 gmail com>:
> Hello.
>
>
> a  example  with CSS .
>
>
> //////////////////////////////////////////////////////////////////////////////////////
> The other alternative is to go to theme of Gtk 3.6
>  and change the sentences.
>
> for  example
>
>
>
>
>
> /*************************
>  * progressbar and scale *
>  *************************/
> GtkScale,
> GtkProgressBar {
> border-radius: 0;
> border-width: 1px;
> padding: 0;
> }
>
> .menubar .menuitem .scale.highlight.left,
> .scale.highlight.left,
> .progressbar,
> .progressbar row,
> .progressbar row:hover,
> .progressbar row:selected,
> .progressbar row:selected:focused {
> background-image: -gtk-gradient (linear, left top, left bottom,
> from (shade (@selected_bg_color, 0.96)),
> to (shade (@selected_bg_color, 1.1)));
> border-width: 1px;
> border-style: solid;
> border-color: shade (@selected_bg_color, 0.8);
> box-shadow: inset 0 1px alpha (shade (@bg_color, 1.26), 0.3);
> }
>
> .scale.highlight.bottom,
> .progressbar.vertical {
> background-image: -gtk-gradient (linear, left top, right top,
> from (shade (@selected_bg_color, 0.96)),
> to (shade (@selected_bg_color, 1.1)));
> border-width: 1px;
> border-style: solid;
> border-color: shade (@selected_bg_color, 0.8);
> box-shadow: inset 1px 1px alpha (shade (@bg_color, 1.26), 0.3);
> }
>
> .scale.highlight.left:insensitive {
> background-image: -gtk-gradient (linear, left top, left bottom,
> from (shade (@bg_color, 0.95)),
> to (shade (@bg_color, 0.85)));
> }
>
> .scale.highlight.bottom:insensitive {
> background-image: -gtk-gradient (linear, left top, right top,
> from (shade (@bg_color, 0.95)),
> to (shade (@bg_color, 0.85)));
> }
>
> .trough,
> .trough row,
> .trough row:hover,
> .trough row:selected,
> .trough row:selected:focused {
> background-image: -gtk-gradient (linear, left top, left bottom,
> from (shade (@bg_color, 0.9)),
> to (shade (@bg_color, 0.98)));
> border-width: 1px;
> border-style: solid;
> border-radius: 0;
> border-color: shade (@bg_color, 0.8);
> }
>
> .trough.vertical {
> background-image: -gtk-gradient (linear, left top, right top,
> from (shade (@bg_color, 0.9)),
> to (shade (@bg_color, 0.98)));
>
> border-width: 1px;
> border-style: solid;
> border-radius: 0;
> border-color: shade (@bg_color, 0.8);
> }
>
> .scale.trough.horizontal {
> margin: 6px 0 5px 0;
> border-radius: 8px;
> background-image: none;
> background-color: shade (@bg_color, 0.9);
> border-width: 1px;
> }
>
> .scale.trough.vertical {
> margin: 0 6px 0 5px;
> border-radius: 8px;
> background-image: none;
> background-color: shade (@bg_color, 0.9);
> border-width: 1px;
> }
>
> .scale.trough.vertical.highlight.bottom,
> .scale.trough.horizontal.highlight.left {
> background-color: alpha (@selected_bg_color, 0.6);
> }
>
> GtkScale {
> -GtkRange-slider-width: 14;
> -GtkRange-trough-border: 1;
> -GtkScale-slider-length: 14;
>
> border-style: solid;
> border-width: 1px;
> border-radius: 8px;
> }
>
> GtkScale.vertical {
> -GtkScale-slider-length: 14;
> }
>
> GtkScale.mark {
> border-color: shade (@bg_color, 0.8);
> }
>
> /*************
>  * scrollbar *
>  *************/
> .scrollbar {
> background-image: none;
> border-style: solid;
> -GtkRange-trough-border: 0;
> -GtkRange-arrow-scaling: 0.444;
> -GtkRange-slider-width: 13;
> -GtkRange-stepper-size: 0;
> -GtkScrollbar-min-slider-length: 30;
> -GtkRange-stepper-spacing: 0;
> -GtkRange-trough-under-steppers: 1;
> }
>
> .scrollbars-junction { /* the small square between scrollbars!!! */
> background-image: none;
> background-color: @bg_color;
> border-width: 0;
> border-radius: 0;
> border-image: none;
> }
>
> .scrollbar.trough,
> .scrollbar.trough.vertical {
> background-image: -gtk-gradient (linear, left top, right top,
> from (shade (@bg_color, 0.98)),
> to (shade (@bg_color, 1.06)));
> border-radius: 0;
> border-width: 0 0 0 1px;
> border-style: solid;
> border-color: shade (@bg_color, 0.94);
> }
>
> .scrollbar.trough.horizontal {
> background-image: -gtk-gradient (linear, left top, left bottom,
> from (shade (@bg_color, 0.98)),
> to (shade (@bg_color, 1.06)));
> border-radius: 0;
> border-width: 1px 0 0 0;
> border-style: solid;
> border-color: shade (@bg_color, 0.94);
> }
>
> /* Sliders and buttons */
> .scrollbar.slider.vertical {
> background-image: -gtk-gradient (linear, left top, right top,
> from (shade (@bg_color, 0.95)),
> to (shade (@bg_color, 0.8)));
> border-color: shade (@bg_color, 0.65);
> border-radius: 10px;
> border-width: 1px;
> }
>
> .scrollbar.slider.vertical:hover,
> .scrollbar.slider.vertical:hover:active {
> background-image: -gtk-gradient (linear, left top, right top,
> from (shade (@bg_color, 0.85)),
> to (shade (@bg_color, 0.7)));
> border-color: shade (@bg_color, 0.6);
> }
>
> .scrollbar.slider.horizontal {
> background-image: -gtk-gradient (linear, left top, left bottom,
> from (shade (@bg_color, 0.95)),
> to (shade (@bg_color, 0.8)));
> border-color: shade (@bg_color, 0.65);
> border-radius: 10px;
> border-width: 1px;
> }
>
> .scrollbar.slider.horizontal:hover,
> .scrollbar.slider.horizontal:hover:active {
> background-image: -gtk-gradient (linear, left top, left bottom,
> from (shade (@bg_color, 0.85)),
> to (shade (@bg_color, 0.7)));
> border-color: shade (@bg_color, 0.6);
> }
>
> .scrollbar.slider:insensitive {
> background-color: shade (@bg_color, 0.9);
> }
>
> .scrollbar.trough:insensitive {
> background-color: shade (@bg_color, 1.06);
> }
>
> /* Fixes a bug in Opera */
> .scrollbar.button {
> background-image: -gtk-gradient (linear, left top, left bottom,
> from (transparent),
> to (transparent));
> background-color: transparent;
> }
>
> /* overlay scrollbar */
> OsThumb {
> color: shade (@fg_color, 1.6);
> }
>
> OsThumb:selected,
> OsScrollbar:selected {
> background-color: @selected_bg_color;
> }
>
> OsThumb:active,
> OsScrollbar:active {
> background-color: shade (@bg_color, 0.6);
> }
>
> OsThumb:insensitive,
> OsScrollbar:insensitive {
> background-color: shade (@bg_color, 0.85);
> }
>
> /*******************
>  * scrolled window *
>  *******************/
> .ubuntu-online-accounts.frame,
> GtkScrolledWindow.frame {
> border-top-color: shade (@bg_color, 0.84);
> border-right-color: shade (@bg_color, 0.76);
> border-bottom-color: shade (@bg_color, 0.86);
> border-left-color: shade (@bg_color, 0.76);
> border-radius: 0;
> border-style: solid;
> }
>
> .ubuntu-online-accounts.frame {
> border-top-width: 0;
> }
>
>
>
> ////////////////////////////////////////////////////////////////////////////////
>
> a  tutorial   for  Css  in Gtk  3.4
>
>
>
> http://www.gtkforums.com/viewtopic.php?f=3&t=988&start=15
>
>
>
>
>
>
>
>
> 2013/2/13 Tomasz Jankowski <tomcioj gmail com>
> > Hello,
> >
> > How can I change color of focus line (e.g. displayed around GtkHScale
> > when it's selected)?
> >
> > Bye
> > _______________________________________________
> > gtk-app-devel-list mailing list
> > gtk-app-devel-list gnome org
> > https://mail.gnome.org/mailman/listinfo/gtk-app-devel-list