Reference on V.2rc React Components theming?



  • Hello,

    I have just discovered Onsen UI and I would like to know about customization and theming provided react components. I don’t find reference/tutorial on the v2.rc about those topics, so here is my questions:

    • How far we can customize existing components? I am looking for something more mutable than material-ui.
    • Which css methodology does Onsen use? (I saw some BEM in the default style sheet)
    • Does it use css-module or inline style or BEM namespace to avoid naming conflict?
    • What is the workflow for theming?
    • Is it compatible with JSS?

    Thank you :)



  • @dagatsoin We use BEM to avoid name conflicts. You can build your own theme by customizing the Stylus files in the css-components directory. Just copy one of the existing themes and compile it with Stylus. Or you can override the current styles but that would create some superfluous rules.

    https://github.com/OnsenUI/OnsenUI/tree/master/css-components/components-src/stylus

    You should be able to run the Stylus compiler on these files.



  • @argelius thx you very much.



  • for those who ask: here is a demo repo which works with JSS: https://github.com/dagatsoin/JSS-OnseUI-example

    npm install -g monaca # Install Monaca CLI - Onsen UI toolkit
    monaca signup # Free sign up
    git clone git@github.com:dagatsoin/JSS-OnseUI-example.git
    cd JSS-OnseUI-example
    npm install
    monaca preview 
    


  • @dagatsoin Looks very nice. I will definitely take a look at JSS


Log in to reply