UNPKG

altinn-designsystem

Version:

Altinn Design system based on Pattern Lab.

294 lines (219 loc) 11.7 kB
<!-- START: 04-sider-portal-93-samtykke-01-gi-samtykke --> <!-- START: 03-maler-portal-91-modal-01-modal --> <div class="a-modal fade modal show " tabindex="-1" role="dialog" style="display: block"> <div class="modal-dialog modal-lg" role="document"> <div class="container a-p-static"> <div class="row"> <div class="col-xl-12"> <!-- START: 02-organismer-01-globale-10-subheader --> <header class="a-header "> <div class="container"> <div class="row"> <div class="col-12"> <nav id="primary-nav" class="a-globalNav float-left"> <a href="&#x2F;patterns&#x2F;04-sider-infoportal-01-forside-02-forside-innlogget\04-sider-infoportal-01-forside-02-forside-innlogget.html" class="a-globalNav-logo"> <!-- START: 00-atomer-09-bilder-og-media-01-logo --> <img src="..&#x2F;..&#x2F;images&#x2F;a-logo-black.svg" alt="Altinn logo" class="a-logo a-modal-top-logo "> <!-- END: 00-atomer-09-bilder-og-media-01-logo --> <span class="sr-only">Til forsiden</span></a> </nav> <ul id="secondary-nav" class="nav nav-pills a-header-options"> <li class="nav-item"> <!-- START: 00-atomer-07-tekst-40-innlogget --> <button class="nav-link dropdown-toggle a-personSwitcher logged-in subheader-dark " type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" title="JAN PETTERSEN "> <span class="a-personSwitcher-name"> <span class="d-block">JAN PETTERSEN</span> <span class="d-block"></span> </span> <!-- START: 00-atomer-09-bilder-og-media-15-ikon --> <i class="ai ai-private-circle-big a-personSwitcher-icon a-js-onboardingTarget-1 " ></i> <span class="sr-only">Min profil</span> <!-- END: 00-atomer-09-bilder-og-media-15-ikon --> </button> <!-- END: 00-atomer-07-tekst-40-innlogget --> <!-- START: 02-organismer-30-seksjoner-30-meny-personbytte --> <!-- Begin #a-dropdown-personswitchList - --> <div class="dropdown-menu a-dropdown-personswitchList a-dropdownTriangle"> <div class="pt-5 pl-3 pr-3"> <!-- START: 00-atomer-02-lenker-00-link --> <a href="/patterns/04-sider-infoportal-01-forside-00-forside/04-sider-infoportal-01-forside-00-forside.html" class="a-link-logout "> Logg ut </a> <!-- END: 00-atomer-02-lenker-00-link --> <div class="row"> <div class="col-sm-12 mb-2"> <!-- START: 01-molekyler-00-tekst-01-person-privat --> <div class="a-personRole"> <!-- START: 00-atomer-09-bilder-og-media-15-ikon --> <i class="ai ai-private ai-lg "></i> <!-- END: 00-atomer-09-bilder-og-media-15-ikon --> <div class="a-personRole-text " title="JAN PETTERSEN"> <span class="a-personRole-name">JAN PETTERSEN</span> <span class="a-personRole-role"></span> </div> </div> <!-- END: 01-molekyler-00-tekst-01-person-privat --> </div> </div> <p class="a-h3"> Er dette ikke deg? </p> <!-- START: 00-atomer-03-knapper-10-knapp --> <button type="button" class="a-btn mb-5 mt-1 "> Bytt bruker </button> <!-- END: 00-atomer-03-knapper-10-knapp --> </div> </div> <!-- END: 02-organismer-30-seksjoner-30-meny-personbytte --> </li> </ul> </div> </div> </div> </header> <!-- END: 02-organismer-01-globale-10-subheader --> </div> </div> <div class="row"> <div class="col-xl-10 offset-xl-1 a-p-static"> <div class="a-modal-content-target"> <div class="a-page a-current-page"> <div class="modalPage"> <div class="modal-content"> <!-- START: 01-molekyler-20-modalelementer-15-modal-body-header --> <div class="modal-header a-modal-header"> <!-- START: 01-molekyler-00-tekst-30-ikon-tekst --> <div class="a-iconText a-iconText-background a-iconText-background--white a-iconText-large "> <div class="a-iconText-icon "> <!-- START: 00-atomer-09-bilder-og-media-15-ikon --> <i class="ai ai-read a-icon a-icon-circle "></i> <!-- END: 00-atomer-09-bilder-og-media-15-ikon --> </div> <h1 class="a-iconText-text mb-0"> <span class="a-iconText-text-large">Samtykke til bruk av dine data </span> </h1> </div> <!-- END: 01-molekyler-00-tekst-30-ikon-tekst --> </div> <!-- END: 01-molekyler-20-modalelementer-15-modal-body-header --> <!-- START: 02-organismer-70-Modal-innhold-20-se-og-fjern-samtykke --> <div class="modal-body a-modal-body"> <div class="row"> <div class="col"> <h2 class="a-fontSizeS a-fontBold"> Altinn1 ANS ønsker midlertidig innsyn </h2> <p class="a-fontSizeXS mb-1"> Velkommen til samtykkeløsningen </p> </div> </div> <div class="row"> <div class="col"> <h2 class="mt-2 mb-0 a-fontSizeS"> Følgende informasjon er omfattet av samtykket: </h2> <!-- START: 00-atomer-05-Ekspansjonsknapper-26-ekspanderbar-tekst JS doc: toggleFilter.js --> <a data-toggle="collapse" href="#" data-target="#myidtesting" aria-expanded="true" aria-controls="myidtesting" class="a-collapse-title a-collapse-title--flexstart a-fontSizeXS a-fontBold mt-1 no-decoration "> <span class="a-dropdownArrow"></span> <span class="primary-collapse-text"> Denne teksten kan man trykke på for å se utvidet informasjon om et tema </span> </a> <!-- END: 00-atomer-05-Ekspansjonsknapper-26-ekspanderbar-tekst --> <div id="myidtesting" class="a-collapse-body collapse show" aria-expanded="true" role="tabpanel" class="collapse show"> <p class="a-fontSizeXS pt-1 mb-0 pb-1"> Tekst 1 </p> </div> </div> </div> <div class="row"> <div class="col"> <p class="mt-2 a-fontBold a-fontSizeXS mb-1"> Dette innsynet er tidsavgrenset og vil gå ut 2099-01-01 23:59:59 </p> </div> </div> <div class="row"> <div class="col mt-3"> <!-- START: 00-atomer-03-knapper-10-knapp --> <button type="button" class="a-btn a-btn-success mr-1 "> Gi samtykke </button> <!-- END: 00-atomer-03-knapper-10-knapp --> <!-- START: 00-atomer-03-knapper-10-knapp --> <button type="button" class="a-btn "> Nei, jeg vil ikke gi samtykke </button> <!-- END: 00-atomer-03-knapper-10-knapp --> </div> </div> </div> <!-- END: 02-organismer-70-Modal-innhold-20-se-og-fjern-samtykke --> <!-- START: 02-organismer-70-Modal-innhold-13-oppdater-lagrede-sok --> <div class="modal-body a-modal-body"> <div class="row"> <div class="col-12"> <h2 class="a-h3 mt-2"> </h2> </div> </div> <div class="row"> <div class="col-12"> <div class="a-modal-receiptContent pt-1 mb-3"> <p>Du videresender til </p> <p>(doris.kahn@gmail.com)</p> </div> </div> </div> <div class="row"> <div class="col"> <!-- START: 00-atomer-03-knapper-10-knapp --> <button type="button" class="a-btn "> Videresend </button> <!-- END: 00-atomer-03-knapper-10-knapp --> </div> </div> </div> <!-- END: 02-organismer-70-Modal-innhold-13-oppdater-lagrede-sok --> </div> </div> </div> </div> </div> </div> </div> </div> </div> <!-- START: 01-molekyler-06-hjelp-00-hjelp-container --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- Should be included for pages that has quickhelp --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - --> <div class="a-stickyHelp-container"> <!-- Open-button for .a-iframeToggle --> <!-- HELP ANIMATION: On pages that have help in context (step for step guide), add class "a-stickyHelp-animationHint" when users has not been active for 10 seconds --> <button type="button" class="a-btn a-stickyHelp-open collapsed" data-toggle="collapse" data-target="#a-iframeToggle" aria-expanded="false" aria-controls="a-iframeToggle"> <span class="sr-only a-stickyHelp-openText">Trenger du hjelp</span> <i>?</i> </button> <div id="a-iframeToggle" class="a-iframeToggle collapse"> <!-- Close-button for .a-iframeToggle --> <button type="button" class="a-stickyHelp-close" data-toggle="collapse" data-target="#a-iframeToggle" data-action="close" aria-expanded="true" aria-controls="a-iframeToggle"> <!-- START: 00-atomer-09-bilder-og-media-15-ikon --> <i class="ai ai-exit ai-sm " id="close-stickyHelp" ></i> <span class="sr-only">Minimer hjelpevinduet</span> <!-- END: 00-atomer-09-bilder-og-media-15-ikon --> </button> <iframe class="a-js-stickyHelpFrame" data-src="../../&#x2F;patterns&#x2F;04-sider-infoportal-70-hurtighjelp-60-hurtighjelp\04-sider-infoportal-70-hurtighjelp-60-hurtighjelp.html"></iframe> </div> </div> <!-- - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- End quickhelp --> <!-- - - - - - - - - - - - - - - - - - - - - - - - - --> <!-- END: 01-molekyler-06-hjelp-00-hjelp-container --> <!-- END: 03-maler-portal-91-modal-01-modal --> <!-- END: 04-sider-portal-93-samtykke-01-gi-samtykke -->