• Diff for "Design/Theming"

Notes for a local version of Sugar-100 theme called sugar-100-siri as reference to Siri's theme corrections when running the theme in an XFCE environment.

Problem

Visual inconsistency: The Sugar theme is designed using the Gtk toolkit, and some applications use the standards offered by the Qt toolkit.

Strategies

• Other XFCE-themes must have had this problem! Choose one for reference
  • and adapt their changes to the Sugar theme. Huayruru has sugarbased xfce-themes.
• Map visual flaws and report them as bugs to the Sugar Theme team:
  • Jonas Smedegaard and myself.

Visual Design

• Flat design
• High Contrast icon theme as fallback (not Adwaita), similar in expression
• Strong colors in addition to black and grey theme

Structure

/gtk-2 (toolkit)

• gtkrc

/gtk-3

• gtk.css gtk-widgets.css settings.ini

/xfwm4

• themerc

Window manager icons (in (png and) xmp format).

close (cross, no toggle variant (dialog-cancel.svg)) maximize (window(s) or window with arrows (view-fullscreen.svg)) hide (underscore, no toggle variant (look at Piranha theme (circles))) menu (arrow down (go-down.svg)) shade (arrow up, toggled down (go-up.svg)) ?stick? (circle (view-radial.svg)

variations: -active (white icon, shade 5 background) -inactive(white icon, pale background) -pressed (shade 5 icon, white background) -toggled-active -toggled-inactive -toggled-pressed

white/ shade 1 shade 2 shade 3 shade 4 black/ full color/ shade 5

Themes correspond with their iconset in usr/share/icons/

Content of icon theme sugar.orig

/cursors

/scalable

• /actions /apps /categories /control /device /emblems /mimetypes /status

icon-theme.cache index.theme

Noted flaws

with Sugar theme and Sugar icons.

• Sugar does not fully cover the xdg-standard for iconsets.
  • Icon fallbacks in Thunar (desktop, filesystem, trashcan, folder, network), Icedove (get messages, write, chat, address book, tag, decrypt - search, filter and dropdown menu arrows are 'sugary') and

    Iceweasel menus. Inheritance set to ?HighContrast in icons.theme

• Frames and icons in content of websites too radical (look for plugin)
• FIXED: Icedove: Selected color white and Icedove inverted active text color
  • white in text 'button' when opening submenu (background doesn't change to grey) Grey background clash with Icedove address text color grey when sending mail (text grey when Qt 4 GUI Gtk+ is active, otherwise black) Evince: White text and background in file selection window Connection manager: White text and light grey backgrounds in manage connection selection menu xfwm4-settings: Combobox prelight background and foreground color both white.
• Tickbox and text overlap in submenus (Icedove, Iceweasel, Scribus)
  • (not in Appearence)
• Tab menus don't fit with Sugar's circled indication of selection
  • (change bg color) (Appearence, Scribus, content of Thunar ind icon set view) (not or disappearing in seconds with Qt GUI set to Gtk+)
• Inkscape export combobox text fiels is too small to contain more than one
  • digit
• No sugar style for window manager
• Evince and gtk-demo has its own "window manager" toolbar, following the
  • gnome standards.
• Cursor set is big and clumsy and only show inside borders of certain
  • windows (Iceweasel (gtk-2.0), not Thunar (gtk-2.0))
• Libreoffice: Grey squared background shows behind rounded text fields.
  • Spelling icons don't match with black background. Prelight fg and bg are both white in dialog boxes.
• Composit windows (necessary to shadow windows) makes selection in terminal
  • mode white out, when windows are layered.

Notes

• Gtk theme needs to be in usr/share/themes for xfwm4 to recognize it
• Gtk-2 control styling by gtkrc-file
• Gtk-3 control styling by css-files
• Window frames has xfwm4 icons and shape in bitmaps (png and xpm).
  • Xpm is necessary - allocates the space. Theme and typography is set in 'Window management'. Theme needs settings in themerc.

• 'Qt 4 settings' -> select gtk+ (test)

• Touchscreens work with Metacity
• Evince already has a kind of window manager with perfectly usable icons
  • (Adwaita symbolic) - with the Gnome stadard (or maybe not?).
• Cursor theme has cursor.theme file (where?)
• Background image can be placed anywhere and must be chosen in the desktop
  • manager widget. (What is the preferred location?)
• Splash screen in usr/share/images/desktop-base (symlink to desktop-splash)
  • Size something like 1920 x 1200 px

Decisions

• Sugar theme look here: Thunar, panels, window frames
• Should the theme interfere in app design in Iceweasel, Icedove etc.?

Tasks

• DONE via theme.index Inheritance: Create symlinks from High Contrast icon theme
• (NONE FOUND) Test if programs crash when using Gtk+ theme in Qt programs.
• Identify possible sources to flaws
• Look for Iceweasel plugin to manage fallback in content of websites
• DONE Distribution logo in upper left corner in icons /apps/xfce4-panel-menu.svg
  • and in index.theme directories list (lookup directory). Scalable preferred.
• DONE Find, choose, copy and modify bitmaps and themerc settings from window
  • theme with similar features (Murrinableu (pointy) or Gaudy (rounded))
• DONE Create bitmap icons for window manager
• Write bug reports
• Create splash screen and place it correctly
• Create desktop image and place it correctly
• Create alpha package for Debian
• Report theme changes in git
• Create colored theme variation

Applications vs widget engines

Gtk based applications

darktable inkscape pqiv rawtherapee synfig studio ufraw icedove iceweasel galculator gajim ario pdf-shuffler xournal xscreensaver thunar libreoffice

Qt based applications

scribus qutecom

xlib

Imagemagic ssh-askpass

tk

imagemagick

x11

mypaint sxiv pidgin gimp

ncurses

openssh-client ispell mpv

spl

mpv

athena

x11