sutty-jekyll-theme 0.3.9 → 0.4.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 7e608f33d650d6848ce92061cc6d3d9416a8d249e521f19fe71b2730795fdea3
-  data.tar.gz: f3479bd8b2e3315809c23274c6a484e5f31a31a49b3aa3bcaf92840a3332149a
+  metadata.gz: 788bbf3527ae8fc9204494c454b45f84460aee92faf598b2cc2d040158e4032a
+  data.tar.gz: dc20bcf7b1410f46214ab6acfbf0c063e8f325c2fb3f0661c160b34dbc60e379
 SHA512:
-  metadata.gz: 4cf3515eddcbfcd4cfb90ee413db9d48704b0271c48d154c7ce0456a0b92dd3b47138613461f40793756ca1c37e0e3cd70d34ce6cf477b2fefa3ee51a9247c0f
-  data.tar.gz: a6d2440ea53441cf644495c96185e16d07daaa92c12c7bed160446887fe83215cc79995d358ec7708ea36a8b38749c36b10b6e7daa8ed63849e52e0becb90ce9
+  metadata.gz: c9ea9e08ff971668186b1b245d14b025db7fdccd407cddf8447ee0d038fb51d06e84c561ed1c2337f0b771c10aa21764612e2224e5ec0c372680922f716b43f7
+  data.tar.gz: 7d8713110ac36bc395d728e9c0b6e0f9e48175c2bd0fa97e52fb88fab08d42627102eb96626d383d138bc1c92db3e9e70dd3b61dd5ace5193064d832e466ec6d

data/_data/en.yml

@@ -57,5 +57,10 @@ layouts:
   post: "Post"
   privacy_policy: "Privacy policy"
   theme: "Customize"
+  menu_internal: "Menu (internal item)"
+  menu_external: "Menu (external item)"
+  menu_dropdown: "Menu (dropdown)"
+home:
+  articles: Articles
 footer:
   fediverse: "Fediverse"

data/_data/es.yml

@@ -57,5 +57,10 @@ layouts:
   post: "Artículo"
   privacy_policy: "Política de privacidad"
   theme: "Personalizar"
+  menu_internal: "Menú (ítem interno)"
+  menu_external: "Menú (ítem externo)"
+  menu_dropdown: "Menú (desplegable)"
+home:
+  articles: Artículos
 footer:
   fediverse: "Fediverso"

data/_data/layouts/menu_dropdown.yml

@@ -0,0 +1,39 @@
+---
+title:
+  type: "string"
+  required: true
+  label:
+    en: "Item name"
+    es: "Nombre del ítem"
+  help:
+    en: "Exactly as you want it to appear in the menu"
+    es: "Tal como aparece en el menú"
+items:
+  type: "new_has_many"
+  inverse: "item"
+  filter:
+    layout:
+    - "menu_internal"
+    - "menu_external"
+  label:
+    en: "Sub items"
+    es: "Sub ítems"
+  help:
+    en: "If item has sub items, associate them here"
+    es: "Si el ítem tiene sub ítems, asociarlos aquí"
+draft:
+  type: "boolean"
+  label:
+    es: "Borrador"
+    en: "Draft"
+  help:
+    es: "Al activar \"Borrador\" este contenido se mantendrá disponible en el panel, pero no se publica en el sitio como los demás contenidos al tocar \"Publicar todos los cambios\""
+    en: "By activating \"Draft\", this content will remain available on the dashboard, but will not be published on the site when you tap \"Publish all changes\" (other content which does not have this option selected will)."
+order:
+  type: "order"
+  label:
+    es: "Orden"
+    en: "Order"
+  help:
+    es: "La posición del artículo en la lista de artículos"
+    en: "Position in list of posts"

data/_data/layouts/menu_external.yml

@@ -0,0 +1,45 @@
+---
+title:
+  type: "string"
+  required: true
+  label:
+    en: "Item name"
+    es: "Nombre del ítem"
+  help:
+    en: "Exactly as you want it to appear in the menu"
+    es: "Tal como aparece en el menú"
+link:
+  type: "url"
+  label:
+    en: "Link"
+    es: "Vínculo"
+  help:
+    en: "If this item is a regular link, add it here"
+    es: "Si el ítem lleva a una página o sección especial, asociarla aquí"
+item:
+  type: "new_belongs_to"
+  inverse: "items"
+  filter:
+    layout: "menu"
+  label:
+    en: "Previous item"
+    es: "Ítem anterior"
+  help:
+    en: "If sub item, associate parent item here"
+    es: "Si es un sub ítem, asociar el ítem superior aquí"
+draft:
+  type: "boolean"
+  label:
+    es: "Borrador"
+    en: "Draft"
+  help:
+    es: "Al activar \"Borrador\" este contenido se mantendrá disponible en el panel, pero no se publica en el sitio como los demás contenidos al tocar \"Publicar todos los cambios\""
+    en: "By activating \"Draft\", this content will remain available on the dashboard, but will not be published on the site when you tap \"Publish all changes\" (other content which does not have this option selected will)."
+order:
+  type: "order"
+  label:
+    es: "Orden"
+    en: "Order"
+  help:
+    es: "La posición del artículo en la lista de artículos"
+    en: "Position in list of posts"

data/_data/layouts/menu_internal.yml

@@ -0,0 +1,52 @@
+---
+title:
+  type: "string"
+  required: true
+  label:
+    en: "Item name"
+    es: "Nombre del ítem"
+  help:
+    en: "Exactly as you want it to appear in the menu"
+    es: "Tal como aparece en el menú"
+post:
+  type: "new_belongs_to"
+  filter:
+    layout:
+    - "post"
+    - "page"
+    - "code_of_conduct"
+    - "license"
+    - "privacy_policy"
+  label:
+    en: "Página"
+    es: "Page"
+  help:
+    en: "If the menu item leads to a page, link it here"
+    es: "Si el ítem lleva a una página, asociarlo aquí"
+item:
+  type: "new_belongs_to"
+  inverse: "items"
+  filter:
+    layout: "menu"
+  label:
+    en: "Previous item"
+    es: "Ítem anterior"
+  help:
+    en: "If sub item, associate parent item here"
+    es: "Si es un sub ítem, asociar el ítem superior aquí"
+draft:
+  type: "boolean"
+  label:
+    es: "Borrador"
+    en: "Draft"
+  help:
+    es: "Al activar \"Borrador\" este contenido se mantendrá disponible en el panel, pero no se publica en el sitio como los demás contenidos al tocar \"Publicar todos los cambios\""
+    en: "By activating \"Draft\", this content will remain available on the dashboard, but will not be published on the site when you tap \"Publish all changes\" (other content which does not have this option selected will)."
+order:
+  type: "order"
+  label:
+    es: "Orden"
+    en: "Order"
+  help:
+    es: "La posición del artículo en la lista de artículos"
+    en: "Position in list of posts"

data/_data/layouts/page.yml

@@ -82,6 +82,20 @@ locales:
   help:
     es: "Vínculo al mismo artículo en otros idiomas"
     en: "Link to same post in other languages"
+permalink:
+  type: 'permalink'
+  label:
+    es: 'Enlace'
+    en: 'Permalink'
+  help:
+    es: |
+      Si no quieres utilizar el formato de enlaces general del sitio
+      para este artículo, especifica uno aquí.  Usa "/" para cambiar la
+      portada del sitio, o dejalo vacío para auto-generar la dirección.
+    en: |
+      If you don't want to follow the site's link format for this post,
+      change it here.  Use "/" to set this page as the home page, or
+      leave empty to auto-generate it.
 draft:
   type: "boolean"
   label:

data/_data/layouts/theme.yml

@@ -25,11 +25,13 @@ font_family_sans_serif:
       Roboto: "Roboto"
       Roboto Mono: "Roboto Mono"
       Saira: "Saira"
+      Lora: "Lora (serif)"
     es:
       "": "Default"
       Roboto: "Roboto"
       Roboto Mono: "Roboto Mono"
       Saira: "Saira"
+      Lora: "Lora (serif)"
 font_family_monospace:
   type: "predefined_value"
   label:
@@ -67,11 +69,13 @@ headings_font_family:
       Roboto: "Roboto"
       Roboto Mono: "Roboto Mono"
       Saira: "Saira"
+      Lora: "Lora (serif)"
     es:
       "": "Default"
       Roboto: "Roboto"
       Roboto Mono: "Roboto Mono"
       Saira: "Saira"
+      Lora: "Lora (serif)"
 enable_rounded:
   type: "boolean"
   label:

data/_data/schema.yml

@@ -0,0 +1,12 @@
+---
+organization:
+  post: []
+  page: []
+  about:
+  - "code_of_conduct"
+  - "license"
+  - "privacy_policy"
+  theme:
+  - "menu_internal"
+  - "menu_external"
+  - "menu_dropdown"

data/_includes/menu.html

@@ -0,0 +1,29 @@
+{%- comment -%}
+Empezamos con los ítems que no dependen de otros e implementamos
+recursivamente.
+{%- endcomment -%}
+{%- assign items = site.posts | where: 'layout', 'menu_internal' | where: 'item', nil -%}
+{%- assign items = site.posts | where: 'layout', 'menu_external' | where: 'item', nil | concat: items -%}
+{%- assign items = site.posts | where: 'layout', 'menu_dropdown' | concat: items -%}
+{%- assign items = items | order -%}
+
+<nav class="navbar navbar-expand-lg navbar-light">
+  {% unless items == empty %}
+    <button class="navbar-toggler"
+            type="button"
+            data-toggle="collapse"
+            data-target="#menu"
+            aria-label="{{ site.i18n.menu.title }}">
+      <span class="navbar-toggler-icon"></span>
+    </button>
+  {% endunless %}
+
+  <div class="collapse navbar-collapse" id="menu">
+    <div class="navbar-nav w-100 d-flex align-items-start justify-content-center">
+      {% for item in items %}
+        {% assign template = item.layout | append: ".html" %}
+        {%- include_cached {{ template }} item=item -%}
+      {% endfor %}
+    </div>
+  </div>
+</nav>

data/_includes/menu_dropdown.html

@@ -0,0 +1,16 @@
+{% assign items = include.item.items | order %}
+
+<div class="nav-item w-100 w-lg-auto dropdown d-flex flex-column flex-lg-row">
+  <div class="d-flex">
+    <p class="mb-0 nav-link flex-grow-1 flex-grow-lg-0 hover-black cursor-pointer pr-5 pr-md-2">{{ include.item.title }}</p>
+
+    <button class="dropdown-toggle border-0 bg-transparent w-5 w-lg-auto pl-lg-3"></button>
+  </div>
+
+  <div class="dropdown-menu w-100 w-lg-auto flex-grow-1 flex-grow-lg-0 background-body">
+    {% for item in items %}
+      {% assign template = item.layout | append: ".html" %}
+      {%- include_cached {{ template }} item=item -%}
+    {% endfor %}
+  </div>
+</div>

data/_includes/menu_external.html

@@ -0,0 +1,9 @@
+<div class="nav-item w-100 w-lg-auto">
+  <a
+    href="{{ include.item.link | component_escape }}"
+    target="_blank"
+    rel="noopener"
+    class="nav-link flex-grow-1 flex-grow-lg-0">
+    {{ include.item.title }}
+  </a>
+</div>

data/_includes/menu_internal.html

@@ -0,0 +1,7 @@
+<div class="nav-item w-100 w-lg-auto">
+  <a
+    href="{{ include.item.post.url | component_escape }}"
+    class="nav-link flex-grow-1 flex-grow-lg-0">
+    {{ include.item.title }}
+  </a>
+</div>

data/_layouts/default.html

@@ -33,7 +33,7 @@
     {%- endif -%}
   </head>
   <body class="min-vh-100 d-flex flex-column">
-    {% include navbar.html %}
+    {% include_cached menu.html %}
 
     <main class="container flex-grow-1">
       <div class="row justify-content-center d-print-block">

data/_layouts/page.html

@@ -12,16 +12,6 @@ layout: default
       <p class="lead p-summary" itemprop="description">{{ page.description | default: '' | escape }}</p>
     {%- endif -%}
 
-    {%- if page.image.path -%}
-      <picture>
-        {% for size in site.images.sizes %}
-          <source srcset="{{ page.image.path | thumbnail: size }}" media="(max-width: {{ size }}px)">
-        {% endfor %}
-
-        <img class="img-fluid" src="{{ page.image.path | thumbnail: 1140 }}" alt="{{ page.image.description }}">
-      </picture>
-    {%- endif -%}
-
     <p>
       <time class="dt-published" datetime="{{ page.date | date_to_xmlschema }}" itemprop="datePublished">
         {{ page.date | date_local: date_format }}
@@ -35,6 +25,16 @@ layout: default
         </span>
       {%- endfor -%}
     </p>
+
+    {%- if page.image.path -%}
+      <picture>
+        {% for size in site.images.sizes %}
+          <source srcset="{{ page.image.path | thumbnail: size }}" media="(max-width: {{ size }}px)">
+        {% endfor %}
+
+        <img class="img-fluid" src="{{ page.image.path | thumbnail: 1140 }}" alt="{{ page.image.description }}">
+      </picture>
+    {%- endif -%}
   </header>
 
   <div class="e-content content" itemprop="articleBody">

data/_layouts/post.html

@@ -12,16 +12,6 @@ layout: default
       <p class="lead p-summary" itemprop="description">{{ page.description | default: '' | escape }}</p>
     {%- endif -%}
 
-    {%- if page.image.path -%}
-      <picture>
-        {% for size in site.images.sizes %}
-          <source srcset="{{ page.image.path | thumbnail: size }}" media="(max-width: {{ size }}px)">
-        {% endfor %}
-
-        <img class="img-fluid" src="{{ page.image.path | thumbnail: 1140 }}" alt="{{ page.image.description }}">
-      </picture>
-    {%- endif -%}
-
     <p>
       <time class="dt-published" datetime="{{ page.date | date_to_xmlschema }}" itemprop="datePublished">
         {{ page.date | date_local: date_format }}
@@ -35,6 +25,16 @@ layout: default
         </span>
       {%- endfor -%}
     </p>
+
+    {%- if page.image.path -%}
+      <picture>
+        {% for size in site.images.sizes %}
+          <source srcset="{{ page.image.path | thumbnail: size }}" media="(max-width: {{ size }}px)">
+        {% endfor %}
+
+        <img class="img-fluid" src="{{ page.image.path | thumbnail: 1140 }}" alt="{{ page.image.description }}">
+      </picture>
+    {%- endif -%}
   </header>
 
   <div class="e-content content" itemprop="articleBody">

data/_sass/content.scss

@@ -33,6 +33,9 @@
   video,
   & > iframe {
     @extend .img-fluid;
+    @extend .d-block;
+    @extend .mx-auto;
+
     height: auto;
   }
 

data/_sass/fonts.scss

@@ -0,0 +1,4 @@
+@import "roboto_ital_wght_0_100_0_300_0_400_0_500_0_700_0_900_1_100_1_300_1_400_1_500_1_700_1_900";
+@import "roboto_mono_ital_wght_0_100..700_1_100..700";
+@import "lora_ital_wght_0_400..700_1_400..700";
+@import "saira_ital_wght_0_100..900_1_100..900";

data/_sass/lora_ital_wght_0_400..700_1_400..700.scss

@@ -0,0 +1,126 @@
+/* cyrillic-ext */
+@font-face {
+  font-family: 'Lora';
+  font-style: italic;
+  font-weight: 400 700;
+  font-display: swap;
+  src: url(../fonts/lora/v35/0QIhMX1D_JOuMw_LLPtLp_A.woff2) format('woff2');
+  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+/* cyrillic */
+@font-face {
+  font-family: 'Lora';
+  font-style: italic;
+  font-weight: 400 700;
+  font-display: swap;
+  src: url(../fonts/lora/v35/0QIhMX1D_JOuMw_LJftLp_A.woff2) format('woff2');
+  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+/* math */
+@font-face {
+  font-family: 'Lora';
+  font-style: italic;
+  font-weight: 400 700;
+  font-display: swap;
+  src: url(../fonts/lora/v35/0QIhMX1D_JOuMw_LXftLp_A.woff2) format('woff2');
+  unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
+}
+/* symbols */
+@font-face {
+  font-family: 'Lora';
+  font-style: italic;
+  font-weight: 400 700;
+  font-display: swap;
+  src: url(../fonts/lora/v35/0QIhMX1D_JOuMw_LT_tLp_A.woff2) format('woff2');
+  unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF;
+}
+/* vietnamese */
+@font-face {
+  font-family: 'Lora';
+  font-style: italic;
+  font-weight: 400 700;
+  font-display: swap;
+  src: url(../fonts/lora/v35/0QIhMX1D_JOuMw_LLvtLp_A.woff2) format('woff2');
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+/* latin-ext */
+@font-face {
+  font-family: 'Lora';
+  font-style: italic;
+  font-weight: 400 700;
+  font-display: swap;
+  src: url(../fonts/lora/v35/0QIhMX1D_JOuMw_LL_tLp_A.woff2) format('woff2');
+  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'Lora';
+  font-style: italic;
+  font-weight: 400 700;
+  font-display: swap;
+  src: url(../fonts/lora/v35/0QIhMX1D_JOuMw_LIftL.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* cyrillic-ext */
+@font-face {
+  font-family: 'Lora';
+  font-style: normal;
+  font-weight: 400 700;
+  font-display: swap;
+  src: url(../fonts/lora/v35/0QIvMX1D_JOuMwf7I-NP.woff2) format('woff2');
+  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+/* cyrillic */
+@font-face {
+  font-family: 'Lora';
+  font-style: normal;
+  font-weight: 400 700;
+  font-display: swap;
+  src: url(../fonts/lora/v35/0QIvMX1D_JOuMw77I-NP.woff2) format('woff2');
+  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+/* math */
+@font-face {
+  font-family: 'Lora';
+  font-style: normal;
+  font-weight: 400 700;
+  font-display: swap;
+  src: url(../fonts/lora/v35/0QIvMX1D_JOuM3b7I-NP.woff2) format('woff2');
+  unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
+}
+/* symbols */
+@font-face {
+  font-family: 'Lora';
+  font-style: normal;
+  font-weight: 400 700;
+  font-display: swap;
+  src: url(../fonts/lora/v35/0QIvMX1D_JOuM2T7I-NP.woff2) format('woff2');
+  unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF;
+}
+/* vietnamese */
+@font-face {
+  font-family: 'Lora';
+  font-style: normal;
+  font-weight: 400 700;
+  font-display: swap;
+  src: url(../fonts/lora/v35/0QIvMX1D_JOuMwX7I-NP.woff2) format('woff2');
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+/* latin-ext */
+@font-face {
+  font-family: 'Lora';
+  font-style: normal;
+  font-weight: 400 700;
+  font-display: swap;
+  src: url(../fonts/lora/v35/0QIvMX1D_JOuMwT7I-NP.woff2) format('woff2');
+  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'Lora';
+  font-style: normal;
+  font-weight: 400 700;
+  font-display: swap;
+  src: url(../fonts/lora/v35/0QIvMX1D_JOuMwr7Iw.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}

data/_sass/menu.scss

@@ -0,0 +1,36 @@
+/// El menú hamburguesa se expande cuando obtiene el foco y se oculta
+/// cuando lo pierde.  Esto nos permite tener un menú dinámico sin
+/// necesidad de JS.
+/// 
+/// @group Menú
+/// @link _includes/menu.html
+/// @todo En realidad el evento del foco está puesto en toda la navbar
+/// en lugar de solo en el ícono de hamburguesa.
+/// @example html
+///   <nav class="navbar">
+///     <button class="navbar-toggler">
+///       <span class="navbar-toggler-icon"></span>
+///     </button>
+///   
+///     <div class="collapse navbar-collapse" id="menu"></div>
+///   </nav>
+.navbar {
+  &:focus-within {
+    .navbar-collapse {
+      @extend .d-block;
+    }
+  }
+
+  .dropdown {
+    .dropdown-menu {
+      @extend .d-none;
+    }
+
+    &:hover,
+    &:focus-within {
+      .dropdown-menu {
+        @extend .d-block;
+      }
+    }
+  }
+}

data/_sass/saira_ital_wght_0_100..900_1_100..900.scss

@@ -0,0 +1,60 @@
+/* vietnamese */
+@font-face {
+  font-family: 'Saira';
+  font-style: italic;
+  font-weight: 100 900;
+  font-stretch: 100%;
+  font-display: swap;
+  src: url(../fonts/saira/v20/memhYa2wxmKQyNkiV50dulWP7s95AqZTzbvffS2-vw.woff2) format('woff2');
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+/* latin-ext */
+@font-face {
+  font-family: 'Saira';
+  font-style: italic;
+  font-weight: 100 900;
+  font-stretch: 100%;
+  font-display: swap;
+  src: url(../fonts/saira/v20/memhYa2wxmKQyNkiV50dulWP7s95AqZTzbvefS2-vw.woff2) format('woff2');
+  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'Saira';
+  font-style: italic;
+  font-weight: 100 900;
+  font-stretch: 100%;
+  font-display: swap;
+  src: url(../fonts/saira/v20/memhYa2wxmKQyNkiV50dulWP7s95AqZTzbvQfS0.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* vietnamese */
+@font-face {
+  font-family: 'Saira';
+  font-style: normal;
+  font-weight: 100 900;
+  font-stretch: 100%;
+  font-display: swap;
+  src: url(../fonts/saira/v20/memjYa2wxmKQyPMrZX79wwYZQMhsyuSLh4vSZSk.woff2) format('woff2');
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+/* latin-ext */
+@font-face {
+  font-family: 'Saira';
+  font-style: normal;
+  font-weight: 100 900;
+  font-stretch: 100%;
+  font-display: swap;
+  src: url(../fonts/saira/v20/memjYa2wxmKQyPMrZX79wwYZQMhsyuSLhovSZSk.woff2) format('woff2');
+  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'Saira';
+  font-style: normal;
+  font-weight: 100 900;
+  font-stretch: 100%;
+  font-display: swap;
+  src: url(../fonts/saira/v20/memjYa2wxmKQyPMrZX79wwYZQMhsyuSLiIvS.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}

data/assets/css/styles.scss

@@ -7,11 +7,9 @@
   {{ theme | yaml_to_scss: site.data.layouts.theme }}
 {% endif %}
 
-@import "roboto_ital_wght_0_100_0_300_0_400_0_500_0_700_0_900_1_100_1_300_1_400_1_500_1_700_1_900";
-@import "roboto_mono_ital_wght_0_100..700_1_100..700";
+@import "fonts";
 @import "variables";
 @import "bootstrap/scss/bootstrap";
-@import "saira";
 @import "selection";
 @import "buttons";
 @import "crypto";
@@ -19,3 +17,4 @@
 @import "images";
 @import "custom";
 @import "content";
+@import "menu";