Seagull

Template

Page updated:

Single Column

A single column is still a flex-box

Title

Tagline

Content

Title

Tagline

Content

Highlighted Title

Content

Highlighted Title

Content

Two Column Layout - flexible

class - 'ax-column2'

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Two column layout - fixed

class - 'ax-column2 ax-fixedwidth'

Title

Fixed width

Content

Title

Fixed width

Content

Title

Fixed width

Content

Three Column Layouts - flexible

class - 'ax-column3'

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Three Column Layouts - fixed

class - 'ax-column3 ax-fixedwidth'

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Title

class - ax-growX2

Content

Four Column Layouts - flexible

class - 'ax-column4'

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Four Column Layouts - fixed

class - 'ax-column4 ax-fixedwidth'

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Title

class - ax-growX3

Content

Five Column Layouts - flexible

class - 'ax-column5'

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Five Column Layouts - fixed

class - 'ax-column5 ax-fixedwidth'

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Title

Tagline

Content

Title

class - ax-growX2

Content

Title

class - ax-growX3

Content

Title

Tagline

Content

Title

class - ax-growX4

Content

Title

class - 'ax-growX2'

Content

Title

Tagline

Content

Title

class - ax-growX2

Content

Gradients

Four gradients are provided - shown right. These can be modified by editing the apropriate theme file.

class
ax-gradient-up

class
ax-gradient-down

class
ax-gradient-left

class
ax-gradient-right

7 Columns
7 Columns
7 Columns
7 Columns
7 Columns
7 Columns
7 Columns
7 Columns
7 Columns
7 Columns

Rows of data

When displaying rows of data it is convenient to enable hover features to highlight individual rows.  this can be achived by using the class 'ax-dataBar' for each row of data as shown in the card on the right

Hover highlights

ax-theme2

data

ax-theme2

data

Normal text. The above 'ax-dataBar' lines show how data rows are highlighred.

Title

Some text

Some more text

Powered by Cumulus MX