[Sugar-devel] [PATCH sugar-artwork] GTK+3 port

Benjamin Berg benzea at sugarlabs.org
Sun Jan 8 15:20:00 EST 2012


Hello,

OK, the patch looks acceptable to me. It is ugly in places and there are
some comments that may not be quite accurate anymore (mostly my fault
and just copied from the GTK+ 2 theme).

However, fixing this is not trivial, and likely requires digging into
GTK+ code, and figuring out whether the information is still correct.

Benjamin

On Thu, 2011-12-22 at 14:29 -0300, Manuel Quiñones wrote:
> Work done by Benjamin Berg, Simon Schampijer,
> Daniel Drake, Manuel Quiñones and Gonzalo Odiard
> 
> Signed-off-by: Manuel Quiñones <manuq at laptop.org>
> ---
> [SNIP]
> diff --git a/gtk3/theme/gtk-widgets.css.em b/gtk3/theme/gtk-widgets.css.em
> new file mode 100644
> index 0000000..ca75450
> --- /dev/null
> +++ b/gtk3/theme/gtk-widgets.css.em
> @@ -0,0 +1,556 @@
> [SNIP]
> +# Radio size used to be:
> +#
> +# radio_size = my_floor(subcell_size + bullet_size + line_width)
> +#
> +# But a screenshot shows that the graphic was actually rendered at 26px
> +# so the SVG displays at the correct size.
> +radio_size = 26

Hm, fine with me. However it looks like it will be the same size in both
the small and large theme. Is there a good reason, or is the size simply
acceptable in both?

> +scale_slider_width = my_floor(2 * subcell_size + line_width)
> +thickness = my_ceil(line_width)
> +
> +icon_small = icon_base * 3
> +icon_large = icon_base * 5
> +
[SNIP]
> +/* Spin buttons */
> +
> +.spinbutton {
> +    ${ spin_ythickness = my_ceil(3*subcell_size - font_height) }
> +    ${ spin_xthickness = subcell_size }
> +    ${ spin_btn_ythickness = spin_ythickness }
> +    ${ spin_btn_xthickness = subcell_size * 2 }
> +
> +    /* small inner border and a lage x/ythickness for entries
> +       to reduce the number of hacks needed :-) */
> +    # FIXME this is setting the wrong padding

Does GTK+ allow # for comments? Not that this style does anything
anways ...

> +    /* padding: $(spin_xthickness)px $(spin_ythickness)px; */
> +}
> +
> +.spinbutton.button,
> +.spinbutton.button:focused,
> +.spinbutton.button:active {
> +    padding: $(spin_ythickness)px $(spin_xthickness)px;
> +    border-color: @button_grey;
> +    border-width: $(thickness)px;
> +    background-color: @button_grey;
> +    color: @white;
> +}

[SNIP]

> diff --git a/gtk3/theme/gtk.css b/gtk3/theme/gtk.css
> new file mode 100644
> index 0000000..0c51959
> --- /dev/null
> +++ b/gtk3/theme/gtk.css
> @@ -0,0 +1,121 @@
> +
> +/* Sugar colors */
> + at define-color black #000000;
> + at define-color toolbar_grey #282828;
> + at define-color button_grey /*#ff0000*/ #808080 ;
> + at define-color selection_grey #A6A6A6;
> + at define-color panel_grey #C0C0C0;
> + at define-color text_field_grey #E5E5E5;
> + at define-color white #FFFFFF;
> +
> +/* Default color scheme */
> + at define-color base_color #ffffff;
[SNIP]
> +
> +/* Colormap actually used by the theme, to be overridden in other css files */
> + at define-color theme_base_color @base_color;

All the @define-color blocks except the sugar colors can probably be
just dropped. We only use @theme_base_color, which needs to be defined
of course (or it can be replaced with @white).

[SNIP]
> +
> + at import url("gtk-widgets.css");
> +
> diff --git a/gtk3/theme/settings.ini.em b/gtk3/theme/settings.ini.em
> new file mode 100644
> index 0000000..f4d6369
> --- /dev/null
> +++ b/gtk3/theme/settings.ini.em
> @@ -0,0 +1,36 @@
[SNIP]
> +[Settings]
> +#gtk-color-scheme = "base_color:#ffffff\nbg_color:#ededed\ntooltip_bg_color:#343434\nselected_bg_color:#4a90d9\ntext_color:#2e3436\nfg_color:#2e3436;\ntooltip_fg_color:#ffffff\nselected_fg_color:#ffffff"

We can just remove the color scheme line. I do not think it is required
(and contains adwaita colors).

> +gtk-auto-mnemonics = 1
> +gtk-toolbar-style = GTK_TOOLBAR_ICONS
[SNIP]



More information about the Sugar-devel mailing list