CMS Development

pawel_p
Member

Could not resolve function 'color'

SOLVE

I have an error in my CSS file saying "Could not resolve function 'color'" on the line where I have the theme override specific styles:

 

 

/* Theme Override Specific style */
{% set header_bg_color = color(theme.header.background_color) %}
{% set footer_bg_color = color(theme.footer.background_color) %}

 

 

The current setting in fields.json are as follow:

 

[
  {
    "label": "Website header",
    "name": "header",
    "type": "group",
    "children": [
      {
        "label": "Background color",
        "name": "background_color",
        "type": "color",
        "default": {
          "color": "#EFEFEF",
          "opacity": 100
        }
      }
    ]
  },
  {
    "label": "Website footer",
    "name": "footer",
    "type": "group",
    "children": [
      {
        "label": "Background color",
        "name": "background_color",
        "type": "color",
        "default": {
          "color": "#EFEFEF",
          "opacity": 100
        }
      }
    ]
  }
]

 

 

Please help if you have an idea why I have these errors: 'Error: Cannot resolve property' and 'Error: Syntax error'.

 

Thnak you

0 Upvotes
1 Accepted solution
Teun
Solution
Recognized Expert | Elite Partner
Recognized Expert | Elite Partner

Could not resolve function 'color'

SOLVE

Hi @pawel_p , where did you find the `color()` function? You should be able to set the variables like this:

{% set header_bg_color = theme.header.background_color.color %}
{% set footer_bg_color = theme.footer.background_color.color %}

 

You can also access the opacity like this:
 

{% set header_bg_opacity = theme.header.background_color.opacity %}
{% set footer_bg_opcaity = theme.footer.background_color.opacity %}

 



Learn more about HubSpot by following me on LinkedIn or YouTube

Did my answer solve your issue? Help the community by marking it as the solution.


View solution in original post

0 Upvotes
2 Replies 2
pawel_p
Member

Could not resolve function 'color'

SOLVE

Thanks. I manage to fix that before you sen the reply.

 

The color() function I saw in a boilerplate theme, when i created a example in a Design Tool.

0 Upvotes
Teun
Solution
Recognized Expert | Elite Partner
Recognized Expert | Elite Partner

Could not resolve function 'color'

SOLVE

Hi @pawel_p , where did you find the `color()` function? You should be able to set the variables like this:

{% set header_bg_color = theme.header.background_color.color %}
{% set footer_bg_color = theme.footer.background_color.color %}

 

You can also access the opacity like this:
 

{% set header_bg_opacity = theme.header.background_color.opacity %}
{% set footer_bg_opcaity = theme.footer.background_color.opacity %}

 



Learn more about HubSpot by following me on LinkedIn or YouTube

Did my answer solve your issue? Help the community by marking it as the solution.


0 Upvotes