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

siton
 
JohntheFish replied on at Permalink Reply
JohntheFish
Generic issues with any framework are often namespace conflicts vs c5 core bootstrap
- 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)
siton replied on at Permalink Reply
siton
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)
Mainio replied on at Permalink Reply
Mainio
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/...
siton replied on at Permalink Reply
siton
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