Open softmarshmallow opened 3 years ago
I'm not sure I'm following but it's quite simple to hyphenate style properties (inspiration from Glitz):
const style = {
color: 'white',
textAlign: 'start',
};
const hyphenateRegex = /(?:^ms)|[A-Z]/g;
function hyphenateProperty(property) {
return property.replace(hyphenateRegex, '-$&').toLowerCase();
}
let declarations = '';
for (const property of Object.keys(style)) {
declarations += `${hyphenateProperty(property)}: ${style[property]};\n`
}
console.log(declarations);
// color: white;
// text-align: start;
Or did I misunderstand your question?
I'm not sure I'm following but it's quite simple to hyphenate style properties (inspiration from Glitz):
const style = { color: 'white', textAlign: 'start', }; const hyphenateRegex = /(?:^ms)|[A-Z]/g; function hyphenateProperty(property) { return property.replace(hyphenateRegex, '-$&').toLowerCase(); } let declarations = ''; for (const property of Object.keys(style)) { declarations += `${hyphenateProperty(property)}: ${style[property]};\n` } console.log(declarations); // color: white; // text-align: start;
Or did I misunderstand your question?
I was wondering if this approach can catch all the cases including --webkit-~~
sort of prop names.
Maybe this can help you: https://ccss.dev/
I understand the existence of this library is to back the foundation types and advanced usage related to it, but i have this related question.
Wile using as an advanced usage, let's say I want to make a css file from the declaration.
Does this package has build in css builder linked to it's target?
My proposal is simple.
to
What is the recommended way of building usable string of css body in a recognized token?
Properties:PropertiesHyphen
?PropertiesHyphen
toProperties
?So i can build the css as string for my design to code application