InfoFacts: Spotlight
Lots of things to say
Spotlight was designed to be small round points of information that your page can use as a single UL or multiple UL's against a background. Since they are sized to be small you want to limit the data to a small chunk of data with each having a hover effect.
OmniUpdate users just place a single bulleted list with the top being a piece of data and a second / bottom bullet being description about that data. You can use multiple UL's in an editable zone and each will have additional margins to offset each spotlight from one another.
All UL's in the editable zone will be styled like this.
Code Example:
<ul>
<li> Data</li>
<li>Why this is important</li>
</ul>
CSS Style
infofacts_ spotlight _univBlue
- 100%
- what we try to give each day
CSS Style
infofacts_ spotlight _medBlue
- 100%
- what we try to give each day
CSS Style
infofacts_ spotlight _lightBlue
- 100%
- what we try to give each day
CSS STYLE
infofacts_ spotlight _gray
- 100%
- what we try to give each day
CSS STYLE
infofacts_ spotlight _orange
- 100%
- what we try to give each day
CSS STYLE
infofacts_ spotlight _beige
- 100%
- what we try to give each day
CSS STYLE
infofacts_ spotlight _black
- 100%
- what we try to give each day
CSS STYLE
infofacts_ spotlight _white
- 100%
- what we try to give each day
CSS Style
infofacts_ spotlight _gradient
- 100%
- what we try to give each day
Expanded Example:
infofacts_spotlight_univBlue
with custom background image.
- 100%
- what we try to give each day
- 100%
- what we try to give each day
- 100%
- what we try to give each day
- 100%
- what we try to give each day
- 100%
- what we try to give each day
- 100%
- what we try to give each day
- 100%
- what we try to give each day
- 100%
- what we try to give each day
- 100%
- what we try to give each day