CSS on window borders experimental layout language

cowbellI’m happy to announce the first experimental version of Metacity with support for CSS window borders (“Cowbell”).  This work was largely supported by Collabora Ltd.

You can:

This diagram should explain everything, perhaps.

I would especially like to hear from:

  • theme artists, to let me know whether it’s adequately powerful;
  • anyone else interested in hacking on this with me;
  • the GTK client-side decoration people, so that we can harmonise the way we represent things;
  • people who know a lot about CSS and can offer insights into the suitability of the way we represent things;
  • people who know a lot about the Dublin Core and can offer insights into whether our metadata system uses it appropriately;
  • maintainers of other window managers (especially Mutter), so we can talk about including CSS support in other window managers;
  • everyone else, to suggest which of the directions for future development are most interesting.

I think it may perhaps be helpful to set up a Cowbell mailing list, so that we can compare notes on implementations.  For example, I haven’t written down anywhere how to place an image to the right of the title, which is commonly needed (you use border-image).

Photo © Craft*ology, cc-by-nc.


  1. Posted October 29, 2009 at 11:02 pm | Permalink

    To compile on OpenSUSE 11.1:-

    # Repo for libccss
    sudo zypper ar http://download.opensuse.org/repositories/Moblin://Factory/openSUSE_11.1/Moblin:Factory.repo

    # Install required devel packages
    sudo zypper in gtk2-devel gconf2-devel ccss ccss-devel libcanberra-devel librsvg-devel libsoup-devel gnome-doc-utils-devel startup-notification-devel

    ./configure –prefix=/usr && make && sudo make install

    The docs (section 2.2) says:- “Copy the contents of the src/themes/Sunshine directory to ~/.themes/Sunshine/cowbell/”

    However, this seems to be missing from the tarball.

    Thanks for your work!

  2. Posted October 29, 2009 at 11:36 pm | Permalink


    Hmm, I do feel rather stupid for having missed that out of the tarball somehow; I’ve made it available as a separate download.


    I’ll post about it separately.

  3. Screwtape
    Posted November 3, 2009 at 12:31 pm | Permalink

    I wanted to comment on the Cowbell docs, but the results are a little too large for this little blog comment so I’ve put them online here:


    Basically, as one who has done a little theming and a little CSS, I went through the docs section by section and noted down anything I found surprising or awkward-looking.

    Hope this helps!

  4. Posted November 3, 2009 at 4:44 pm | Permalink

    In response to Screwtape:-

    Section 3.3

    I would clamp the maximum button-height to the height of the title bar. This would allow for vista-style buttons which are top-aligned but do not extend to the bottom of the title bar.

  5. Screwtape
    Posted November 3, 2009 at 9:57 pm | Permalink

    With the current theme format, if you want some particular effect like top-aligned buttons, since you can’t change the height of buttons you just leave them at full-height and only draw the ‘button’ shape on the top half.

    Also, now that I think of it, perhaps having 1em be the width that makes square buttons is *not* the best idea – the height of the title area will be the height of the title text plus any line-height and padding on the title-text, so setting the button-width to 1em would likely make for slightly portrait-shaped buttons.

5 Trackbacks

  1. By The Sunshine theme – …for the adult in you on October 29, 2009 at 11:53 pm

    […] …for the adult in you “Many window managers are like Marshmallow Froot Loops; Metacity is like Cheerios.” Skip to content « CSS on window borders experimental layout language […]

  2. By This Week In Metacity « ᛏᚦ on January 22, 2010 at 8:12 pm

    […] have been supporting me in working on Metacity over the last week or so.  I began by trying to get the CSS themes branch merged, but then decided that a better use of my time would be patch review, especially given the […]

  3. By Themes roundup – …for the adult in you on February 5, 2010 at 10:54 pm

    […] state of Cowbell. Speaking of universal theme formats, Cowbell is an attempt to allow theming using CSS rather than Metacity’s own rather recondite theme […]

  4. By Welcome - CSS on window borders on February 12, 2010 at 7:59 pm

    […] the first phase, a basic version was built and demonstrated.  This work was supported by Collabora Ltd.  You can still read the documentation for building […]

  5. […] is what the first draft of Cowbell […]