How to modify your CSS working with Mobile Angular UI and Bootstrap
I know that my question has already a huge number of topics, but I think it could be helpful for the community to have a clear answer in one topic.
This is about modifying your CSS while using Mobile Angular UI, with a bootstrap template.
- This is how a project is organized with Mobile Angular UI :
I have my index.html in src/html/ and my other webpages in src/templates. My index importations look like :
<link rel="stylesheet" href="css/app.min.css" /> <link rel="stylesheet" href="css/responsive.min.css" />
thanks to that, I can see the bootstrap template on my webpages. But I don't know how to modify it. The two solutions I saw are creating a design.css and import it after the two other .css, but it doesn't work. I also saw that normally we should import bootstrap.min.css, but it has no effect on my webpages.
So How could I modify the global design for my webpages, like for example the background color, keeping the Bootstrap template ? Shall we go into the less files ? What's the aim of these two css responsive.min and app.min ?
How should we organize the CSS files while working with Mobile Angular UI ?
Thanks a lot !
By the way, which version of Mobile angular UI are you using ? I think those stylesheets are not available. I have git cloned the project, and i can't see them.
And now I can answer your question. If you download the framework well, you will have a
src directory. In this
src directory you have
less/variables.less, where you can change most of the customizable elements of your interface.
gulp build again to have appropriate
Hope that help.