Theme

Learn more about ‘Theme‘

Administration Theme

Steps

Colours

1. Navigate to the ‘Administration’ (Cog) located in the ‘Workbar’
   

   Administration cog

2. On the ‘Left Hand Side’ (LHS) select the ‘Theme’ tab
3. You will be relocated to the ‘Theme’ admin menu
4. Under the ‘Colour Scheme’ heading select the dropdown
   

   Colour scheme

5. Here you can select any existing themes that you have
1. Note: ‘Default’ will display if you have no current existing themes
6. Below this is the ‘Configure this Colour Scheme’ section
7. Input the name of this ‘Colour Scheme’
8. Followed by all of the chosen ‘Colours’ and ‘Colour Codes’ for each area on your ‘Intranet’
9. Alternatively you can import your ‘Colour Settings’ via a ‘JSON’ file
10. Select ‘Save’
1. OR
11. Select ‘Export Styles’

Styles

1. Select the ‘Styles’ tab
2. Select your chosen ‘Elevation’ in density-independent pixels  and your chosen ‘Border’ radius
   

   Styles – elevation

3. Select your chosen ‘Icon’ from the options in the dropdown
4. Select ‘Save’

Logos

1. Select the ‘Logos’ tab
2. Under the ‘Workbar’ heading select and upload the chosen image you want to be in the ‘Workbar’
   

   Logo- dropdown

1. Note: The file must be constrained to a maximum of 205 x 75 pixels
3. Under the ‘Login Screen’ heading select and upload the chosen image you would like to appear
4. Under the ‘Favicon’ heading select and upload the chosen image you would like to appear
1. Note: We recommend an image of 32 X 32 px.

Widgets

1. Select the ‘Widgets’ tab
2. Under the ‘Widgets Title Border’ select the checkbox to:
1. ‘Set the colour of the top border of the pane title’
2. ‘Set the colour of the bottom border of the pane title’
3. Under ‘Widget Title Font’ set the:
1. ‘Font Weight’
2. ‘Font colour’
4.  Under the ‘Card Elevation & Border Radius’ set the:
1. ‘Elevation’
2. ‘Border-radius’
5. Select ‘Export Styles’ if you would like to export your style for ‘Widgets’
6. Alternatively import your widget styles under the ‘Widget styles import’ heading
7. Select ‘Save’

Footer

1. Navigate to the ‘Administration’ (Cog) located in the ‘Workbar’
2. On the ‘Left Hand Side’ (LHS) select the ‘Theme’ tab dropdown
3. Then Select ‘Footer’
4. You will be redirected to the ‘Footer’ theme admin page
5. Under the ‘Design & Layout’ heading select the ‘Add Footer’ button
6. Here you will be redirected to the ‘Footer’ design screen
7. Create the footer design of your choice
8. Select ‘Save’
9. To configure the background colour of the ‘Footer’ follow the steps under the ‘Colour’ heading further up
10. For ‘Visibility’ of the ‘Footer’ select the checkbox of whether or not to ‘Hide Footer’
11. Select ‘Save’

Font face 

1. Navigate to the ‘Administration’ (Cog) located in the ‘Workbar’
2. On the ‘Left Hand Side’ (LHS) select the ‘Theme’ tab dropdown
3. Then Select ‘Font face’
4. Here you will be redirected to the ‘Font Face’ screen 
5. Under the ‘Font Face Files’ heading in the table input:
1. ‘CSS Font Family’
2. ‘Font Style’
3. ‘Font Weight’
6. ‘Add file’ of the particular ‘Font Type’ of your choosing
1. Note: supported files are:
1. Embedded Open Type (EOT) font file
2. True Type File (TTF) font file
3. Web-Only Font Format (WOFF) font file
4. Scalable Vector Graphics (SVG) font file
7. Use the two ‘drag lines’ on the LHS to reorder the items
8. Select ‘Add another item’ in order to add another another item to your table 
9. Select the ‘Delete’ button in the top right of the ‘Item’ in order to remove it
10. Select ‘Show order’ to view the order of the ‘Items’ in the table
11. Select ‘Save’

Phone Apps 

1. Navigate to the ‘Administration’ (Cog) located in the ‘Workbar’
2. On the ‘Left Hand Side’ (LHS) select the ‘Theme’ tab dropdown
3. Then Select ‘Phone Apps’
4. You will be presented with the ‘PWA’ app admin screen
5. Select and upload your ‘Image’ for:
1. ‘Large Size Logo’
1. 512 X 512 px
2. ‘Medium Size Logo’
1. 192 X 192 px
3. ‘Small Size Logo’
1. 144 X 144 px
4. ‘SVG Logo’

1. Select the ‘IOS App’ tab
2.  Select and upload your image for the ‘Logo’
1. 205 X 75 px
3. Select the colour scheme from the ‘Dropdown’ under the ‘Colour Scheme’ heading
1. OR
4. Create a new ‘Colour Scheme’ and add a ‘Name’
5. Add your chosen colour scheme for each section
6. Select ‘Save’