Themes.

index.html

@@ -960,16 +960,79 @@ <h2>Sistemas de Grids: Susy</h2>
   </slide>
 
 
-  <slide> <!--  THEMES  -->
+  <slide class="drupal-themes"> <!--  THEMES  -->
     <hgroup>
       <h2>Themes Drupal existentes</h2>
     </hgroup>
     <article>
-      <ul>
-        <li>Zen</li>
-        <li>Omega 4</li>
-        <li>Bootstrap</li>
-        <li>Foundation</li>
+      <ul class="build">
+        <li><a href="http://dgo.to/zen"><img src="images/zen-logo.png"><span>Zen</span></a></li>
+        <li><a href="http://dgo.to/omega"><img src="images/omega-logo.png"><span>Omega 4</span></a></li>
+        <li><a href="http://dgo.to/bootstrap"><img src="images/bootstrap-logo.png"><span>Bootstrap</span></a></li>
+        <li><a href="http://dgo.to/zurb-foundation"><img src="images/zurb-foundation-logo.png"><span>Foundation</span></a></li>
+      </ul>
+    </article>
+  </slide>
+
+  <slide class="theme-zen"> <!--  THEMES  -->
+    <hgroup>
+      <h2>Zen (<span>116,263 instalaciones</span>)</h2>
+    </hgroup>
+    <article>
+      <ul class="build ">
+        <li>SASS</li>
+        <li>Zen Grids</li>
+        <li>Media queries == mobile first </li>
+        <li>respond.js per >IE8</li>
+        <li>Layout Fixed o RWD</li>
+        <li>SMACS por components</li>
+        <li>Solución Menú RWD</li>
+      </ul>
+    </article>
+  </slide>
+
+  <slide class="theme-omega"> <!--  THEMES  -->
+    <hgroup>
+      <h2>Omega 4 (<span>71,982 instalaciones</span>)</h2>
+    </hgroup>
+    <article>
+      <ul class="build ">
+        <li>Susy y Singularitygs</li>
+        <li>Mediaqueries gestionadas por breakpoint</li>
+        <li>4 Layouts RWD</li>
+        <li>Layout off-canvas solución fácil menu RWD</li>
+        <li>LiveReload, Cleatype, Selectivizr.js, CSS3 Media Queries JS, Respond.js, CSS3 PIE, HTML5 shiv</li>
+      </ul>
+    </article>
+  </slide>
+
+  <slide class="theme-bootstrap"> <!--  THEMES  -->
+    <hgroup>
+      <h2>Bootstrap (<span>22,379 instalaciones</span>)</h2>
+    </hgroup>
+    <article>
+      <ul class="build fade first">
+        <li>LESS</li>
+        <li>Adaptación del marcado de Drupal al framework</li>
+        <li>Para después aplicar un «skin»</li>
+        <li><a href="https://drupal.org/node/2011034">Módulos complementarios:</a><br>
+          <ul>
+            <li>Display Suite, Views, Blocks, Panels, Field Formatters, Images/Slideshows, Menus, Modals, UX, administration </li>
+          </ul>
+        </li>
+      </ul>
+    </article>
+  </slide>
+
+  <slide class="theme-foundation"> <!--  THEMES  -->
+    <hgroup>
+      <h2>Foundation (<span>3,227 instalaciones</span>)</h2>
+    </hgroup>
+    <article>
+      <ul class="build fade first">
+        <li>Adaptación del marcado de Drupal al framework</li>
+        <li>Para después aplicar un «skin»</li>
+        <li>Gema zurb-foundation junto con Compass</li>
       </ul>
     </article>
   </slide>

theme/scss/default.scss

@@ -1358,3 +1358,66 @@ $container-width: 1200px;
     clear: right;
   }
 }
+.drupal-themes {
+  li {
+    width: 50%;
+    margin: 1em 0;
+    text-align: center;
+    float: left;
+    list-style: none;
+    &:before {
+      content: "";
+    }
+    img {
+      height: 5em;
+    }
+    span {
+      display: block;
+      clear: both;
+    }
+  }
+}
+.theme-foundation,
+.theme-bootstrap,
+.theme-omega,
+.theme-zen {
+  ul, h2 {
+    padding: 0.5em 0 0.5em 5em;
+    span {
+      font-weight: normal;
+    }
+  }
+}
+.theme-zen {
+  h2 {
+    padding: 0.5em 0 0.5em 5em;
+  }
+  background: url(../../images/zen-logo.png) no-repeat 2em 2em;
+}
+.theme-omega {
+  h2 {
+    padding: 0.5em 0 0.5em 3em;
+  }
+  background: url(../../images/omega-logo.png) no-repeat 2em 2em;
+}
+.theme-bootstrap {
+  background: url(../../images/bootstrap-logo.png) no-repeat 2em 2em;
+  ul {
+    padding: 0;
+  }
+  ul.first {
+    padding: 0.5em 0 0.5em 8em;
+  }
+}
+.theme-foundation {
+  background: url(../../images/zurb-foundation-logo.png) no-repeat 2em 2em;
+}
+.theme-foundation,
+.theme-bootstrap {
+ul {
+    padding: 0;
+  }
+  ul.first {
+    padding: 0.5em 0 0.5em 8em;
+  }
+}