Concrete5 and materializecss.com
Permalink
I trying to create a theme with this framerowrk:
http://materializecss.com/
The components and css work well but in the JS some of the code dont work well in the C5 system (the modal for example)
what is the best way to check this problems? (i dont know so well JS)? - in the debugger i dont see errors
http://materializecss.com/
The components and css work well but in the JS some of the code dont work well in the C5 system (the modal for example)
what is the best way to check this problems? (i dont know so well JS)? - in the debugger i dont see errors
This is really a problem in C5 - and their is very very little Docs and example about this.
Modals, off canvas and other JS dont work. i also try foundation 6 (60% of the JS dosent work well)
Modals, off canvas and other JS dont work. i also try foundation 6 (60% of the JS dosent work well)
I think this is covered at the documentation:
http://documentation.concrete5.org/developers/designing-for-concret...
Usually within the framework's code, this is quite simple to do for most of the frameworks due to the fact that they usually use some preprocessing engine (such as less or scss). Just wrap everything within the .ccm-page class.
Some elements of course might still conflict, e.g. if you cannot get modals within the container in the specific framework. In these situations, just move these problematic parts out of the .ccm-page wrapper. Probably they will then work OK if this is a completely different framework than bootstrap (that the core uses).
This is an unfortunate restriction with the currently supported technologies by the major browsers. In the future this probably will become more easy as more browsers add wider support for scoped CSS (and once the old browsers start dropping out):
https://www.w3.org/TR/css-scoping-1/...
http://documentation.concrete5.org/developers/designing-for-concret...
Usually within the framework's code, this is quite simple to do for most of the frameworks due to the fact that they usually use some preprocessing engine (such as less or scss). Just wrap everything within the .ccm-page class.
Some elements of course might still conflict, e.g. if you cannot get modals within the container in the specific framework. In these situations, just move these problematic parts out of the .ccm-page wrapper. Probably they will then work OK if this is a completely different framework than bootstrap (that the core uses).
This is an unfortunate restriction with the currently supported technologies by the major browsers. In the future this probably will become more easy as more browsers add wider support for scoped CSS (and once the old browsers start dropping out):
https://www.w3.org/TR/css-scoping-1/...
I think this is the 99% of project task (when you buy static theme or want to test new framework)
For something is so IMPORTANT their is really little information in C5 docs. and zero examples ("HOW TO FIX FOUNDAION TOOLTIP JS in C5" for example)
Thanks anyway
For something is so IMPORTANT their is really little information in C5 docs. and zero examples ("HOW TO FIX FOUNDAION TOOLTIP JS in C5" for example)
Thanks anyway
- between css classes
- between html data-xxxx attributes
- javascript function names
The trick is to make sure everything is strongly scoped, so c5 core stuff only messes with what it is supposed to, and similarly for the framework you are using.
Where you can't enforce scope, you may need to change/override some of the framework code to make it work with something you can scope or use names that don't collide.
(and that also applies to frameworks that use bootstrap as the core does, they can still get into arguments)