altinn-designsystem/dist/patterns/02-organismer-50-ekspanderbart-panel-_60-andre-med-rettigheter/02-organismer-50-ekspanderbart-panel-_60-andre-med-rettigheter.markup-only.html

Altinn Design system based on Pattern Lab.

<!-- START: 02-organismer-50-ekspanderbart-panel-_60-andre-med-rettigheter JS doc: cardsToggle.js, truncateLines.js, togglePanel.js -->
<div class="card a-accordion-card a-collapsePanel ">
  <div class="card-header a-js-index-heading a-collapsePanel-heading collapsed " id="othersWithRightsHeader" role="tab">
    <a href="#" data-toggle="collapse" data-target="#andremedrettigheter" aria-expanded="false" aria-controls="andremedrettigheter" data-parent="#accordion">
      <!-- START: 01-molekyler-00-tekst-30-ikon-tekst -->
      <div class="a-iconText a-iconText-shadow a-iconText-large a-collapseBtn collapsed ">
        <div class="a-iconText-icon ">
          <!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
          <i class="reg reg-corp  a-icon "></i>


          <!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
        </div>
        <div class="a-iconText-text">
          <span class="a-iconText-text-large">Andre med rettigheter  </span>
        </div>
      </div>

      <!-- END: 01-molekyler-00-tekst-30-ikon-tekst -->

    </a>
  </div>
  <div id="andremedrettigheter" class="a-collapsePanel-body no-background collapse " role="tabpanel" aria-labelledby="othersWithRightsHeader">
    <div class="pr-4 pl-2 py-1 text-sm-right a-collapsePanel-body-secondary">
      <!-- START: 00-atomer-02-lenker-00-link -->
      <a href="/patterns/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-aktivitetslogg/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-aktivitetslogg.html" class=" ">
  Aktivitetslogg
  
</a>
      <!-- END: 00-atomer-02-lenker-00-link -->

    </div>

    <!-- START: 01-molekyler-04-grupper-01-grupperte-fremhevede-knapper JS doc: cardsToggle.js, truncateLines.js -->
    <div class="a-noColPadding clearfix" role="list">
      <div class="d-flex float-left col-6 col-md-4 col-lg-3 col-xl-2" role="listitem">
        <!-- START: 00-atomer-03-knapper-31-knapp-fremhevet-stor JS doc: cardsToggle.js, truncateLines.js -->
        <button type="button" class="a-box-button" onclick="location.href='/patterns/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-roller-oversikt/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-roller-oversikt.html';">
  <span class="a-box-button-text">
    <span class="a-meta-text">
      REGNSKAPSFØRER
    </span>
    <span class="a-box-button-name">
      <span class="sr-only">
        PERNILLE HALL
      </span>
      <span class="a-js-inner-text" aria-hidden="true" >
        PERNILLE HALL
      </span>
    </span>
  </span>

  <!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-private ai-lg a-box-button-icon a-blueDarkText "    ></i>


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


  <span class="a-box-button-action a-blueDarkText a-box-button-primaryAction">
    Gi og fjerne rettigheter
  </span>
  <span class="a-box-button-action a-blueDarkText a-box-button-secondaryAction">
    Skjul alle med rettigheter
  </span>
</button>
        <!-- END: 00-atomer-03-knapper-31-knapp-fremhevet-stor -->

      </div>
      <div class="d-flex float-left col-6 col-md-4 col-lg-3 col-xl-2" role="listitem">
        <!-- START: 00-atomer-03-knapper-31-knapp-fremhevet-stor JS doc: cardsToggle.js, truncateLines.js -->
        <button type="button" class="a-box-button" onclick="location.href='/patterns/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-roller-oversikt/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-roller-oversikt.html';">
  <span class="a-box-button-text">
    <span class="a-meta-text">
      STYRE LEDER
    </span>
    <span class="a-box-button-name">
      <span class="sr-only">
        TUVA LANDRO
      </span>
      <span class="a-js-inner-text" aria-hidden="true" >
        TUVA LANDRO
      </span>
    </span>
  </span>

  <!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-private ai-lg a-box-button-icon a-blueDarkText "    ></i>


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


  <span class="a-box-button-action a-blueDarkText a-box-button-primaryAction">
    Gi og fjerne rettigheter
  </span>
  <span class="a-box-button-action a-blueDarkText a-box-button-secondaryAction">
    
  </span>
</button>
        <!-- END: 00-atomer-03-knapper-31-knapp-fremhevet-stor -->

      </div>
      <div class="d-flex float-left col-6 col-md-4 col-lg-3 col-xl-2" role="listitem">
        <!-- START: 00-atomer-03-knapper-31-knapp-fremhevet-stor JS doc: cardsToggle.js, truncateLines.js -->
        <button type="button" class="a-box-button" onclick="location.href='/patterns/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-roller-oversikt/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-roller-oversikt.html';">
  <span class="a-box-button-text">
    <span class="a-meta-text">
      DAGLIG LEDER
    </span>
    <span class="a-box-button-name">
      <span class="sr-only">
        INGRID AGA
      </span>
      <span class="a-js-inner-text" aria-hidden="true" >
        INGRID AGA
      </span>
    </span>
  </span>

  <!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-private ai-lg a-box-button-icon a-blueDarkText "    ></i>


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


  <span class="a-box-button-action a-blueDarkText a-box-button-primaryAction">
    Gi og fjerne rettigheter
  </span>
  <span class="a-box-button-action a-blueDarkText a-box-button-secondaryAction">
    
  </span>
</button>
        <!-- END: 00-atomer-03-knapper-31-knapp-fremhevet-stor -->

      </div>
      <div class="d-flex float-left col-6 col-md-4 col-lg-3 col-xl-2" role="listitem">
        <!-- START: 00-atomer-03-knapper-31-knapp-fremhevet-stor JS doc: cardsToggle.js, truncateLines.js -->
        <button type="button" class="a-box-button" onclick="location.href='/patterns/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-roller-oversikt/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-roller-oversikt.html';">
  <span class="a-box-button-text">
    <span class="a-meta-text">
      REGNSKAPSFØRER
    </span>
    <span class="a-box-button-name">
      <span class="sr-only">
        Julius Andreas Gimli Arn MacGyver Chewbacka Highlander Elessar-Jankov
      </span>
      <span class="a-js-inner-text" aria-hidden="true"  title="Julius Andreas Gimli Arn MacGyver Chewbacka Highlander Elessar-Jankov" >
        Julius Andreas Gimli Arn MacGyver Chewbacka Highlander Elessar-Jankov
      </span>
    </span>
  </span>

  <!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-private ai-lg a-box-button-icon a-blueDarkText "    ></i>


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


  <span class="a-box-button-action a-blueDarkText a-box-button-primaryAction">
    Gi og fjerne rettigheter
  </span>
  <span class="a-box-button-action a-blueDarkText a-box-button-secondaryAction">
    
  </span>
</button>
        <!-- END: 00-atomer-03-knapper-31-knapp-fremhevet-stor -->

      </div>
      <div class="d-flex float-left col-6 col-md-4 col-lg-3 col-xl-2" role="listitem">
        <!-- START: 00-atomer-03-knapper-31-knapp-fremhevet-stor JS doc: cardsToggle.js, truncateLines.js -->
        <button type="button" class="a-box-button" aria-expanded="false" aria-owns="firstChildContainer" data-toggle="instant" data-target="#firstChildContainer">
  <span class="a-box-button-text">
    <span class="a-meta-text">
      REVISOR
    </span>
    <span class="a-box-button-name">
      <span class="sr-only">
        FJELLSTRAND REGNSKAP
      </span>
      <span class="a-js-inner-text" aria-hidden="true" >
        FJELLSTRAND REGNSKAP
      </span>
    </span>
  </span>

  <!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-corp ai-lg a-box-button-icon "    ></i>


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


  <span class="a-box-button-action a-blueDarkText a-box-button-primaryAction">
    Se alle med rettigheter
  </span>
  <span class="a-box-button-action a-blueDarkText a-box-button-secondaryAction">
    Skjul alle med rettigheter
  </span>
</button>
        <!-- END: 00-atomer-03-knapper-31-knapp-fremhevet-stor -->

      </div>
      <div role="list" class="a-childBoxButtonList" id="firstChildContainer" style="display: none">
        <div role="listitem" class="d-flex float-left col-6 col-md-4 col-lg-3 col-xl-2">
          <!-- START: 00-atomer-03-knapper-31-knapp-fremhevet-stor JS doc: cardsToggle.js, truncateLines.js -->
          <button type="button" class="a-box-button" onclick="location.href='/patterns/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-roller-oversikt/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-roller-oversikt.html';">
  <span class="a-box-button-text">
    <span class="a-meta-text">
      REVISOR
    </span>
    <span class="a-box-button-name">
      <span class="sr-only">
        FJELLSTRAND REGNSKAP
      </span>
      <span class="a-js-inner-text" aria-hidden="true" >
        FJELLSTRAND REGNSKAP
      </span>
    </span>
  </span>

  <!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-corp ai-lg a-box-button-icon a-blueDarkText "    ></i>


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


  <span class="a-box-button-action a-blueDarkText a-box-button-primaryAction">
    Gi og fjerne rettigheter
  </span>
  <span class="a-box-button-action a-blueDarkText a-box-button-secondaryAction">
    Skjul alle med rettigheter
  </span>
</button>
          <!-- END: 00-atomer-03-knapper-31-knapp-fremhevet-stor -->

        </div>
        <div role="listitem" class="d-flex float-left col-6 col-md-4 col-lg-3 col-xl-2">
          <!-- START: 00-atomer-03-knapper-31-knapp-fremhevet-stor JS doc: cardsToggle.js, truncateLines.js -->
          <button type="button" class="a-box-button" onclick="location.href='/patterns/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-roller-oversikt/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-roller-oversikt.html';">
  <span class="a-box-button-text">
    <span class="a-meta-text">
      REVISOR
    </span>
    <span class="a-box-button-name">
      <span class="sr-only">
        KENNETH HOGNESTAD
      </span>
      <span class="a-js-inner-text" aria-hidden="true" >
        KENNETH HOGNESTAD
      </span>
    </span>
  </span>

  <!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-private ai-lg a-box-button-icon a-blueDarkText "    ></i>


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


  <span class="a-box-button-action a-blueDarkText a-box-button-primaryAction">
    Gi og fjerne rettigheter
  </span>
  <span class="a-box-button-action a-blueDarkText a-box-button-secondaryAction">
    Skjul alle med rettigheter
  </span>
</button>
          <!-- END: 00-atomer-03-knapper-31-knapp-fremhevet-stor -->

        </div>
        <div role="listitem" class="d-flex float-left col-6 col-md-4 col-lg-3 col-xl-2">
          <!-- START: 00-atomer-03-knapper-31-knapp-fremhevet-stor JS doc: cardsToggle.js, truncateLines.js -->
          <button type="button" class="a-box-button" onclick="location.href='/patterns/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-roller-oversikt/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-roller-oversikt.html';">
  <span class="a-box-button-text">
    <span class="a-meta-text">
      REVISOR
    </span>
    <span class="a-box-button-name">
      <span class="sr-only">
        LISE GAUSDAL
      </span>
      <span class="a-js-inner-text" aria-hidden="true" >
        LISE GAUSDAL
      </span>
    </span>
  </span>

  <!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-private ai-lg a-box-button-icon a-blueDarkText "    ></i>


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


  <span class="a-box-button-action a-blueDarkText a-box-button-primaryAction">
    Gi og fjerne rettigheter
  </span>
  <span class="a-box-button-action a-blueDarkText a-box-button-secondaryAction">
    Skjul alle med rettigheter
  </span>
</button>
          <!-- END: 00-atomer-03-knapper-31-knapp-fremhevet-stor -->

        </div>
      </div>
      <div role="listitem" class="d-flex float-left col-6 col-md-4 col-lg-3 col-xl-2">
        <!-- START: 00-atomer-04-handlingsknapper-21-handlingsknapp-stor -->
        <button type="button" class="a-boxAddBtn" onclick="location.href='/patterns/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-legg-til/04-sider-portal-92-andre-med-rettigheter-00-andre-med-rettigheter-legg-til.html';">
  <span class="a-boxAddBtn-inner">
    Legg til person
    <!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-plus ai-lg a-box-button-icon a-blueDarkText "    ></i>


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

    eller virksomhet
  </span>
</button>

        <!-- END: 00-atomer-04-handlingsknapper-21-handlingsknapp-stor -->

      </div>
    </div>

    <!-- END: 01-molekyler-04-grupper-01-grupperte-fremhevede-knapper -->


    <!-- case when there are no cards with rights -->
    <div class="d-none">
      <div class="clearfix">
        <!-- START: 00-atomer-07-tekst-00-varsel -->
        <div id="alert-no-arrow" class="a-message a-message-info a-message--arrow-off a-message--fullwidth ">
          <!-- START: 00-atomer-07-tekst-_00-varsel-innhold -->

          Dette er en driftsmelding eller endringsinformasjon



          <!-- END: 00-atomer-07-tekst-_00-varsel-innhold -->

        </div>

        <!-- END: 00-atomer-07-tekst-00-varsel -->

      </div>

      <div class="mt-1 mx-1">
        <!-- START: 00-atomer-04-handlingsknapper-19-♺-handlingsknapp-full-bredde -->
        <!-- START: 00-atomer-04-handlingsknapper-17-handlingsknapp -->
        <button type="button" class="a-btn a-btn-action a-fullWidthBtn py-1">

    <!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-plus   "    ></i>


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

    <span>Legg til ny person eller virksomhet</span>

</button>

        <!-- END: 00-atomer-04-handlingsknapper-17-handlingsknapp -->

        <!-- END: 00-atomer-04-handlingsknapper-19-♺-handlingsknapp-full-bredde -->

      </div>
    </div>
  </div>
</div>

<!-- END: 02-organismer-50-ekspanderbart-panel-_60-andre-med-rettigheter -->