Jump to content

Featured Replies

Posted

Hi,

I created my own test field to test the colors.
image.thumb.png.0e3ad4b270de3a9148fdc5e2fc89cb0b.png

I paste this value into CSS using:

{theme='test_color'}

Question: How do I change the value from HEX to RGB? I would like to put this value in a variable as it is done in the default IPS theme (:root)

Instead:

:root {
	--test-var-color: {theme='test_color'};
}

Effect:
:root {
	--test-var-color: #2193e6;
}

I want it to look like this:

:root {
	--test-var-color: {theme='test_color'};
}

Effect:
:root {
	--test-var-color: 33, 147, 230;
}

Is there a ready way for this? Do I need to change this value using a function in php?
If there is a ready solution, I suggest adding this to the documentation.

Any theme settings that are "color" fields will automatically be turned into CSS variables for you. If your theme setting has the key "test_color" (like in your screenshot), the CSS variable will be named --theme-test_color. No need to create the CSS variables yourself 🙂 

  • Author

Great message! It will save me writing additional code. Thanks!
Happy Hailee Steinfeld GIF by Pitch Perfect

To expand upon your original question, if you needed to manually convert hex color code to rgb, there's a template plugin (which works in CSS files) for that.

{hextorgb="$variable" opacity="1"}

{hextorgb="#fff" opacity="0.1"}

 

Recently Browsing 0

  • No registered users viewing this page.