Caucus 4.6 and CSS
Last revised: 20 September 2004

I. Introduction
Caucus 4.6 begins to make use of CSS, "Cascading Style Sheets", to improve Caucus' "look and feel" and customizing capabilities.  This is just a beginning, there is lots more to follow.

This document describes, respectively, what individual users can do, what Caucus managers can do, and the overall model of how CSS works with Caucus.

II. Individual User Capabilities
Each individual Caucus user has control over the fonts and font sizes that they see -- regardless of which fonts or font sizes the site designer or Caucus manager has chosen. 

To change your preferred font or font size, click on your name in Caucus, and scroll down to the bottom.  Look for the "font-family" and "font-size" fields.  You can enter a font name (such as "Times", "Arial", "Geneva", etc) or a font size (such as "100%" or "12pt"), and click on "Change My Settings".  The font or size you pick will override any other settings.

III. Manager capabilities
From the manager "Modify the (interface name) interface look and feel" choice, a Caucus manager can control the formatting of the Caucus pages in three ways:

  1. Custom CSS file.  Each interface may have its own CSS file, to provide a unique look and feel.  In this box, enter (just) the name of the file, such as "localCC44.css".  These files, if created by the local system administrator, must be located in the public_html directory under the Caucus home directory.

  2. Font-family.  Specify the list of font names to be used, in order, just as you would in a CSS font-family selector.  The default is "Arial, Helvetica, sans-serif".  (If you empty this field, and font-families have not been specified in any of the local Caucus CSS files, then the final font selection will be up to the user's browser.)

  3. Font-size.  Specify the font size, just as you would in a CSS font-size selector.  The default is "80%".  (If you empty this field, and the font-size has not been specified in any of the local Caucus CSS files, then the final size will be up to the user's browser.)

IV. How It All Works
Caucus uses the "cascading" part of CSS to combine up to 6 levels of CSS styling.  Here follows the precise order, where #6 is the last (and thus most final or overriding) set of style rules:

  1. CML-written rules.  Certain rules, notably those that vary (badly) between different browsers, are written by CML code into each page, so that Caucus can "correct" the rule based on the browser type.  Currently this is (only) the definition of the "indented" class, which handles left-indented text.

  2. caucus.css.  The standard out-of-the-box set of Caucus style rules.  This file should never be modified.

  3. local.css.  Local, custom, modifications to rules from caucus.css (located in ~/public_html).  If you need to change any style rules across your Caucus site, place them in this file.  This will ensure that your custom rules will not be lost when Caucus is upgraded.

  4. Interface-specific .css file(s).  Each Caucus interface may also have its own rules, which override anything specified in caucus.css or local.css.  It is recommended that these files incorporate the interface name, e.g. "localCC44.css" could be the local set of rules for the CC44 interface.  These files must also be located in ~/public_html, and are selected by the Caucus manager in III.1 above.

  5. Interface Settings.  The font-family and font-size for all pages in an interface (specifically, for selectors BODY and TD) may be set by a Caucus manager (III.2 & .3 above).  These settings override any settings from the previous .css files.

  6. User Settings.  The font-family and font-size for all pages (specifically, for selectors BODY and TD) may be set by each Caucus user (see II above).  These settings override any previous settings.

V. Notes on general style rules

  1. Font-families.  For Caucus 4.6, the default font-family is "Arial, Helvetica, sans-serif".  This set of fonts render better, and look more "professional", than the default Times fonts that appear on most browsers.

  2. Font size.  Similarly, the default font-size is "80%".  This seems to work well across most browsers.

    Note -- if you need to specify different font sizes, try to use "%" values, rather than specific point sizes.  The actual size of point values varies wildly from browser to browser (compare in particular, Windows/IE6 with Mac/Safari), whereas relative "%" sizes tend to scale better across different browsers and user settings.

    In general, it's best not to specify font sizes at all in the local.css or interface-specific .css files -- let this be controlled by the Caucus manager, or the individual user.  If you really need larger or smaller font sizes for certain specific classes, then use the "%" sizes just within those class definitions.

  3. Links.  The default link style is to "blue" all links (visited or not), but not to underline them.  Instead, the links appear underlined only when the user "hovers" over them with the mouse pointer.  This seems to improve overall readability, while still making it clear what is and is not a link.

VI. Notes on specific classes
(Work underway.  Will describe the specific classes that have been implemented and used already -- mostly for the gradebook and assignment sheet features of the "course conference". But hopefully some new classes for conf home page and viewitem.cml, as well.)