Flying Fifteen: The origial Sport Boat
Search
  • Slide 1
  • Slide 2
  • Slide 3
  • Slide 4
  • Slide 5
  • Slide 6
  • Slide 7
  • Slide 8

Style guide

Style Guide - On this page are examples of styles and instructions how to implement them on the site. This page should be kept for reference, hidden from the menu and available to site editors. Any site wide changes to the template will be done via css styles and will reflect content on this page. The font colours, font family are turned off by default.

Text styles - all are set using the editor and pre-set styles that can be set via the editor

This is heading h1 set in the editor

This is heading h2 set in the editor

This is heading h3 set in the editor

This is heading h4 set in the editor

This is heading h5 set in the editor

Here is a paragraph of text with a text link to another page.

Examples of bold text, underined text . italic text and normal text.

Below is a bulleted list set in the editor

  • Nullam odio lorem, condimentumac scelerisque in, ultricies vitae ligula.
  • Aenean eget velit lacus. Nulla luctus risus eu mi malesuada mattis.
  • Sed tincidunt sapien eu lorem volutpat congue.
  • Praesent bibendum sagittis turpis, vitae gravida nulla porta sodales.

Below is an ordered list set in the editor

  1. Nullam in erat magna, posuere gravida urna.
  2. Sed sed lacus lorem, non luctus magna.
  3. Maecenas fringilla pulvinar nunc, mattis vestibulum enim pulvinar id.
  4. Pellentesque ultricies nunc eu arcu vehicula non lobortis velit ultrices. 

Paragraphs and spacing

Nullam in erat magna, posuere gravida urna. Sed sed lacus lorem, non luctus magna. Maecenas fringilla pulvinar nunc, mattis vestibulum enim pulvinar id. Pellentesque ultricies nunc eu arcu vehicula non lobortis velit ultrices. Nullam eget dolor purus. Nullam nunc elit, dapibus in varius nec, laoreet in velit.Nullam in erat magna, posuere gravida urna. Sed sed lacus lorem, non luctus magna.

Nullam in erat magna, posuere gravida urna. Sed sed lacus lorem, non luctus magna. Maecenas fringilla pulvinar nunc, mattis vestibulum enim pulvinar id. Pellentesque ultricies nunc eu arcu vehicula non lobortis velit ultrices. Nullam eget dolor purus. Nullam nunc elit, dapibus in varius nec, laoreet in velit. 

Maecenas fringilla pulvinar nunc, mattis vestibulum enim pulvinar id. Pellentesque ultricies nunc eu arcu vehicula non lobortis velit ultrices. Nullam eget dolor purus. Nullam nunc elit, dapibus in varius nec, laoreet in velit.

Buttons

To create the button please create the link and choose the "buttonDTM" style for the link --> in the link manager or directly in the editor

buttonDTM style link

Table styling - style set in the editor -> table properties -> style builder

Column heading1 in bold Column heading2 in bold Column heading3 in bold Column heading4 in bold
Cell content11 Cell content21 Cell content31 Cell content41
Cell content12 Cell content22 Cell content32 Cell content42
Cell content13 Cell content23 Cell content33 Cell content43
Cell content14 Cell content24 Cell content34 Cell content44

The side subnavigation is added using DDR menu module, set the style to sitemap and node +0. This adds subpages of the current parent page.

The easiest way of implementing the module is to add DDR menu module to the page and import content from template folders, the default template file to use is sidemenu.xml

 

Containers and modules

Default available containers are:

DTM7 transparent - with no borders or headings, allows to add any content.
DTM7 with title - container without borders including a module title in h2

Content below - html module with transparent container, image set to scale on all devices by adding "scaleimage" class in the editor

 

 

Content below - html module with title container and link button.

Responsive Web Design

Responsive web design is an approach to web design in which a site is crafted to provide an optimal viewing experience easy reading and navigation with a minimum of resizing, panning, and scrolling across a wide range of devices.

Learn more

 

Content - html module with h3 heading and list style set to footerlinks

Useful Links

Useful Links

x

Cookie Compliancy

We use cookies on our website to ensure that we give you the best possible user experience.

If you continue without changing your settings, we'll assume that you are happy to receive all cookies. Click the button below to disable them.

Cookies enable us to identify the device you are using or when you are logged in. We use cookies that are strictly necessary to enable you to use the website, to provide certain basic functionality and to collect analytical data about the use of our website.

Disable Cookies
Read more...
Read less...
C