Hi community,
Semantic UI React offers more customizations in my opinion than Microsoft Fluent UI.
An example is the Semantic UI React Dropdown control: you can search for elements and even add new items!
I tried PCF with Semantic UI React ... in testing it works fine, but when I load the control on form model-driven apps the semantic.css library conflicts with the Microsoft system layout!
As Microsoft important warns:
"When you implement styling to your code components using CSS, ensure that the CSS is scoped to your control using the automatically generated CSS classes applied to the container DIV element for your component. If your CSS is scoped globally, it will likely break the existing styling of the form or screen where the code component is rendered. If using a third-party CSS framework, use a version of that framework that is already namespaced or otherwise wrap that framework in a namespace manually either by hand or using a CSS preprocessor. "
So, How can I use a preprocessor??
PCF CLI doesn't recognize Sass or Less! With React Semantic Theming also needs Sass! And editing the webpackconfig.js file in /node_modules/pcf-scripts/ path doesn't seem like a consistent idea. Webpack also doesn't run the added "loader" plugins .... for example, pcf-sass-loader (see this article ) doesn't work for me.
Kindly, has anyone figure out the preprocessor problem or the semantic.css reference? 🙂
