desy-html 6.0.0 → 6.2.1

package/src/templates/components/header-advanced/_examples.header-advanced.njk

@@ -0,0 +1,761 @@
+{% from "components/nav/_macro.nav.njk" import componentNav %}
+{% from "components/details/_macro.details.njk" import componentDetails %}
+{% from "components/menu-navigation/_macro.menu-navigation.njk" import componentMenuNavigation %}
+{% from "components/menu-vertical/_macro.menu-vertical.njk" import componentMenuVertical %}
+{% from "components/searchbar/_macro.searchbar.njk" import componentSearchbar %}
+
+{% set logoUE %}
+  <svg xmlns="http://www.w3.org/2000/svg" width="44" height="36" viewBox="0 0 148 121" class="relative top-0.5 inline-block fill-current" aria-label="Unión Europea" role="img"><title>Logo de la Unión Europea</title><defs><clipPath id="a-logo-UE"><path d="M0 0h148v121H0z"/></clipPath></defs><g clip-path="url(#a-logo-UE)"><path d="M11.737 107.263H13.9v5.815a12.063 12.063 0 0 0 .081 1.794 1.739 1.739 0 0 0 .663 1.058 2.309 2.309 0 0 0 1.432.4 2.185 2.185 0 0 0 1.392-.377 1.49 1.49 0 0 0 .564-.927 12.08 12.08 0 0 0 .1-1.824v-5.94H20.3v5.638a14.491 14.491 0 0 1-.176 2.732 3.024 3.024 0 0 1-.648 1.348 3.275 3.275 0 0 1-1.263.875 5.5 5.5 0 0 1-2.065.326 5.947 5.947 0 0 1-2.333-.355 3.336 3.336 0 0 1-1.256-.923 2.958 2.958 0 0 1-.608-1.19 13.04 13.04 0 0 1-.212-2.725ZM22.606 118v-10.737h2.109l4.395 7.17v-7.17h2.014V118h-2.175l-4.329-7v7Zm10.745 0v-10.737h2.168V118Zm3.794-5.3a6.829 6.829 0 0 1 .491-2.754 5.053 5.053 0 0 1 1-1.472 4.18 4.18 0 0 1 1.388-.967 5.9 5.9 0 0 1 2.314-.425 5.041 5.041 0 0 1 3.8 1.472 5.642 5.642 0 0 1 1.422 4.092 5.624 5.624 0 0 1-1.414 4.069 5 5 0 0 1-3.779 1.468 5.053 5.053 0 0 1-3.809-1.461 5.545 5.545 0 0 1-1.413-4.022Zm2.234-.073a4.023 4.023 0 0 0 .842 2.765 2.744 2.744 0 0 0 2.139.941 2.721 2.721 0 0 0 2.127-.933 4.1 4.1 0 0 0 .831-2.8 4.037 4.037 0 0 0-.809-2.754 2.738 2.738 0 0 0-2.15-.908 2.757 2.757 0 0 0-2.161.919 4.057 4.057 0 0 0-.82 2.767Zm1.641-5.977 1.011-2.19h2.307l-2.014 2.19ZM49.273 118v-10.737h2.109l4.395 7.17v-7.17h2.014V118h-2.175l-4.329-7v7Zm14.978 0v-10.737h7.961v1.816h-5.793v2.38h5.391v1.809h-5.391v2.922h6V118Zm9.991-10.737h2.168v5.815a12.063 12.063 0 0 0 .08 1.795 1.739 1.739 0 0 0 .663 1.058 2.309 2.309 0 0 0 1.432.4 2.185 2.185 0 0 0 1.392-.377 1.49 1.49 0 0 0 .564-.927 12.08 12.08 0 0 0 .1-1.824v-5.94H82.8v5.637a14.491 14.491 0 0 1-.176 2.732 3.024 3.024 0 0 1-.644 1.35 3.275 3.275 0 0 1-1.263.875 5.5 5.5 0 0 1-2.066.326 5.947 5.947 0 0 1-2.333-.355 3.336 3.336 0 0 1-1.256-.923 2.958 2.958 0 0 1-.608-1.19 13.04 13.04 0 0 1-.212-2.725ZM85.1 118v-10.737h4.563a7.81 7.81 0 0 1 2.5.289 2.467 2.467 0 0 1 1.249 1.029 3.093 3.093 0 0 1 .469 1.692 2.866 2.866 0 0 1-.71 2 3.412 3.412 0 0 1-2.124.992 5.058 5.058 0 0 1 1.161.9 12.237 12.237 0 0 1 1.234 1.743L94.75 118h-2.593l-1.568-2.336a15.156 15.156 0 0 0-1.143-1.578 1.664 1.664 0 0 0-.652-.447 3.573 3.573 0 0 0-1.094-.121h-.439V118Zm2.168-6.2h1.6a8.283 8.283 0 0 0 1.948-.132 1.168 1.168 0 0 0 .608-.454 1.4 1.4 0 0 0 .22-.806 1.287 1.287 0 0 0-.289-.875 1.328 1.328 0 0 0-.817-.421q-.264-.037-1.582-.037h-1.692Zm8.218.894a6.829 6.829 0 0 1 .491-2.754 5.053 5.053 0 0 1 1-1.472 4.18 4.18 0 0 1 1.383-.968 5.9 5.9 0 0 1 2.314-.425 5.041 5.041 0 0 1 3.8 1.472 5.642 5.642 0 0 1 1.426 4.099 5.624 5.624 0 0 1-1.414 4.069 5 5 0 0 1-3.786 1.468 5.053 5.053 0 0 1-3.8-1.461 5.545 5.545 0 0 1-1.418-4.022Zm2.234-.073a4.023 4.023 0 0 0 .842 2.765 2.744 2.744 0 0 0 2.138.944 2.721 2.721 0 0 0 2.124-.93 4.1 4.1 0 0 0 .831-2.8 4.037 4.037 0 0 0-.809-2.754 2.738 2.738 0 0 0-2.15-.908 2.757 2.757 0 0 0-2.161.919 4.057 4.057 0 0 0-.819 2.767Zm9.869 5.379v-10.737h3.479a12.616 12.616 0 0 1 2.578.161 2.815 2.815 0 0 1 1.545 1.051 3.333 3.333 0 0 1 .623 2.091 3.5 3.5 0 0 1-.359 1.663 2.944 2.944 0 0 1-.912 1.058 3.142 3.142 0 0 1-1.124.509 12.375 12.375 0 0 1-2.249.154h-1.413V118Zm2.168-8.921v3.047h1.187a5.606 5.606 0 0 0 1.714-.168 1.423 1.423 0 0 0 .677-.527 1.443 1.443 0 0 0 .245-.831 1.387 1.387 0 0 0-.344-.967 1.5 1.5 0 0 0-.872-.476 10.42 10.42 0 0 0-1.56-.073Zm7.837 8.921v-10.737h7.961v1.816h-5.793v2.38h5.391v1.809h-5.391v2.922h6V118Zm19.687 0h-2.358l-.937-2.439h-4.293l-.886 2.439h-2.3l4.182-10.737h2.292Zm-3.991-4.248-1.48-3.984-1.45 3.984ZM2.83 2.741h141.523v94.35H2.83z" fill="#039"/><g fill="#fc0"><path d="m70.576 23.298 2.986-2.179 2.987 2.179-1.136-3.524 3.033-2.179h-3.739l-1.144-3.567-1.144 3.571h-3.737l3.031 2.179ZM55.121 27.45l2.986-2.179 2.984 2.179-1.134-3.524 3.031-2.179h-3.739l-1.144-3.571-1.144 3.575h-3.737l3.031 2.179ZM46.8 29.508l-1.144 3.575h-3.737l3.031 2.179-1.136 3.524 2.986-2.179 2.986 2.179-1.136-3.524 3.031-2.179h-3.737ZM42.652 52.039l2.984 2.179-1.134-3.524 3.031-2.179h-3.737l-1.144-3.571-1.144 3.579-3.739-.008 3.033 2.179-1.136 3.524ZM47.945 63.997l-1.144-3.571-1.144 3.575H41.92l3.031 2.179-1.136 3.524 2.986-2.183 2.986 2.183-1.136-3.524 3.031-2.179ZM59.274 75.324l-1.144-3.567-1.142 3.571h-3.739l3.031 2.179-1.135 3.524 2.986-2.179 2.984 2.179-1.134-3.524 3.031-2.179ZM74.709 79.43l-1.144-3.571-1.142 3.575h-3.739l3.031 2.179-1.134 3.524 2.986-2.179 2.985 2.179-1.137-3.524 3.033-2.179ZM90.142 75.324 89 71.757l-1.146 3.571h-3.735l3.029 2.179-1.134 3.524L89 78.852l2.986 2.179-1.138-3.524 3.033-2.179ZM101.475 63.997l-1.146-3.571-1.146 3.575h-3.735l3.033 2.179-1.138 3.524 2.986-2.183 2.986 2.183-1.138-3.524 3.033-2.179ZM109.316 48.471h-3.739l-1.146-3.571-1.142 3.575H99.55l3.033 2.179-1.134 3.524 2.982-2.183 2.986 2.183-1.134-3.524ZM97.343 38.736l2.986-2.179 2.986 2.179-1.138-3.524 3.033-2.175h-3.735l-1.146-3.571-1.146 3.575h-3.735l3.033 2.175ZM89.043 18.179l-1.142 3.575-3.739-.008 3.029 2.183-1.134 3.524 2.99-2.183 2.982 2.183-1.135-3.524 3.033-2.183h-3.743Z"/></g></g></svg>
+{% endset %}
+
+{% set navigationCustom %}
+  {{ componentMenuNavigation({
+    "idPrefix": "header-custom-nav",
+    "classes": "c-menu-navigation--last-right hidden lg:block w-full",
+    "items": [
+      {
+        "text": "Custom Item 1",
+        "id": "header-custom-nav-item-1",
+        "classes": "c-menu-navigation__button--header -mr-base -ml-base",
+        "sub": {
+          "items": [
+            {
+              "href": "#",
+              "text": "Subitem 1"
+            },
+            {
+              "href": "#",
+              "text": "Subitem 2"
+            },
+            {
+              "href": "#",
+              "text": "Subitem 3"
+            }
+          ],
+          "attributes": {
+            "aria-labelledby": "header-custom-nav-item-1"
+          }
+        }
+      },
+      {
+        "text": "Custom Active Item 2",
+        "id": "header-custom-nav-item-2",
+        "classes": "c-menu-navigation__button--header -mr-base",
+        "active": true,
+        "sub": {
+          "items": [
+            {
+              "href": "#",
+              "text": "Subitem 1"
+            },
+            {
+              "href": "#",
+              "text": "Subitem 2",
+              "active": true
+            },
+            {
+              "href": "#",
+              "text": "Subitem 3"
+            }
+          ],
+          "attributes": {
+            "aria-labelledby": "header-custom-nav-item-2"
+          }
+        }
+      },
+      {
+        "text": "Custom Item 3",
+        "id": "header-custom-nav-item-3",
+        "classes": "c-menu-navigation__button--header -mr-base",
+        "sub": {
+          "items": [
+            {
+              "href": "#",
+              "text": "Subitem 1"
+            },
+            {
+              "href": "#",
+              "text": "Subitem 2"
+            },
+            {
+              "href": "#",
+              "text": "Subitem 3"
+            }
+          ],
+          "attributes": {
+            "aria-labelledby": "header-custom-nav-item-3"
+          }
+        }
+      },
+      {
+          "text": "Item 4 right",
+          "id": "header-custom-nav-item-4",
+          "classes": "c-menu-navigation__button--header -mr-base",
+          "sub": {
+            "items": [
+              {
+                "href": "#",
+                "text": "Subitem 1"
+              },
+              {
+                "href": "#",
+                "text": "Subitem 2"
+              },
+              {
+                "href": "#",
+                "text": "Subitem 3"
+              }
+            ],
+            "attributes": {
+              "aria-labelledby": "header-custom-nav-item-4"
+            }
+          }
+        }
+    ],
+    "attributes": {
+      "aria-label": "Navegación principal"
+    }
+  })  }}
+{% endset %}
+
+{% set navigationCustomAragon %}
+  {{ componentMenuNavigation({
+    "idPrefix": "header-custom-nav",
+    "classes": "hidden lg:block w-full",
+    "items": [
+      {
+        "text": "Inicio",
+        "id": "header-custom-nav-item-0",
+        "classes": "c-menu-navigation__button--header -mr-base -ml-sm",
+        "href": "#"
+      },
+      {
+        "text": "Temas",
+        "id": "header-custom-nav-item-1",
+        "classes": "c-menu-navigation__button--header -mr-base",
+        "sub": {
+          "items": [
+            {
+              "href": "#",
+              "text": "Actividades industriales y energía"
+            },
+            {
+              "href": "#",
+              "text": "Atención social y dependencia"
+            },
+            {
+              "href": "#",
+              "text": "Cultura, ocio y turismo"
+            },
+            {
+              "href": "#",
+              "text": "Derechos y servicios a la ciudadanía"
+            },
+            {
+              "href": "#",
+              "text": "Educación, investigación y desarrollo"
+            },
+            {
+              "href": "#",
+              "text": "Empleo y trabajo"
+            },
+            {
+              "href": "#",
+              "text": "Empresa, comercio y asociaciones"
+            },
+            {
+              "href": "#",
+              "text": "Infraestructuras, transportes y carreteras"
+            },
+            {
+              "href": "#",
+              "text": "Medio ambiente"
+            },
+            {
+              "href": "#",
+              "text": "Medio rural, agricultura y ganadería"
+            },
+            {
+              "href": "#",
+              "text": "Salud"
+            },
+            {
+              "href": "#",
+              "text": "Vivienda"
+            }
+          ],
+          "attributes": {
+            "aria-labelledby": "header-custom-nav-item-1"
+          }
+        }
+      },
+      {
+        "text": "Institución",
+        "id": "header-custom-nav-item-2",
+        "classes": "c-menu-navigation__button--header -mr-base",
+        "active": true,
+        "sub": {
+          "items": [
+            {
+              "href": "#",
+              "text": "Gobierno de Aragón"
+            },
+            {
+              "href": "#",
+              "text": "Estatuto de Aragón"
+            },
+            {
+              "href": "#",
+              "text": "Organismos"
+            },
+            {
+              "href": "#",
+              "text": "Municipios"
+            },
+            {
+              "href": "#",
+              "text": "Identidad comunicación corporativa"
+            },
+            {
+              "href": "#",
+              "text": "Presupuestos"
+            }
+          ],
+          "attributes": {
+            "aria-labelledby": "header-custom-nav-item-2"
+          }
+        }
+      },
+      {
+        "text": "Trámites",
+        "id": "header-custom-nav-item-3",
+        "classes": "c-menu-navigation__button--header -mr-base",
+        "sub": {
+          "items": [
+            {
+              "href": "#",
+              "text": "Inicio Sede electrónica - Trámites"
+            },
+            {
+              "href": "#",
+              "text": "Categorías de trámites"
+            },
+            {
+              "href": "#",
+              "text": "Finalidades de trámites"
+            },
+            {
+              "href": "#",
+              "text": "Servicios de la Sede electrónica"
+            },
+            {
+              "href": "#",
+              "text": "Información y ayuda"
+            }
+          ],
+          "attributes": {
+            "aria-labelledby": "header-custom-nav-item-3"
+          }
+        }
+      },
+      {
+          "text": "Contacto",
+          "id": "header-custom-nav-item-4",
+          "classes": "c-menu-navigation__button--header -mr-base",
+          "href": "#"
+        }
+    ],
+    "attributes": {
+      "aria-label": "Navegación principal"
+    }
+  })  }}
+{% endset %}
+
+
+{% set exampleOffcanvas %}
+  <nav class="w-full p-2" aria-label="Menú móvil">
+    <h3 class="p-base text-base font-bold">Carpeta del gestor</h3>
+    {{ componentNav({
+      "idPrefix": "nav-mobile-pages",
+      "hasNav": false,
+      "items": [
+        {
+          "href": "#",
+          "text": "Inicio",
+          "active": true
+        },
+        {
+          "href": "#",
+          "text": "Expedientes"
+        },
+        {
+          "href": "#",
+          "text": "Bandejas",
+          "divider": true
+        }
+      ],
+      "attributes": {
+        "aria-label": "Lista de páginas"
+      }
+    })  }}
+    <h3 class="p-base text-base font-bold">Usuario/a: Marta Pérez</h3>
+    {{ componentNav({
+      "idPrefix": "nav-mobile-user",
+      "hasNav": false,
+      "items": [
+        {
+          "href": "#",
+          "text": "Perfil"
+        },
+        {
+          "href": "#",
+          "text": "Cerrar sesión",
+          "divider": true
+        }
+      ],
+      "attributes": {
+        "aria-label": "Lista de acciones de usuario"
+      }
+    })  }}
+    {% call componentDetails({
+      "classes": "px-base",
+      "summary": {
+        "html": "Cambiar de aplicación",
+        "classes": "c-link text-sm"
+      }
+    })  %}
+        {{ componentNav({
+          "idPrefix": "nav-mobile-apps",
+          "hasNav": false,
+          "items": [
+            {
+              "href": "#",
+              "text": "Carpeta del gestor",
+              "active": true
+            },
+            {
+              "href": "#",
+              "text": "Catálogo de servicios"
+            },
+            {
+              "href": "#",
+              "text": "Bandeja de entrada"
+            },
+            {
+              "href": "#",
+              "text": "Sistema de comprobación y verificación de documentos por CSV"
+            }
+          ],
+          "attributes": {
+            "aria-label": "Lista de aplicaciones"
+          }
+        })  }}
+    {% endcall %}
+  </nav>
+{% endset %}
+
+{% set exampleOffcanvasAragon %}
+  <div class="w-full p-2">
+    <h3 class="p-base text-base font-bold">Buscar</h3>
+    <div class="pb-lg px-base border-b border-neutral-base">
+      {{ componentSearchbar({
+      "id": "searchbar-mobile",
+          "label": {
+            "text": "Buscar"
+          },
+          "placeholder": "Buscar en este sitio"
+        })  }}
+    </div>
+    <h3 class="p-base text-base font-bold">Gobierno de Aragón</h3>
+    {{ componentMenuVertical({
+      "idPrefix": "nav-mobile-pages",
+      "hasNav": false,
+      "items": [
+        {
+          "href": "#",
+          "text": "Inicio",
+          "active": true
+        },
+        {
+          "href": "#",
+          "text": "Temas",
+          "id": "parent-example-item-1",
+          "sub": {
+            "items": [
+              {
+                "href": "#",
+                "text": "Actividades industriales y energía"
+              },
+              {
+                "href": "#",
+                "text": "Atención social y dependencia"
+              },
+              {
+                "href": "#",
+                "text": "Cultura, ocio y turismo"
+              },
+              {
+                "href": "#",
+                "text": "Derechos y servicios a la ciudadanía"
+              },
+              {
+                "href": "#",
+                "text": "Educación, investigación y desarrollo"
+              },
+              {
+                "href": "#",
+                "text": "Empleo y trabajo"
+              },
+              {
+                "href": "#",
+                "text": "Empresa, comercio y asociaciones"
+              },
+              {
+                "href": "#",
+                "text": "Infraestructuras, transportes y carreteras"
+              },
+              {
+                "href": "#",
+                "text": "Medio ambiente"
+              },
+              {
+                "href": "#",
+                "text": "Medio rural, agricultura y ganadería"
+              },
+              {
+                "href": "#",
+                "text": "Salud"
+              },
+              {
+                "href": "#",
+                "text": "Vivienda"
+              }
+            ],
+            "attributes": {
+              "aria-labelledby": "parent-example-item-1"
+            }
+          }
+        },
+        {
+          "href": "#",
+          "text": "Institución",
+          "id": "parent-example-item-2",
+          "sub": {
+            "items": [
+              {
+                "href": "#",
+                "text": "Gobierno de Aragón"
+              },
+              {
+                "href": "#",
+                "text": "Estatuto de Aragón"
+              },
+              {
+                "href": "#",
+                "text": "Organismos"
+              },
+              {
+                "href": "#",
+                "text": "Municipios"
+              },
+              {
+                "href": "#",
+                "text": "Identidad comunicación corporativa"
+              },
+              {
+                "href": "#",
+                "text": "Presupuestos"
+              }
+            ],
+            "attributes": {
+              "aria-labelledby": "parent-example-item-2"
+            }
+          }
+        },
+        {
+          "href": "#",
+          "text": "Trámites",
+          "id": "parent-example-item-3",
+          "sub": {
+            "items": [
+              {
+                "href": "#",
+                "text": "Inicio Sede electrónica - Trámites"
+              },
+              {
+                "href": "#",
+                "text": "Categorías de trámites"
+              },
+              {
+                "href": "#",
+                "text": "Finalidades de trámites"
+              },
+              {
+                "href": "#",
+                "text": "Servicios de la Sede electrónica"
+              },
+              {
+                "href": "#",
+                "text": "Información y ayuda"
+              }
+            ],
+            "attributes": {
+              "aria-labelledby": "parent-example-item-3"
+            }
+          }
+        },
+        {
+          "href": "#",
+          "text": "Contacto",
+          "divider": true
+        }
+      ],
+      "attributes": {
+        "aria-label": "Menu móvil: Lista de páginas"
+      }
+    })  }}
+    <h3 class="p-base text-base font-bold">Tamaño de texto</h3>
+    {{ componentNav({
+      "idPrefix": "nav-mobile-user",
+      "items": [
+        {
+          "href": "#",
+          "text": "Aumentar tamaño de letra"
+        },
+        {
+          "href": "#",
+          "text": "Reducir tamaño de letra",
+          "divider": true
+        }
+      ],
+      "attributes": {
+        "aria-label": "Menú movil: Tamaño de texto"
+      }
+    })  }}
+  </div>
+{% endset %}
+
+
+
+{% set logoUrl = 'data:image/png;base64,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' %}
+
+{% set logoUrlAragon = 'data:image/png;base64,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' %}
+
+{% set logoUE %}
+  <svg xmlns="http://www.w3.org/2000/svg" width="44" height="36" viewBox="0 0 148 121" class="relative top-0.5 inline-block fill-current" aria-label="Unión Europea" role="img"><title>Logo de la Unión Europea</title><defs><clipPath id="a-logo-UE"><path d="M0 0h148v121H0z"/></clipPath></defs><g clip-path="url(#a-logo-UE)"><path d="M11.737 107.263H13.9v5.815a12.063 12.063 0 0 0 .081 1.794 1.739 1.739 0 0 0 .663 1.058 2.309 2.309 0 0 0 1.432.4 2.185 2.185 0 0 0 1.392-.377 1.49 1.49 0 0 0 .564-.927 12.08 12.08 0 0 0 .1-1.824v-5.94H20.3v5.638a14.491 14.491 0 0 1-.176 2.732 3.024 3.024 0 0 1-.648 1.348 3.275 3.275 0 0 1-1.263.875 5.5 5.5 0 0 1-2.065.326 5.947 5.947 0 0 1-2.333-.355 3.336 3.336 0 0 1-1.256-.923 2.958 2.958 0 0 1-.608-1.19 13.04 13.04 0 0 1-.212-2.725ZM22.606 118v-10.737h2.109l4.395 7.17v-7.17h2.014V118h-2.175l-4.329-7v7Zm10.745 0v-10.737h2.168V118Zm3.794-5.3a6.829 6.829 0 0 1 .491-2.754 5.053 5.053 0 0 1 1-1.472 4.18 4.18 0 0 1 1.388-.967 5.9 5.9 0 0 1 2.314-.425 5.041 5.041 0 0 1 3.8 1.472 5.642 5.642 0 0 1 1.422 4.092 5.624 5.624 0 0 1-1.414 4.069 5 5 0 0 1-3.779 1.468 5.053 5.053 0 0 1-3.809-1.461 5.545 5.545 0 0 1-1.413-4.022Zm2.234-.073a4.023 4.023 0 0 0 .842 2.765 2.744 2.744 0 0 0 2.139.941 2.721 2.721 0 0 0 2.127-.933 4.1 4.1 0 0 0 .831-2.8 4.037 4.037 0 0 0-.809-2.754 2.738 2.738 0 0 0-2.15-.908 2.757 2.757 0 0 0-2.161.919 4.057 4.057 0 0 0-.82 2.767Zm1.641-5.977 1.011-2.19h2.307l-2.014 2.19ZM49.273 118v-10.737h2.109l4.395 7.17v-7.17h2.014V118h-2.175l-4.329-7v7Zm14.978 0v-10.737h7.961v1.816h-5.793v2.38h5.391v1.809h-5.391v2.922h6V118Zm9.991-10.737h2.168v5.815a12.063 12.063 0 0 0 .08 1.795 1.739 1.739 0 0 0 .663 1.058 2.309 2.309 0 0 0 1.432.4 2.185 2.185 0 0 0 1.392-.377 1.49 1.49 0 0 0 .564-.927 12.08 12.08 0 0 0 .1-1.824v-5.94H82.8v5.637a14.491 14.491 0 0 1-.176 2.732 3.024 3.024 0 0 1-.644 1.35 3.275 3.275 0 0 1-1.263.875 5.5 5.5 0 0 1-2.066.326 5.947 5.947 0 0 1-2.333-.355 3.336 3.336 0 0 1-1.256-.923 2.958 2.958 0 0 1-.608-1.19 13.04 13.04 0 0 1-.212-2.725ZM85.1 118v-10.737h4.563a7.81 7.81 0 0 1 2.5.289 2.467 2.467 0 0 1 1.249 1.029 3.093 3.093 0 0 1 .469 1.692 2.866 2.866 0 0 1-.71 2 3.412 3.412 0 0 1-2.124.992 5.058 5.058 0 0 1 1.161.9 12.237 12.237 0 0 1 1.234 1.743L94.75 118h-2.593l-1.568-2.336a15.156 15.156 0 0 0-1.143-1.578 1.664 1.664 0 0 0-.652-.447 3.573 3.573 0 0 0-1.094-.121h-.439V118Zm2.168-6.2h1.6a8.283 8.283 0 0 0 1.948-.132 1.168 1.168 0 0 0 .608-.454 1.4 1.4 0 0 0 .22-.806 1.287 1.287 0 0 0-.289-.875 1.328 1.328 0 0 0-.817-.421q-.264-.037-1.582-.037h-1.692Zm8.218.894a6.829 6.829 0 0 1 .491-2.754 5.053 5.053 0 0 1 1-1.472 4.18 4.18 0 0 1 1.383-.968 5.9 5.9 0 0 1 2.314-.425 5.041 5.041 0 0 1 3.8 1.472 5.642 5.642 0 0 1 1.426 4.099 5.624 5.624 0 0 1-1.414 4.069 5 5 0 0 1-3.786 1.468 5.053 5.053 0 0 1-3.8-1.461 5.545 5.545 0 0 1-1.418-4.022Zm2.234-.073a4.023 4.023 0 0 0 .842 2.765 2.744 2.744 0 0 0 2.138.944 2.721 2.721 0 0 0 2.124-.93 4.1 4.1 0 0 0 .831-2.8 4.037 4.037 0 0 0-.809-2.754 2.738 2.738 0 0 0-2.15-.908 2.757 2.757 0 0 0-2.161.919 4.057 4.057 0 0 0-.819 2.767Zm9.869 5.379v-10.737h3.479a12.616 12.616 0 0 1 2.578.161 2.815 2.815 0 0 1 1.545 1.051 3.333 3.333 0 0 1 .623 2.091 3.5 3.5 0 0 1-.359 1.663 2.944 2.944 0 0 1-.912 1.058 3.142 3.142 0 0 1-1.124.509 12.375 12.375 0 0 1-2.249.154h-1.413V118Zm2.168-8.921v3.047h1.187a5.606 5.606 0 0 0 1.714-.168 1.423 1.423 0 0 0 .677-.527 1.443 1.443 0 0 0 .245-.831 1.387 1.387 0 0 0-.344-.967 1.5 1.5 0 0 0-.872-.476 10.42 10.42 0 0 0-1.56-.073Zm7.837 8.921v-10.737h7.961v1.816h-5.793v2.38h5.391v1.809h-5.391v2.922h6V118Zm19.687 0h-2.358l-.937-2.439h-4.293l-.886 2.439h-2.3l4.182-10.737h2.292Zm-3.991-4.248-1.48-3.984-1.45 3.984ZM2.83 2.741h141.523v94.35H2.83z" fill="#039"/><g fill="#fc0"><path d="m70.576 23.298 2.986-2.179 2.987 2.179-1.136-3.524 3.033-2.179h-3.739l-1.144-3.567-1.144 3.571h-3.737l3.031 2.179ZM55.121 27.45l2.986-2.179 2.984 2.179-1.134-3.524 3.031-2.179h-3.739l-1.144-3.571-1.144 3.575h-3.737l3.031 2.179ZM46.8 29.508l-1.144 3.575h-3.737l3.031 2.179-1.136 3.524 2.986-2.179 2.986 2.179-1.136-3.524 3.031-2.179h-3.737ZM42.652 52.039l2.984 2.179-1.134-3.524 3.031-2.179h-3.737l-1.144-3.571-1.144 3.579-3.739-.008 3.033 2.179-1.136 3.524ZM47.945 63.997l-1.144-3.571-1.144 3.575H41.92l3.031 2.179-1.136 3.524 2.986-2.183 2.986 2.183-1.136-3.524 3.031-2.179ZM59.274 75.324l-1.144-3.567-1.142 3.571h-3.739l3.031 2.179-1.135 3.524 2.986-2.179 2.984 2.179-1.134-3.524 3.031-2.179ZM74.709 79.43l-1.144-3.571-1.142 3.575h-3.739l3.031 2.179-1.134 3.524 2.986-2.179 2.985 2.179-1.137-3.524 3.033-2.179ZM90.142 75.324 89 71.757l-1.146 3.571h-3.735l3.029 2.179-1.134 3.524L89 78.852l2.986 2.179-1.138-3.524 3.033-2.179ZM101.475 63.997l-1.146-3.571-1.146 3.575h-3.735l3.033 2.179-1.138 3.524 2.986-2.183 2.986 2.183-1.138-3.524 3.033-2.179ZM109.316 48.471h-3.739l-1.146-3.571-1.142 3.575H99.55l3.033 2.179-1.134 3.524 2.982-2.183 2.986 2.183-1.134-3.524ZM97.343 38.736l2.986-2.179 2.986 2.179-1.138-3.524 3.033-2.175h-3.735l-1.146-3.571-1.146 3.575h-3.735l3.033 2.175ZM89.043 18.179l-1.142 3.575-3.739-.008 3.029 2.183-1.134 3.524 2.99-2.183 2.982 2.183-1.135-3.524 3.033-2.183h-3.743Z"/></g></g></svg>
+{% endset %}
+
+{% set buscador %}
+  {{ componentSearchbar({
+    "id": "searchbar-2",
+    "label": {
+      "text": "Buscar"
+    },
+    "placeholder": "Buscar en este sitio"
+  })  }}
+{% endset %}
+
+{% set exampleComponent = "header-advanced" %}
+{% set examples =  [
+  {
+    "name": "default",
+    "description": "Esta es la cabecera por defecto para sitios web de submarcas del Gobierno de Aragón. Tiene un título que enlaza a la página de inicio.",
+    "data": {
+      "title": {
+        "homepageUrl": "/",
+        "text": "Hospital Universitario Miguel Servet"
+      },
+      "navigation": {
+        "items": [
+          {
+            "href": "#1",
+            "text": "Inicio"
+          },
+          {
+            "href": "#2",
+            "text": "Navigation item 2",
+            "active": true
+          },
+          {
+            "href": "#3",
+            "text": "Navigation item 3"
+          },
+          {
+            "href": "#4",
+            "text": "Navigation item 4"
+          }
+          ]
+      }
+    }
+  },
+  {
+    "name": "with custom navigation",
+    "description": "Tras nuestro menú de navegación tenemos una zona anidable para poder añadir una navegación personalizada",
+    "data": {
+      "title": {
+        "homepageUrl": "/",
+        "text": "Hospital Universitario Miguel Servet"
+      },
+      "customNavigationHtml": '<div class="flex flex-wrap flex-1 gap-base">'+ navigationCustom | safe + '</div>'
+    }
+  },
+  {
+    "name": "with custom navigation right",
+    "description": "En el customNavigationHtml podemos añadir elementos posicionados a la derecha",
+    "data": {
+      "title": {
+        "homepageUrl": "/",
+        "text": "Hospital Universitario Miguel Servet"
+      },
+      "customNavigationHtml": '<div class="relative flex justify-end items-center flex-1 gap-base"><div class="absolute -top-5 right-0 text-black"><a href="#"><span class="block p-sm"><svg class="w-5 h-5" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" aria-label="Notificaciones" role="img"><path d="M7.25 12.5h-1.5a.75.75 0 0 0 0 1.5h1.5a.75.75 0 0 0 0-1.5Z" fill="currentColor" transform="scale(3.42857)"/><g transform="scale(3.42857)"><circle cx="10.5" cy="2.5" r="2.5" fill="currentColor"/><path d="M11.5 10a1 1 0 0 1-1-1V6.74a.25.25 0 0 0-.24-.25 4 4 0 0 1-3.76-4 3.43 3.43 0 0 1 .11-.86.12.12 0 0 0 0-.1.15.15 0 0 0-.09 0 4 4 0 0 0-4 4V9a1 1 0 0 1-1 1 .5.5 0 0 0 0 1h10a.5.5 0 0 0 0-1Z" fill="currentColor"/></g></svg></span></a></div></div>'
+    }
+  },
+  {
+    "name": "with custom skipLink",
+    "description": "Pasando parámetros customizados al componente Skip Link. Útil para hacer plantillas de página con barra lateral o con un contenido principal localizado en otro sitio diferente al habitual.",
+    "data": {
+      "skipLink":{
+        "text": "Saltar al contenido central",
+        "href": "#content-center",
+        "classes": "ds-focus",
+        "attributes": {
+          "attr-example": "custom-data"
+        }
+      },
+      "title": {
+        "homepageUrl": "/",
+        "text": "Hospital Universitario Miguel Servet"
+      },
+      "navigation": {
+        "items": [
+          {
+            "href": "#1",
+            "text": "Navigation item 1"
+          },
+          {
+            "href": "#2",
+            "text": "Navigation item 2",
+            "active": true
+          },
+          {
+            "href": "#3",
+            "text": "Navigation item 3"
+          },
+          {
+            "href": "#4",
+            "text": "Navigation item 4"
+          }
+          ]
+      }
+    }
+  },
+  {
+    "name": "con offcanvas",
+    "description": "Menu mobile que sólo se muestra en anchuras pequeñas y que permite insertar dentro cualquier contenido con Nunjuks caller",
+    "data": {
+      "title": {
+        "homepageUrl": "/",
+        "text": "Hospital Universitario Miguel Servet"
+      },
+      "offcanvas": {
+        "text": "Menú",
+        "textClose": "Cerrar menu",
+        "labelledId": "offcanvas-title"
+      },
+      "caller": exampleOffcanvas
+    }
+  },
+  {
+    "name": "con dropdown",
+    "description": "Un dropdown a la derecha que puede usarse para mostrar información adicional: login, acerca de... Se oculta por defecto en anchuras pequeñas si no se le añaden clases a dropdown.",
+    "data": {
+      "title": {
+        "homepageUrl": "/",
+        "text": "Hospital Universitario Miguel Servet"
+      },
+      "dropdown": {
+        "text": "Marta Pérez",
+        "items": [
+          {
+          "text": "Perfil",
+          "href": "/"
+          },
+          {
+          "text": "Cerrar sesión",
+          "href": "/"
+          }
+        ]
+      }
+    }
+  },
+  {
+    "name": "con dropdown personalizado",
+    "description": "Se pueden usar los parámetros del dropdown para personalizarlo. En este ejemplo con html en el dropdown.",
+    "data": {
+      "title": {
+        "homepageUrl": "/",
+        "text": "Hospital Universitario Miguel Servet"
+      },
+      "dropdown": {
+        "html": '<span class="block text-right">Marta Pérez <br>(Administración)</span>',
+        "items": [
+          {
+          "text": "Perfil",
+          "href": "/"
+          },
+          {
+          "text": "Cerrar sesión",
+          "href": "/"
+          }
+        ]
+      }
+    }
+  },
+  {
+    "name": "con contenido personalizado en dropdown",
+    "description": "El dropdown puede contener cualquier tipo de información.",
+    "data": {
+      "title": {
+        "homepageUrl": "/",
+        "text": "Hospital Universitario Miguel Servet"
+      },
+      "dropdown": {
+        "text": "Marta Pérez",
+        "contentHtml": '<div class="p-base"><dl><dt class="text-base">Marta Pérez</dt><dd class="text-sm text-neutral-dark">Departamento de Ciencia, Universidad y Sociedad del Conocimiento</dd></dl></div>',
+        "classesTooltip": "w-64 max-h-48 overflow-y-auto"
+      }
+    }
+  },
+  {
+    "name": "con todo",
+    "description": "Logo, menu de navegación, dropdown en anchuras grandes y menu mobile en pequeñas.",
+    "data": {
+      "headerMini": {
+        "customNavigationHtml": '<div class="flex-1 text-right">' + logoUE | safe +'</div>'
+      },
+      "title": {
+        "homepageUrl": "/",
+        "text": "Gobierno de Aragón"
+      },
+      "customNavigationHtml": '<div class="flex flex-wrap flex-1 gap-base">'+ navigationCustomAragon | safe + '</div>',
+      "dropdown": {
+        "text": "Tamaño de texto",
+        "items": [
+          {
+          "text": "Aumentar tamaño de letra",
+          "href": "#"
+          },
+          {
+          "text": "Reducir tamaño de letra",
+          "href": "#"
+          }
+        ]
+      },
+      "offcanvas": {
+        "text": "Menú",
+        "textClose": "Cerrar menu"
+      },
+      "caller": exampleOffcanvasAragon
+    }
+  }
+] %}