Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Migrated to Confluence 5.3
Include Page
Styles for FSS examples
Styles for FSS examples
Section
Column
Include Page
Infusion13:FSS text examples navigationInfusion13:
FSS text examples navigation
Include Page
Infusion13:FSS Links PanelInfusion13:
FSS Links Panel
h2. Colours Note that there are many other colours available. See the [FSS Cheat Sheet] for specifics. {html} <div class="demo-text-colours"> <p class="fl-text-aqua">This paragraph is "aqua" coloured.</p> <p class="fl-text-fuchsia">This paragraph is "fuchsia" coloured.</p> <p class="fl-text-olive">This paragraph is "olive" coloured.</p> <p class="fl-text-teal">This paragraph is "teal" coloured.</p> <p class="fl-text-yellow">This paragraph is "yellow" coloured.</p> </div> {html} The markup and classes used to produce this example: {code:html}

Colours

Note that there are many other colours available. See the FSS Cheat Sheet for specifics.

The markup and classes used to produce this example:

Column
Wiki Markup
Code Block
html
html
<p class="fl-text-aqua">This paragraph is "aqua" coloured.</p>
<p class="fl-text-fuchsia">This paragraph is "fuchsia" coloured.</p>
<p class="fl-text-olive">This paragraph is "olive" coloured.</p>
<p class="fl-text-teal">This paragraph is "teal" coloured.</p>
<p class="fl-text-yellow">This paragraph is "yellow" coloured.</p>
{code}

NOTE:

The

{{

fl-text-

\

*

}}

classes

are

applied

to

the

paragraph

tags

and

so

apply

only

that

paragraph.

The

class

could

be

applied

to

a

{{

<div>

}}

surrounding

many

paragraphs

to

apply

the

style

to

all

paragraphs.

h2.

Highlight

Colours {html} <div class="demo-text-colours"> <p class="fl-highlight-yellow">This paragraph has "yellow" highlight.</p> <p class="fl-highlight-green">This paragraph has "green" highlight.</p> <p class="fl-highlight-blue">This paragraph has "blue" highlight.</p> </div> {html} The markup and classes used to produce this example: {code:html}

Colours

The markup and classes used to produce this example:

Code Block
html
html
<p class="fl-highlight-yellow">This paragraph has "yellow" highlight.</p>
<p class="fl-highlight-green">This paragraph has "green" highlight.</p>
<p class="fl-highlight-blue">This paragraph has "blue" highlight.</p>
{code}

NOTE:

The

{{

fl-highlight-

\

*

}}

classes

are

applied

to

the

paragraph

tags

and

so

apply

only

that

paragraph.

The

class

could

be

applied

to

a

{{

<div>

}}

surrounding

many

paragraphs

to

apply

the

style

to

all

paragraphs.