svelte-nodegui icon indicating copy to clipboard operation
svelte-nodegui copied to clipboard

Support for styling elements

Open shirakaba opened this issue 3 years ago • 2 comments

This is possible, as long as you don't write it into a

QLabel {
    color: red;
}

This would be preferred, as we use elements with names like :

text {
    color: red;
}

To achieve this, we'd need to implement a Svelte postprocessor that renames text to the corresponding underlying component, i.e. QLabel.

We could work around this using global styles, with the natural caveat that they would be unscoped. For now, the best we can do is:

:global(QLabel) {
    color: red;
}

shirakaba avatar Jan 30 '21 15:01 shirakaba

I was thinking about picking this. However, not sure if a postprocessor will help. It should be svelte that writes the css, don't you think? Once svelte compiles our code, we won't be able to go back in add the styling. Thoughts?

mrsauravsahu avatar Jan 30 '21 16:01 mrsauravsahu

Thought about this issue and I see changing the text selector to QLabel webpack output makes the css work. I think we can write a webpack loader to parse the output that Svelte produces and make necessary changes.

mrsauravsahu avatar Jan 31 '21 16:01 mrsauravsahu