Variables inside css

  • ssssadsadasd-1335007992772296845

    ssssadsadasd

    8 days ago

    I want to do the following: if an input has a maximum of 300 characters and you have written 100 characters, I want to create a circle with a background which is red for 33% of it and gray the rest.
    for fixed value the css would be:
    background: conic-gradient( red 0deg, red 90deg, #cccccc 90deg, #cccccc 360deg )

    now I want to replace the 90deg with a dynamic value. so, I create a formula, then set the value of a variable to that formula and replace in the above sth like this:
    background: conic-gradient( red 0deg, red var(--degrees), #cccccc var(--degrees), #cccccc 360deg )

    however, this does not seem to work. do you have any idea why?
    [here](https://toddle.dev/projects/teal_sebulba_biological_tarantula/branches/start/components/test1?leftpanel=design&canvas-width=800&canvas-height=800&rightpanel=style) is an implementation.

    Thanks

Stop scrolling. Start building.

toddle is a visual web app builder that rivals custom code — but accessible to your entire team!

Try toddle — it's free!

© Copyright 2024 toddle. All rights reserved.