What are the best practices for creating a course theme?
Note: Kindly follow the following set of guidelines to create a customized theme more effectively.
- Themes thumbnail canvas should be of width: 204px & height: 90px and named as "icon.png"
- All colours added in the themes should be validated for colour contrast ratio. We can use https://dequeuniversity.com/color-contrast/[https://webaim.org/resources/contrastchecker/]
- All colours and font families should be declared with CSS variables
- For the body section font family should be added under the CSS variable --th-body-font & for heading elements under the CSS variable --th-header-font
- Use rem/em/% as font units
- Use hexadecimal colour codes instead of using colour names to declare a colour value. E.g.: color: #ff0000 instead of color: red
- When using hexadecimal colour codes for the same repeated values, we can shorthand three characters instead of all six hexadecimal codes. E.g.: use #000 instead of #000000
- 0 units should not have any unit association. E.g.: correct 0, incorrect 0px
- Do not use 0 in front of a decimal pointer. E.g.: correct .8rem, incorrect 0.8rem
- Avoid using !important. !important should be opted for as the last option to overwrite some existing CSS properties