S5 File Map

Pretty much everything you need outside of the slide file itself is found in the ui directory, which sits next to the slide file. That's where, if you dig into the default subdirectory, you find the various CSS files and JavaScript that makes S5 work.

The critical files in the ui/default directory are:

slides.js

The JavaScript that drives the dynamic side of the slide show. It automatically IDs the slides when the document loads, builds the navigation menu, handles the hiding and showing of slides, and so on. The script also manages the fallback to Opera Show if you're using Opera.

slides.css

This is really just a hub file that points to the three files that drive S5. Those files are:

s5-core.css

Contains a few rules that make the system run. If you mess with this file, you're likely to break the slide show unless you really know what you're doing.

framing.css

Contains some rules that place and size the various slide components—things like the header, footer, slide controls, and so on. If you want to change the basic slide layout, this is where to go.

pretty.css

The CSS that adds the visual pizazz to the slide show—colors, fonts, text alignment, margins, and all that other good stuff. You can make a whole new theme just by editing this file, and not touching the others.

opera.css

This file is what allows Opera Show to do its thing, assigning a few CSS rules that break the file up into slides. It should never have to be edited unless you go messing with the rules in s5-core.css (not recommended, but hey, it's your slide show).

outline.css

The styles that are applied when the slide show is in the outline view. These are largely meant to make the document a little bit more readable as an outline.

print.css

This is what makes the printer-friendly version work. There are a couple of rules at the beginning of the file you should be careful about changing, but otherwise, it's all up to you.

iepngfix.htc

A Microsoft behavior file which adds support for PNG alpha channels to IE/Win; this is called via style rules added via the JavaScript. This file is skipped over by all other browsers, which don't need hackery to honor PNG alpha channels.