This forum has moved to a new location and is in read-only mode. Please visit talk.octobercms.com to access the new location.

phplee
phplee

is there a way to use the theme form variables on my scss theme. for example the link-colour to my theme.scss and want to link it to my theme form field. i know you can do this using LESS. but not sure if its supported for SCSS.

for example this won't work in my SCSS file

 a { color: @link-color }
JeffGoldblum
JeffGoldblum

How have you setup your fields in your theme settings? See https://octobercms.com/docs/themes/development#combiner-vars

phplee
phplee

Thanks, I've done that already.

 design_brand_primary:
            label: Primary Brand Colour
            type: colorpicker
            assetVar: 'brand-primary'
            tab: Design Settings

if i set this in my theme.scss like so

 $brand-primary: @brand-primary;

i get an error in the browser.

 Did not parse stylesheet because non CSS MIME types are not allowed in strict mode.

wasn't sure you can use it with scss

Last updated

coycash12497
coycash12497

I also am trying to use 'assetVar' but am limited to SASS. Thanks

phplee
phplee

Does anyone have an update for this?

thanks

info17589
info17589

In SCSS use the $brand-primary variable and it works.

Responsive
Responsive

@info17589 - Did you manage to pass assetVars to your SCSS with $brand-primary? I have tried this and get a 'variable not defined error'. Have you defined this variable anywhere else accept fields.yaml?

Cheers,

info17589
info17589

@cy35954 For me it works. Use the assetVar: 'brand-primary' in the fields.yaml and the $brand-primary in the scss file.

Responsive
Responsive

info17589 said:

@cy35954 For me it works. Use the assetVar: 'brand-primary' in the fields.yaml and the $brand-primary in the scss file.

@info17589, thanks for coming back. I've had another crack at this and still no go. When I compile with Laravel-mix I get "undefined variable" error. Is this the same setup that you're using?

Cheers,

fields.yaml

primary_color:
        label: Primary Colour
        tab: Colours
        type: colorpicker
        default: '#379683'
        assetVar: 'colour-primary'

_color-palette.scss

$primary-colour: $colour-primary;
info17589
info17589

@cy35954 Yes, using the markup as yours. But not running scripts via Laravel Mix, but with the default Theme Combiner... see at https://octobercms.com/docs/themes/development#combiner-vars

Responsive
Responsive

@info17589 aaahhh, so it's Laravel Mix that's the problem. I'll look further into this. Thanks for your help mate.

redefined201351279
redefined201351279

@Responsive solved the problem?

1-12 of 12

You cannot edit posts or make replies: the forum has moved to talk.octobercms.com.