altinn-designsystem/dist/patterns/02-organismer-01-globale-90-header-altinnett/02-organismer-01-globale-90-header-altinnett.markup-only.html

Altinn Design system based on Pattern Lab.

<!-- START: 02-organismer-01-globale-90-header-altinnett -->
<!-- Skip to main content -->
<nav class="a-jumpnav">
  <ul class="no-decoration d-flex">
    <li><a class="sr-only sr-only-focusable" href="#content">Hopp til hovedinnholdet</a></li>
    <li><a class="sr-only sr-only-focusable" href="#primary-nav">Hopp til hovedmeny</a></li>
    <li><a class="sr-only sr-only-focusable" href="#search">Hopp til søk</a></li>
  </ul>
</nav>

<!-- Begin .header -->
<header class="a-header an-header   a-js-hideElement ">
  <!-- Begin .container -->
  <div class="container">
    <div class="row">
      <div class="col-12">

        <!-- Begin .a-globalNav -->
        <nav id="primary-nav" class="a-globalNav">
          <a href="&#x2F;patterns&#x2F;04-sider-altinnett-10-forside-10-forside&#x2F;04-sider-altinnett-10-forside-10-forside.html" class="a-globalNav-logo">
                        <img src="..&#x2F;..&#x2F;images&#x2F;an-logo-blue.svg" alt="Altinnett logo" class="a-logo  ">
                        <span class="sr-only">Til forsiden</span>
                    </a>
          <button class="an-navbar-toggler" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                      <span class="sr-only">Vis/skjul meny</span>
                    </button>

          <!-- START: 02-organismer-30-seksjoner-80-altinnett-navigasjonsmeny-dropdown -->
          <!-- Begin #a-dropdown-personswitchList - -->
          <div class="dropdown-menu an-dropdown-navigationMenu a-dropdownTriangle an-menu-container an-menu-logged-out">
            <ul class="a-list an-menu">
              <li>
                <!-- START: 00-atomer-01-forms-10-tekst-input JS doc: handleFocus.js -->

                <div class="form-group a-form-group   pt-1 px-1">

                  <label class="a-form-label  sr-only  " for="dropdown-input-search">Søk etter innhold</label>

                  <div class="a-form-group-items input-group   ">


                    <input class="form-control  
         a-hasButton  " type="search" placeholder="Søk etter innhold" name="input-field" data-val="true" id="dropdown-input-search">

                    <div class="input-group-append">
                      <button onclick="location.href='/patterns/04-sider-altinnett-60-sok-10-sok-forside/04-sider-altinnett-60-sok-10-sok-forside.html';" class="btn btn-secondary" type="button">
              <!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-search   "    ></i>


<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->

              <span class="sr-only">Søk</span>
          </button>
                    </div>



                  </div>


                </div>

                <!-- END: 00-atomer-01-forms-10-tekst-input -->

              </li>


              <li>
                <a class=" pr-2" href="#">verktøy</a>
              </li>

              <li>
                <a class=" pr-2" href="&#x2F;patterns&#x2F;03-maler-altinnett-80-produktsider-10-produktoversikt&#x2F;03-maler-altinnett-80-produktsider-10-produktoversikt.html">produkter</a>
              </li>

              <li>
                <a class=" pr-2" href="#">resultater</a>
              </li>

              <li>
                <a class=" pr-2" href="#">kom i gang</a>
              </li>
            </ul>

            <div class="mt-1 mx-1">
              <!-- START: 00-atomer-03-knapper-10-knapp -->
              <button type="button" onclick="location.href='/patterns/03-maler-altinnett-20-profil-30-paalogget/03-maler-altinnett-20-profil-30-paalogget.html'" class="a-btn btn-block ">
  
    Logg inn
  
</button>

              <!-- END: 00-atomer-03-knapper-10-knapp -->

            </div>
          </div>

          <!-- END: 02-organismer-30-seksjoner-80-altinnett-navigasjonsmeny-dropdown -->

        </nav>
        <!-- End .a-globalNav -->
      </div>
      <!-- End .col -->

    </div>
    <!-- End .row -->

  </div>
  <!-- End .container -->
</header>
<!-- End .header -->

<!-- END: 02-organismer-01-globale-90-header-altinnett -->