Web Awesome <link> tags conflict with the appearance of input in Blockly fields

[Max Stephen Russell]

So as not to double post, please allow me to reference this issue here:

https://github.com/shoelace-style/webawesome-alpha/discussions/228

which also contains the description of the problem, in case anyone might want to evaluate it.

I have used the simplest single-page example to demonstrate what I have run into elsewhere, namely, in the Blockly app I'm creating.

Thank you.

Steve

[Maribeth Moffatt]

Hi Steve,

You are downloading some stylesheets that are applying conflicting CSS. I don't know anything about the library specifically, but some of these ui frameworks/tools/packages include css that restyles common browser elements to give everything on your site a consistent look, instead of using scoped css that only affects the elements it provides. You could try including the library *before* including blockly on the page, as if there's a "tie" in css specificity, the later value will win, so some of Blockly's styles may win that way. But otherwise you're going to have to find the conflicting styles from the ui framework you're using and disable or undo them.

Best,

Maribeth

[Max Stephen Russell]

Thank you, Maribeth. You helped me see that we should replace the stylesheet with some standard html and css. The trouble has gone away.

-Steve