Totara Talent Experience Platform Open Discussions

Overwriting CSS values in custome theme

Welcome to this forum!

Hi All,

I created custome theme based on instructions here:
https://help.totaralearning.com/display/DEV/Creating+custom+themes

I am unable to overwrite any of the default theme settings - I'd like to set up my own default colors.

In my local totara I have those folders created:

/server/theme/mytheme

/client/component/theme_mytheme

in theme_mytheme i have:

global_styles/_variables.scss - and here I added:

:root {

    //
    // Theme colours
    //
    // Default state colour, shows an element is interactive
    /* theme:var */
    --color-state: #ffcc00;
}

After purging caches, theme still shows default values from Ventura instead from mytheme.

Is it something more I should do?

Thanks

Olek

Permalink | Reply

On the client side you use the TUI-framework (totara user interface) which depends on a build process for changes to take effect. Please find further information here: https://help.totaralearning.com/display/DEV/Tui+front-end+framework

I'm not sure you can override variables on the server side, but if you want to try it.

Create a custom.css in /server/theme/mytheme/style/ and include the css in your theme config ../theme/mytheme/config.php with

```

$THEME->sheets = ['custom'];

```

Permalink | Show parent | Reply