<header class="header">
    <nav class="container fixed-top access-nav d-print-none" aria-label="menu accessibilité">
        <ul class="list-unstyled mt-3">
            <li>
                <a class="sr-only sr-only-focusable btn btn-dark pt-0" accesskey="0" href="#" title="[Alt+0] Page d'accueil du site">Accueil</a>
            </li>
            <li>
                <a class="sr-only sr-only-focusable btn btn-dark pt-0" accesskey="1" href="#nav-primary" title="[Alt+1] Menu de navigation de la page">Menu de navigation de la page</a>
            </li>
            <li>
                <a class="sr-only sr-only-focusable btn btn-dark pt-0" accesskey="2" href="#main" title="[Alt+2] Debut du contenu de la page">Début du contenu de la page</a>
            </li>
            <li>
                <a class="sr-only sr-only-focusable btn btn-dark pt-0" accesskey="3" href="#" title="[Alt+3] Page de contact">Page de contact</a>
            </li>
            <li>
                <a class="sr-only sr-only-focusable btn btn-dark pt-0" accesskey="4" href="#" title="[Alt+4] Plan du site du Canton de Vaud">Plan du site</a>
            </li>
            <li>
                <a class="sr-only sr-only-focusable btn btn-dark pt-0" accesskey="5" href="#search-form" title="[Alt+5] Accès au champ de recherche">Accès au champ de recherche</a>
            </li>
            <li>
                <a class="sr-only sr-only-focusable btn btn-dark pt-0" accesskey="6" href="#" title="[Alt+6] Accès à l'index thématique">Thèmes</a>
            </li>
            <li>
                <a class="sr-only sr-only-focusable btn btn-dark pt-0" accesskey="7" href="#" title="[Alt+7] Accès à la navigation par autorités">Autorités</a>
            </li>
            <li>
                <a class="sr-only sr-only-focusable btn btn-dark pt-0" accesskey="8" href="#" title="[Alt+8] Page d'aide pour les personnes en situation de handicap">Page d'aide pour les personnes en situation de handicap</a>
            </li>
        </ul>
    </nav>

    <div class="container">
        <div class="d-flex flex-wrap justify-content-between justify-content-md-end
    d-print-none">
            <div>
                <nav class="align-items-center d-flex d-print-none">
                    <h2 class="sr-only">
                        Sous-navigation
                    </h2>
                    <ul class="list-inline text-md-end small">
                        <li class="list-inline-item me-2">
                            <a href="#">Autorités</a>
                        </li>
                        <li class="list-inline-item me-2">
                            <a href="#">Annuaire</a>
                        </li>
                    </ul>
                </nav>

            </div>
            <section class="small ms-3 text-end">
                <h2 class="sr-only">Votre identité</h2>
                <p class="mb-0">
                    <span class="fas fa-lock" aria-hidden="true"></span>

                    <a href="#">Se connecter</a>

                </p>

            </section>

        </div>

        <div class="row">
            <div class="col-md-5">
                <a href="../accueil" class="vd-logo vd-logo--alt" title="Aller à la page d'accueil du Site du Canton de Vaud">
                    <div class="vd-logo__blason">
                        <img src="../../foehn/svg/logo/logo.svg" class="img-fluid d-none d-md-block" alt="Logo du canton de Vaud" />
                        <img src="../../foehn/svg/logo/logo-square.svg" class="img-fluid d-md-none" aria-hidden="true" alt="Logo du canton de Vaud" />
                    </div>
                    <img src="../../foehn/svg/ETATVAUD.svg" class="vd-logo__image" alt="État de Vaud" aria-hidden="true" />
                </a>

            </div>
            <div class="col-md-5 ms-auto d-print-none">
                <form class="input-group vd-search-form mt-2 mb-4" action="#" role="search">
                    <label class="sr-only" for="search-form" id="search-form-label">Champ de recherche</label>
                    <input id="search-form" type="text" class="form-control" placeholder="Rechercher" aria-describedby="search-form-label">
                    <span class="input-group-btn">
                        <button class="btn" type="submit" aria-label="Rechercher">
                            <i class="fas fa-search" aria-hidden="true"></i>
                        </button>
                    </span>
                </form>

            </div>
        </div>

    </div>

    <div class="vd-nav-primary d-print-none">

        <!-- button -->
        <div class="container">
            <div class="row">
                <div class="col-md-12 d-flex justify-content-md-end">
                    <button type="button" class="btn btn-primary btn-sm vd-nav-primary__button align-self-end js-closeMenuOnMobile__button " data-bs-toggle="collapse" data-bs-target="#nav-primary-container" aria-controls="nav-primary-container" aria-expanded="true">
                        <div class="d-flex justify-content-between">
                            <div>
                                <span class="vd-nav-primary__button--close">Cacher les thèmes</span>
                                <span class="vd-nav-primary__button--open">Afficher les thèmes</span>
                            </div>
                            <div>
                                <span class="vd-nav-primary__button--open fas fa-plus"></span>
                                <span class="vd-nav-primary__button--close fas fa-minus"></span>
                            </div>
                        </div>
                    </button>
                </div>
            </div>
        </div>

        <!-- menu -->
        <div class="vd-nav-primary__menu-container">
            <div class="collapse show js-closeMenuOnMobile__container clearfix" id="nav-primary-container">
                <div class="pb-3">
                    <div class="container vd-nav-primary__menu-bg-md">
                        <div class="vd-nav-primary__menu-bg-sm">
                            <div class="row">
                                <nav class="col-md-8 order-md-1 mt-3" id="nav-primary">
                                    <h2 class="sr-only">Navigation par thèmes</h2>
                                    <ul class="list-unstyled mb-0 row">

                                        <li class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2">
                                            <a href="domaines#culture" class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2 vd-domain-item__link-container">
                                                <span class="vd-domain-item__link vd-link-invisible h4">Culture</span>
                                                <span class="vd-domain-item__text">
                                                    <span class="sr-only">(Exemple de contenu: </span>Aides et subventions, passculture, Musées, Bibliothèques, Patrimoine vaudois, etc.<span class="sr-only">)</span>
                                                </span>
                                            </a>
                                        </li>

                                        <li class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2">
                                            <a href="domaines#economie" class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2 vd-domain-item__link-container">
                                                <span class="vd-domain-item__link vd-link-invisible h4">Economie</span>
                                                <span class="vd-domain-item__text">
                                                    <span class="sr-only">(Exemple de contenu: </span>Registre du commerce, poursuites et faillites, Entreprise, Chômage, Agriculture, développement économique, etc.<span class="sr-only">)</span>
                                                </span>
                                            </a>
                                        </li>

                                        <li class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2">
                                            <a href="domaines#environnement" class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2 vd-domain-item__link-container">
                                                <span class="vd-domain-item__link vd-link-invisible h4">Environnement</span>
                                                <span class="vd-domain-item__text">
                                                    <span class="sr-only">(Exemple de contenu: </span>Subventions pour l’énergie, faune et nature, eaux, forêts, air, développement durable, etc.<span class="sr-only">)</span>
                                                </span>
                                            </a>
                                        </li>

                                        <li class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2">
                                            <a href="domaines#etat%2C%20droit%2C%20finance" class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2 vd-domain-item__link-container">
                                                <span class="vd-domain-item__link vd-link-invisible h4">Etat, Droit, Finance</span>
                                                <span class="vd-domain-item__text">
                                                    <span class="sr-only">(Exemple de contenu: </span>Justice, votations, Egalité, protection des données, Impôts, finances publiques, Etat employeur, statistiques, etc.<span class="sr-only">)</span>
                                                </span>
                                            </a>
                                        </li>

                                        <li class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2">
                                            <a href="domaines#formation" class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2 vd-domain-item__link-container">
                                                <span class="vd-domain-item__link vd-link-invisible h4">Formation</span>
                                                <span class="vd-domain-item__text">
                                                    <span class="sr-only">(Exemple de contenu: </span>Vacances scolaires, scolarité obligatoire, orientation, apprentissage, gymnase, Bourses, etc.<span class="sr-only">)</span>
                                                </span>
                                            </a>
                                        </li>

                                        <li class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2">
                                            <a href="domaines#mobilit%C3%A9" class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2 vd-domain-item__link-container">
                                                <span class="vd-domain-item__link vd-link-invisible h4">Mobilité</span>
                                                <span class="vd-domain-item__text">
                                                    <span class="sr-only">(Exemple de contenu: </span>Automobiles, Routes, navigation, transports publics, mobilités durables, etc.<span class="sr-only">)</span>
                                                </span>
                                            </a>
                                        </li>

                                        <li class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2">
                                            <a href="domaines#sant%C3%A9" class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2 vd-domain-item__link-container">
                                                <span class="vd-domain-item__link vd-link-invisible h4">Santé</span>
                                                <span class="vd-domain-item__text">
                                                    <span class="sr-only">(Exemple de contenu: </span>Prévention, système de santé, dépendances, santé en milieu scolaire, droit des patients, les professionnels de la santé, etc.<span class="sr-only">)</span>
                                                </span>
                                            </a>
                                        </li>

                                        <li class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2">
                                            <a href="domaines#social" class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2 vd-domain-item__link-container">
                                                <span class="vd-domain-item__link vd-link-invisible h4">Social</span>
                                                <span class="vd-domain-item__text">
                                                    <span class="sr-only">(Exemple de contenu: </span>Subside à l’assurance maladie, revenu d’insertion, violence, le RDU, les prestations familles, PC familles, Rente-pont, etc.<span class="sr-only">)</span>
                                                </span>
                                            </a>
                                        </li>

                                        <li class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2">
                                            <a href="domaines#vie%20priv%C3%A9e" class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2 vd-domain-item__link-container">
                                                <span class="vd-domain-item__link vd-link-invisible h4">Vie privée</span>
                                                <span class="vd-domain-item__text">
                                                    <span class="sr-only">(Exemple de contenu: </span>Vacances scolaires, scolarité obligatoire, orientation, apprentissage, gymnase, Bourses, etc.<span class="sr-only">)</span>
                                                </span>
                                            </a>
                                        </li>

                                        <li class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2">
                                            <a href="domaines#s%C3%A9curit%C3%A9" class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2 vd-domain-item__link-container">
                                                <span class="vd-domain-item__link vd-link-invisible h4">Sécurité</span>
                                                <span class="vd-domain-item__text">
                                                    <span class="sr-only">(Exemple de contenu: </span>Police, pénitentiaire, armée, catastrophe, protection de la population, etc.<span class="sr-only">)</span>
                                                </span>
                                            </a>
                                        </li>

                                        <li class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2">
                                            <a href="domaines#territoire" class="vd-domain-item vd-domain-item--small col-sm-6 col-lg-4 mb-2 vd-domain-item__link-container">
                                                <span class="vd-domain-item__link vd-link-invisible h4">Territoire</span>
                                                <span class="vd-domain-item__text">
                                                    <span class="sr-only">(Exemple de contenu: </span>Aménagement, permis de construire, registre foncier, communes, préfectures, dangers naturels, etc.<span class="sr-only">)</span>
                                                </span>
                                            </a>
                                        </li>

                                    </ul>
                                </nav>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>

</header>
<header class="header">
  {% include '@access-nav' %}
  <div class="container">
    <div class="d-flex flex-wrap justify-content-between justify-content-md-end
    d-print-none">
      <div>
        {% render '@nav', nav, true %}
      </div>
      {% render '@login', { styleModifier: 'ms-3 text-end'}, true %}
    </div>
    {% if searchForm %}
      <div class="row">
        <div class="col-md-5">
          {% render '@logo-etat--alternate' %}
        </div>
        <div class="col-md-5 ms-auto d-print-none">
          {% render '@search-form--default', { styleModifier: 'mt-2 mb-4' }, true %}
        </div>
      </div>
    {% else %}
      {% include '@logo-etat' %}
    {% endif %}
  </div>

  {% render '@nav-primary',  {navOpen: true}, true %}

</header>
{
  "domains": {
    "activeDomain": "Economie",
    "domains": [
      {
        "name": "Culture",
        "themes": [
          {
            "name": "Aides et soutiens"
          },
          {
            "name": "Ecole-Musée"
          },
          {
            "name": "Bibliothèque cantonale et universitaire"
          },
          {
            "name": "Musées cantonaux"
          },
          {
            "name": "Patrimoine vaudois"
          },
          {
            "name": "Passculture"
          },
          {
            "name": "Formations artistiques"
          },
          {
            "name": "Cinéma"
          },
          {
            "name": "Assises de la culture"
          }
        ],
        "description": "Aides et subventions, passculture, Musées, Bibliothèques, Patrimoine vaudois, etc."
      },
      {
        "name": "Economie",
        "themes": [
          {
            "name": "Entreprises"
          },
          {
            "name": "Marchés publics"
          },
          {
            "name": "Emploi - Chômage"
          },
          {
            "name": "Développement économique"
          },
          {
            "name": "Tourisme"
          },
          {
            "name": "Agriculture"
          },
          {
            "name": "Protection consommateur"
          },
          {
            "name": "Poursuites et faillites"
          },
          {
            "name": "Registre du commerce"
          },
          {
            "name": "Police du commerce"
          }
        ],
        "description": "Registre du commerce, poursuites et faillites, Entreprise, Chômage, Agriculture, développement économique, etc."
      },
      {
        "name": "Environnement",
        "themes": [
          {
            "name": "Développement durable"
          },
          {
            "name": "Faune et nature"
          },
          {
            "name": "Forêts"
          },
          {
            "name": "Air"
          },
          {
            "name": "Sols"
          },
          {
            "name": "Eaux"
          },
          {
            "name": "Energie"
          },
          {
            "name": "Bruit"
          },
          {
            "name": "Rayonnement"
          },
          {
            "name": "Produits chimiques"
          },
          {
            "name": "Déchets"
          },
          {
            "name": "Sites pollués"
          }
        ],
        "description": "Subventions pour l’énergie, faune et nature, eaux, forêts, air, développement durable, etc."
      },
      {
        "name": "Etat, Droit, Finance",
        "themes": [
          {
            "name": "Lois / Constitution"
          },
          {
            "name": "Votations et élections"
          },
          {
            "name": "Justice"
          },
          {
            "name": "Médiations"
          },
          {
            "name": "Protection des données et transparence"
          },
          {
            "name": "Curatelles et tutelles"
          },
          {
            "name": "Égalité"
          },
          {
            "name": "Impôts"
          },
          {
            "name": "Finances publiques"
          },
          {
            "name": "Affaires extérieures"
          },
          {
            "name": "Personnel de l'État"
          },
          {
            "name": "Statistiques"
          }
        ],
        "description": "Justice, votations, Egalité, protection des données, Impôts, finances publiques, Etat employeur, statistiques, etc."
      },
      {
        "name": "Formation",
        "themes": [
          {
            "name": "Avant l'Ecole"
          },
          {
            "name": "Scolarité obligatoire"
          },
          {
            "name": "Gymnase"
          },
          {
            "name": "Apprentissage"
          },
          {
            "name": "Enseignement supérieur"
          },
          {
            "name": "Orientation"
          },
          {
            "name": "Bourses"
          },
          {
            "name": "Pédagogie spécialisée"
          },
          {
            "name": "Santé à l'école"
          },
          {
            "name": "Jours fériés et vacances scolaires"
          },
          {
            "name": "Schooling"
          },
          {
            "name": "Espace enseignant"
          }
        ],
        "description": "Vacances scolaires, scolarité obligatoire, orientation, apprentissage, gymnase, Bourses, etc."
      },
      {
        "name": "Mobilité",
        "themes": [
          {
            "name": "Mobilité et planification"
          },
          {
            "name": "Mobilité douce"
          },
          {
            "name": "Promotion des mobilités durables"
          },
          {
            "name": "Routes"
          },
          {
            "name": "Transports publics"
          },
          {
            "name": "Automobile"
          },
          {
            "name": "Navigation"
          }
        ],
        "description": "Automobiles, Routes, navigation, transports publics, mobilités durables, etc."
      },
      {
        "name": "Santé",
        "themes": [
          {
            "name": "Actualités"
          },
          {
            "name": "Système de santé"
          },
          {
            "name": "Organisation"
          },
          {
            "name": "Lutte contre les maladies"
          },
          {
            "name": "Prévention"
          },
          {
            "name": "Dépendances"
          },
          {
            "name": "Professionnels"
          }
        ],
        "description": "Prévention, système de santé, dépendances, santé en milieu scolaire, droit des patients, les professionnels de la santé, etc."
      },
      {
        "name": "Social",
        "themes": [
          {
            "name": "Informations sociales"
          },
          {
            "name": "Prestations, assurances et soutien"
          },
          {
            "name": "Vivre à domicile"
          },
          {
            "name": "EMS"
          },
          {
            "name": "Handicaps"
          },
          {
            "name": "Dettes et surendettement"
          },
          {
            "name": "Aide aux victimes et auteur-e-s de violences"
          },
          {
            "name": "Bénévolat"
          }
        ],
        "description": "Subside à l’assurance maladie, revenu d’insertion, violence, le RDU, les prestations familles, PC familles, Rente-pont, etc."
      },
      {
        "name": "Vie privée",
        "themes": [
          {
            "name": "Familles"
          },
          {
            "name": "Enfance et jeunesse"
          },
          {
            "name": "Logement"
          },
          {
            "name": "Contrôle des habitants"
          },
          {
            "name": "Etat civil"
          },
          {
            "name": "Documents d'identité"
          },
          {
            "name": "Population étrangère"
          },
          {
            "name": "Religions"
          },
          {
            "name": "Animaux"
          },
          {
            "name": "Sport"
          },
          {
            "name": "Violence domestique"
          }
        ],
        "description": "Vacances scolaires, scolarité obligatoire, orientation, apprentissage, gymnase, Bourses, etc."
      },
      {
        "name": "Sécurité",
        "themes": [
          {
            "name": "Prévention"
          },
          {
            "name": "Protection de la population"
          },
          {
            "name": "Police"
          },
          {
            "name": "Pompiers"
          },
          {
            "name": "Armée"
          },
          {
            "name": "Protection civile"
          },
          {
            "name": "Pénitentiaire"
          },
          {
            "name": "Catastrophe"
          },
          {
            "name": "Service civil"
          }
        ],
        "description": "Police, pénitentiaire, armée, catastrophe, protection de la population, etc."
      },
      {
        "name": "Territoire",
        "themes": [
          {
            "name": "Aménagement"
          },
          {
            "name": "Améliorations foncières"
          },
          {
            "name": "Opérations foncières"
          },
          {
            "name": "Géologie"
          },
          {
            "name": "Dangers Naturels"
          },
          {
            "name": "Informations sur le territoire"
          },
          {
            "name": "Construction"
          },
          {
            "name": "Registre foncier"
          },
          {
            "name": "Districts / Préfectures"
          },
          {
            "name": "Communes"
          }
        ],
        "description": "Aménagement, permis de construire, registre foncier, communes, préfectures, dangers naturels, etc."
      }
    ]
  },
  "nav": {
    "styleModifier": "small",
    "items": [
      {
        "active": false
      }
    ]
  },
  "searchForm": true,
  "identity": "Jean Villars Gilles",
  "beneficiary": "Commune de Belmont-sur-Lausanne"
}
  • Content:
    @charset 'UTF-8';
    @use "sass:math";
    
    .header {
      padding-top: (math.div($spacer, 1.5));
      background-image: url("../svg/long_pattern_squares_green.svg");
      background-repeat: repeat-x;
      background-position: center top;
      background-size: auto 5px;
    }
    
  • URL: /components/raw/header/_header.scss
  • Filesystem Path: src/components/03-organisms/global/header/_header.scss
  • Size: 251 Bytes

No notes defined.