Sign in Register
Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Simeon Ostberg 123 posts 389 karma points
    Nov 15, 2017 @ 12:34
    Simeon Ostberg
    0

    Changing CSS variables in a property

    Hi everyone,

    I would like to change the colors of my scheme using a property. I have the property defined (which works), but how can I call this property in the CSS file? Everything I tried didn't work. Or is there any other way to achieve this?

    Best, Simeon

    Copy Link
  • Steve Morgan 1348 posts 4457 karma points c-trib
    Nov 15, 2017 @ 13:20
    Steve Morgan
    0

    I take it you mean the front end?

    The usual way I do this is to set a class in the body e.g. tag in Razor and target the CSS like this.

    ,scheme1 h1 { }

    Copy Link
  • Matt Darby 28 posts 391 karma points c-trib
    Nov 15, 2017 @ 13:23
    Matt Darby
    0

    Hey Simeon,

    You could add a dropdownlist editor to your root node with some CSS class names. For example "blueTheme", "redTheme".

    Then for example you could add this CSS class to <body>:

    <body class="@Model.Content.GetPropertyValue("themeDropdown", recurse:true)">

    If it's only for a minor change a quick and dirty way to do it would be to use the Color Picker property editor. This returns the hex value of the color, which you can use as an inline style:

    <div style="background:#@Model.Content.GetPropertyValue("colourPicker")">...</div>
    Copy Link
  • Simeon Ostberg 123 posts 389 karma points
    Nov 15, 2017 @ 15:08
    Simeon Ostberg
    0

    @Steve Morgan: Sorry, yes I mean the front end.

    @Matt Darby: Thanks a lot, but unfortunately the color is used in many different situations, so, I would need that in the separate CSS file, not in the template itself. Like CSS variable (I also tried that). Is there any other way?

    Thanks!

    Copy Link
Please Sign in or register to post replies

Write your reply to:

Draft