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.

Published by

Thomas Thurman

Mostly themes, triaging, and patch review.

10 thoughts on “CSS on window borders experimental layout language”

  1. 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. 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!

  3. 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.

  4. 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.

Comments are closed.

Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported.