Migration de la forme twitter-bootstrap vers zurb-foundation

Question

J'ai utilisé le bootstrap Twitter pour mon simple blog depuis un certain temps maintenant et je suis impatient de migrer vers le bootstrap3. Cependant, j'ai également lu de très bonnes choses à propos de la Fondation Zurb et je voudrais essayer cela avant de passer à bootstrap3.

Je suis un peu noob quand il s'agit de technologies côté client, donc j'apprécierais quelques conseils sur la façon de migrer de bootstrap à Foundation. Serait-ce une migration simple ou délicate?

Apprécierait une opinion impartiale des experts dans ce domaine.

Answer 1

Je ne pense pas que ce serait un processus simple. Vous devez modifier la structure, les classes et les identifiants de votre code HTML. Par exemple, si vous vouliez un menu déroulant, vous obtiendrez quelque chose comme ceci.

<div class="dropdown"> 
    <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown trigger</a> 
    <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel"> 
    ... 
    </ul> 
</div> 

Si vous souhaitez utiliser Foundation, vous devez remplacer le code HTML par quelque chose comme ceci.

<a href="#" data-dropdown="drop1">Has Dropdown</a> 
<ul id="drop1" class="f-dropdown" data-dropdown-content> 
    <li><a href="#">This is a link</a></li> 
    <li><a href="#">This is another</a></li> 
    <li><a href="#">Yet another</a></li> 
</ul> 

De toute évidence, le CSS serait différent, mais j'imagine que vous attendez de la migration. Une autre chose que je peux penser est que la fondation utilise Sass et pas moins comme bootstrap, donc si vous en avez écrit moins qui devra être changé en Sass.

Espérons que cela aide.

Answer 2

Je voudrais coller avec bootstrap. Il est plus difficile de remplacer le style de bootstrap que le fondement 4 - mais la documentation est meilleure.

Comme vous pouvez le voir dans la réponse précédente, la migration serait très douloureuse. Si vous vouliez utiliser Foundation, il serait plus facile de recommencer à zéro. Et Foundation 5 peut être assez pénible à mettre en place.

Je vous suggère fortement d'apprendre à utiliser LESS avec Bootstrap. (Ou SASS/Compass for Foundation.) La personnalisation est beaucoup moins douloureuse qu'avec le CSS brut.