Block de les categories de la meua web personal

Block de les categories de la meua web personal

Bones, doncs ací un recordatori de l'HTML 5 i el CSS3 que faig servir al block de les categories de la meua web personal, on faig la part del disseny del frontend amb Bootstrap. Per altra banda, la segona part la faig des de twig al fitxer /themes/drupal8_zymphonies_theme/templates/layout/page.html.twig on, canvie la classe del div on estem per a, des del CSS que veuràs baix d'aquest article, pintar-ho de color griset.

Doncs bé, el codi de l'HTML5 del block és:


I l'estil és simplement el següent:

/* --------------------------------------------------------------------------- */
/* Block de les categories */
/* --------------------------------------------------------------------------- */
#block-categories .list-group a.disabled {font-size: 1.7em; font-weight: bold; }
#block-categories .list-group {margin: 0;}
#block-categories a {margin: 0 0 -25px 0;}
.categoria_unix .activadaunix {background: #f5f5f5; margin:0; }
.categoria_gnulinux .activadagnulinux {background: #f5f5f5; margin: 0;}
.categoria_android .activadaandroid {background: #f5f5f5; }
.categoria_drupal .activadadrupal {background: #f5f5f5; }
.categoria_xhtml .activadaxhtml {background: #f5f5f5; }
.categoria_python .activadapython {background: #f5f5f5; }
.categoria_altres .activadaaltres {background: #f5f5f5; }

I aixo és tot.