AI Configuration

Use this page to configure the AI aspects of the system

Page Geometry

With this build of the AI you can now configure the page geometry without editing html code.

The available options are to choose static or scrolling header and footer (independantly) and to adjust the space between the header and footer and main page content.

Static banner:
Gap below banner:
Static footer:
Gap above footer:

Do remember that the footer normally scrolls on small screens anyway.

Page Theme

Use this dropdown to change the colour theme: 

Make changes

You need to use the buttons below to display your changes on this page only.

View on this page
Use for all pages
Restore default

Current theme colours

w3-theme-l5 or
w3-theme-light
w3-theme-l4
w3-theme-l3
w3-theme-l2
w3-theme-l1
w3-theme
w3-theme-d1
w3-theme-d2
w3-theme-d3
w3-theme-d4
w3-theme-d5 or
w3-theme-dark
w3-theme-l5-bdr
w3-theme-l4-bdr
w3-theme-l3-bdr
w3-theme-l2-bdr
w3-theme-l1-bdr
w3-theme-bdr
w3-bottombar + w3-theme-l3-bdr

About themes

All thems have eleven (11) shade variations shown on the left.  You can hover over the first 11 blocks shown to see their hover combinations.

The lower 7 panels opposite show some of the 11 borders that are included.  There are light, theme and dark hover variations for individual borders and text elements.

Not all theme variations are used in the supplied Interface or default website; they are provided so that you can edit pages to suite your own taste.

Editing colours on pages

The blocks on the left show the css style format used on both the Interface and Default website.  To use just text or borders the style formats are:

  • w3-theme-l5-txt:  for text colours
  • w3-theme-l3-bdr:  for border colours, and/or
  • w3-theme-dark-txt-hvr or w3-theme-d5-bdr-hvr:  for hover over elements.

The 'l5', 'l3' and 'dark' above can be replaced with any of the theme shade codes except for border hover as only 'light (l5))', 'theme' and dark (d5)' are valid.

The last example in the panel opposite shows the use of the style w3-bottombar. There is also w3-topbar, w3-leftbar & w3-rightbar. To use any borders, you also need to apply the style 'w3-border'.