Closure of VOLA

Due to a power failure, Vale of Leven Academy is closing today at 2pm. Would all parents please be aware that pupils will be leaving school at 2pm and make the necessary arrangements.

Template fonts buttons etc.

Sample Alert

Information can be placed in a service alert, and then when picked for a page it is displayed across the top to get the attention of the user. With Link

Sub Heading

Page Intro: a short paragraph introducing the page, telling the user what follows. this page contains a mixture standard content elements so you can see what they look like.

Heading 2

Heading 3

Heading 4

A Paragraph of text, the content in a page starts with heading 2 in order to maintain the heading structure across the site.

Call to Action

A call to action is essentially a button, there are a number of choices, but in reality you wouldn't use more than two on any one page.

Default

Default Call to Action

used in most cases this is the default button on the site

Positive

Positive Action

used to reinforce an action with a positive outcome

Important

Important Action

actions that need to be done

Critical

Critical Action

actions that really need to be done now

Inline Actions

Actions can also be put inline within text or next to each other, it's not recommended that they are placed in text directly, but a number of actions on one line is sometimes needed.

Default Call to Action

Positive Action

Important Action

Critical Action

text can then follow the call to action though no one will read it.

Alerts

Information can be made to stand out within a block of text using alerts, this is not the same as a "service alert" across the top of a page, but a tool the editor can use to empathise text.

Information

Information Alerts might be used to highlight something that is good to know With Link

 

an alert can be used as a warning With Link

 

and danger can be signalled by an alert With Link

 

Tables

there are a number of table styles available, but the editor would need to edit the html to use them

table

standard table select class = table when creating the table via the editor.

Name Size Price Time
Fred Large £4.43 7:30pm
Dave Small £2.11 9:00am
Bill Medium 50p 18:00
Jayne x-small £6.45 10:00pm

table table-bordered

bordered table - Editor has to add table-bordered to class definitions via html.

Date Location
5th May West of the park
8th March In the Lake

Lists

Standard List

  • a standard list
  • of items
  • that make
  • a list
  • of items

A numbered list

  1. putting things in order
  2. like which thing
  3. should be done
  4. before another

Button

Info

Success

Warning

Conservative
Maurice Corry
SNP
Martin Docherty
Labour
Gemma Doyle
Liberal Democrat
Aileen Morton
Independent
Claire Muir

 

Coffee
- black hot drink
Milk
- white cold drink

 

Description lists
A description list is perfect for defining terms.
Euismod

Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.

Donec id elit non mi porta gravida at eget metus.

Malesuada porta
Etiam porta sem malesuada magna mollis euismod.
Truncated term is truncated
Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
Nesting
Nested definition list
Aenean posuere, tortor sed cursus feugiat, nunc augue blandit nunc.