Picture of Henrik Aabom
Re: Adding new theme to Authoring Tool
by Henrik Aabom - Thursday, 21 January 2021, 7:14 AM
 

Hi Jason Wilson

When we create a new theme, we follow these steps. Maybe they can be of help to you :)

Adapt Theme - setup

How to setup a new theme from the adapt-contrib-vanilla theme bundled with Adapt 5+ framework.
https://github.com/adaptlearning/adapt-contrib-vanilla

bower.json

These settings needs to be changed:

  • name (ex: “company-theme”)
  • version (ex: “0.0.1”)
  • homepage (ex: “http://www.company.com”)
  • issues (ex: “http://www.company.com”)
  • theme (ex:  companytheme”)
  • displayName (ex: “Company Theme”)
  • description (ex: “This is a theme for Company.”)
  • targetAttribute (ex: “_companytheme”)

When changing “targetAttribute”, remember to switch out all occurrences of “_vanilla” inside the properties.schema file, with what is present in the “targetAttribute” property (ex: “_companytheme”).

theme.js

Inside this file \js\theme.js, remember to switch out all occurrences of “_vanilla”, with what is present in the “targetAttribute” property of the bower.json (ex: “_companytheme”). As of this writing only one occurrence exists, here:

var theme = model.get('_vanilla');

properties.schema

Remember to switch out all occurrences of “_vanilla”, with what is present in the “targetAttribute” property of the bower.json.
For instance:

"contentobject": { "type": "object", "properties": { "_vanilla": { ... } } }

In here it is possible to set all preset colors like this (hex colors only):

"font-color": { "title": "Font colour", "type": "string", "inputType": "ColourPicker", "default": "#CD5C5C", "help": "Global body font colour" },

If no default color is desired, set default property to an empty string: “”.

Picture of Jason Wilson
Re: Adding new theme to Authoring Tool
by Jason Wilson - Friday, 26 February 2021, 3:07 AM
 

Hi Henrik, I just realised I hadn't thanked you for your comments - they've been very helpful, so thanks!