altinn-designsystem/dist/patterns/02-organismer-70-Modal-innhold-_25-egendefinert-rolle/02-organismer-70-Modal-innhold-_25-egendefinert-rolle.markup-only.html

Altinn Design system based on Pattern Lab.

<!-- START: 02-organismer-70-Modal-innhold-_25-egendefinert-rolle -->
<div class="modal-body a-modal-body">
  <div class="row">
    <div class="col-8">
      <h2 class="a-fontBold a-fontSizeM">
        Opprett rolle
      </h2>
    </div>
    <div class="col-12 col-md-4 mb-1 mb-md-0">
      <!-- START: 00-atomer-03-knapper-10-knapp -->
      <button class="a-btn-link ">
  <span>
    Avbryt
  </span>
</button>

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

    </div>
    <div class="col-12 col-md-6">
      <!-- START: 00-atomer-01-forms-10-tekst-input JS doc: handleFocus.js -->

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

        <label class="a-form-label  " for="text-input-opprett-rolle">Rollenavn:</label>

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


          <input class="form-control  
         " type="text" name="input-field" data-val="true" id="text-input-opprett-rolle">




        </div>


      </div>

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

    </div>
  </div>
  <div class="row">
    <div class="col-12 col-md-6">
      <!-- START: 00-atomer-01-forms-10-tekst-input JS doc: handleFocus.js -->

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

        <label class="a-form-label  " for="text-input-find-13">Legg til rettigheter:</label>

        <div class="a-form-group-items input-group   ">
          <span class="input-group-prepend d-none d-md-block"><!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-document   "    ></i>


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


          <input class="form-control a-js-autocomplete  a-hasIcon 
         a-hasButton  " type="search" placeholder="Finn skjema eller tjeneste" name="input-field" data-val="true" id="text-input-find-13">

          <div class="input-group-append">
            <button 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 class="a-autocomplete-container d-none d-sm-block">
        </div>


      </div>

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

    </div>
  </div>
  <div class="row">
    <div class="col-12">
      <h3 class="a-fontReg a-fontSizeL mt-2">
        Treff på «RF-1030». Velg skjema eller tjeneste:
      </h3>
    </div>
  </div>
  <div class="row">
    <div class="col-12">
      <!-- START: 01-molekyler-05-lister-00-liste-unummerert JS doc: selectableCheckbox.js -->
      <div class="a-list-container ">
        <ul class="a-list    ">
          <li class="a-dotted">
            <div class="row ">
              <div class="col">
                <!-- START: 01-molekyler-05-lister-_00-liste-innhold -->

                Første rad







                <!-- END: 01-molekyler-05-lister-_00-liste-innhold -->

              </div>
            </div>
          </li>
          <li class="a-dotted">
            <div class="row ">
              <div class="col">
                <!-- START: 01-molekyler-05-lister-_00-liste-innhold -->

                Andre rad







                <!-- END: 01-molekyler-05-lister-_00-liste-innhold -->

              </div>
            </div>
          </li>
        </ul>
      </div>

      <!-- END: 01-molekyler-05-lister-00-liste-unummerert -->

    </div>
  </div>
  <div class="row">
    <div class="col mt-3">
      <!-- START: 00-atomer-03-knapper-10-knapp -->
      <button class="a-btn a-btn-success mr-2 mr-2">
  
    Lagre
  
</button>

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

      <!-- START: 00-atomer-03-knapper-10-knapp -->
      <button class="a-btn-link ">
  <span>
    Avbryt
  </span>
</button>

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

    </div>
  </div>
</div>
<!-- END: 02-organismer-70-Modal-innhold-_25-egendefinert-rolle -->