site: landing page for docs.data.altinn.no (design suggestion)

content/_index.md

@@ -1,46 +1,16 @@
 ---
 title: data.altinn.no
-description: data.altinn.no (DAN) er laget for å kunne forenkle deling av data fra virksomheter, med formål om å gjenbruke informasjon direkte fra kilden.
+description: data.altinn.no (DAN) er laget for å kunne forenkle deling av data fra virksomheter, med formål om å gjenbruke informasjon direkte fra kilden.
 weight: 100
-toc: true
 aliases: 
     - /guides/nadobe/
     - /guides/dokumentasjonsbevis/
     - /guides/ebevis
     - /utviklingsguider/data.altinn.no/ebevis
 ---
 
-## Innledning
+data.altinn.no (DAN) gjør det enklere å komme i gang med datadeling, både for datakilder og konsumenter. Gjennom ett generisk API kan ulike _datasett_ hentes rett fra kilden på en måte som sikrer konfidensialitet, integritet og tilgjengelighet.
 
-data.altinn.no (DAN) gjør det enklere å komme i gang med datadeling både for datakilder og konsumenter. Gjennom et enkelt, generisk API kan ulike _datasett_ utveksles på en måte som sikrer konfidensialitet, integritet og tilgjengelighet - selv for datakilder som mangler kapabilitetene som kreves for å kunne dele data med mange konsumenter.
+All uthenting skjer i kontekst av en _tjeneste_, som regulerer hvem som får hente hva og på hvilket grunnlag: hjemmel, samtykke fra en representant for virksomheten i Altinn, eller en kombinasjon. Løsningen brukes i dag av blant annet eBevis for leverandørkvalifisering i offentlige anskaffelser og Tilda for deling av tilsynsdata.
 
-Gjennom å sikre tilganger til ulike konsumentgrupper gjennom rike autorisasjonsregler, f.eks. ved bruk av [Altinns samtykkeløsning](https://altinn.github.io/docs/utviklingsguider/samtykke/), vil informasjonen kunne hentes direkte fra datakilden sikkert og effektivt. 
-
-Løsningen er generisk og vil kunne brukes på ulike forretningsområder, med nye tilknyttede registre og nye brukergrupper.
-
-Denne dokumentasjonen dekker den tekniske bruken av data.altinn.no. Informasjon om kostnader, vilkår, bruksstatistikk og utviklingsplan finner du på [data.altinn.no på Samarbeidsportalen](https://samarbeid.digdir.no/altinn/dataaltinnno/1929), Digdirs felles nettsted for fellesløsningene.
-
-## Tjenester på data.altinn.no
-
-All uthenting av datasett tilgjengeliggjort på data.altinn.no gjøres i kontekst av en _tjeneste_. Tjenestene forteller noe om hvilken sammenheng datauthentingen gjøres i, og regulerer bl.a. autorisasjon. Et eksempel på en slik tjeneste på data.altinn.no er eBevis, som forenkler kvalifisering av leverandører i forbindelse med offentlige anskaffelser. 
-
-Ulike tjenester kan benytte de samme datasettene, men være underlagt andre regler for uthentingen av dataene. F.eks. vil det i noen _tjenestekontekster_ være nødvendig å innhente et samtykke, mens det i andre foreligger hjemmel til å kunne hente dataene direkte.
-
-## Datakilder og datasett
-
-Løsningen baseres på at en aktør kan sende forespørsler på én eller flere _datasett_ (tidligere kalt _beviskoder_). Datasettene er en informasjonspakke som kan inneholde ett eller flere felter med strukturert eller ustrukturert informasjon. Forespørsler inneholder 1) hvem som spør, 2) hvem forespørselen gjelder, og 3) hvilke datasett spørres det om.
-
-## Sikring av data og tilgangskontroll
-
-Løsningen er tilrettelagt for formidling av også ikke-åpne data og personopplysninger. Behandlingsgrunnlaget som kreves for å hente disse dataene oppstår gjennom at konsumenten har en hjemmel til å hente informasjonen, eller at det innhentes samtykke fra en bemyndiget representant for parten det innhentes opplysninger om. 
-
-data.altinn.no tilbyr ulike mekanismer som gjør det mulig for konsumenten å dokumentere at behandlingsgrunnlag foreligger, f.eks. gjennom Altinns samtykkeløsning, gjennom et spesifikt token fra Maskinporten, gjennom et strukturert verifiserbart vedlegg i forespørselen, gjennom å verifisere identiteten til den som utfører forespørselen - eller en kombinasjon av disse.
-
-I de tilfellene hvor datakilder avgir personopplysninger eller andre data som er underlagt taushetsplikt eller andre restriksjoner, kreves det at Digitaliseringsdirektoratet inngår databehandleravtaler med de partene som har behandlingsansvar. 
-
-## Bruk av samtykke
-
-Datasettene som krever samtykke vil igangsette en samtykkeprosess i Altinn. I de tilfeller hvor det skal hentes ut informasjon om en juridisk person, må en representant fra virksomheten, med tilstrekkelig tilgangsnivå, logge seg inn i Altinn-portalen og aktivt samtykke til at dataene skal tilgjengeliggjøres. Varsel om samtykkeforespørsel sendes som en melding til den aktuelle innboksen i Altinn, og inneholder en lenke som lar representanten ta stilling til om samtykke skal gis eller ikke.
-
-* [Mer informasjon om samtykkeprosessen](/samtykkeprosessen)
-* [Rollekrav i Altinn for samtykketjenestene](/rollekrav-i-altinn)
+Denne dokumentasjonen dekker den tekniske bruken. Kostnader, vilkår, bruksstatistikk og utviklingsplan finner du på [data.altinn.no på Samarbeidsportalen](https://samarbeid.digdir.no/altinn/dataaltinnno/1929).

content/om/_index.md

@@ -0,0 +1,42 @@
+---
+title: Om data.altinn.no
+linktitle: Om løsningen
+description: Hva data.altinn.no er, og hvordan tjenester, datasett, tilgangskontroll og samtykke henger sammen.
+weight: 5
+toc: true
+---
+
+## Innledning
+
+data.altinn.no (DAN) gjør det enklere å komme i gang med datadeling både for datakilder og konsumenter. Gjennom et enkelt, generisk API kan ulike _datasett_ utveksles på en måte som sikrer konfidensialitet, integritet og tilgjengelighet - selv for datakilder som mangler kapabilitetene som kreves for å kunne dele data med mange konsumenter.
+
+Gjennom å sikre tilganger til ulike konsumentgrupper gjennom rike autorisasjonsregler, f.eks. ved bruk av [Altinns samtykkeløsning](https://altinn.github.io/docs/utviklingsguider/samtykke/), vil informasjonen kunne hentes direkte fra datakilden sikkert og effektivt. 
+
+Løsningen er generisk og vil kunne brukes på ulike forretningsområder, med nye tilknyttede registre og nye brukergrupper.
+
+Denne dokumentasjonen dekker den tekniske bruken av data.altinn.no. Informasjon om kostnader, vilkår, bruksstatistikk og utviklingsplan finner du på [data.altinn.no på Samarbeidsportalen](https://samarbeid.digdir.no/altinn/dataaltinnno/1929), Digdirs felles nettsted for fellesløsningene.
+
+## Tjenester på data.altinn.no
+
+All uthenting av datasett tilgjengeliggjort på data.altinn.no gjøres i kontekst av en _tjeneste_. Tjenestene forteller noe om hvilken sammenheng datauthentingen gjøres i, og regulerer bl.a. autorisasjon. Et eksempel på en slik tjeneste på data.altinn.no er eBevis, som forenkler kvalifisering av leverandører i forbindelse med offentlige anskaffelser. 
+
+Ulike tjenester kan benytte de samme datasettene, men være underlagt andre regler for uthentingen av dataene. F.eks. vil det i noen _tjenestekontekster_ være nødvendig å innhente et samtykke, mens det i andre foreligger hjemmel til å kunne hente dataene direkte.
+
+## Datakilder og datasett
+
+Løsningen baseres på at en aktør kan sende forespørsler på én eller flere _datasett_ (tidligere kalt _beviskoder_). Datasettene er en informasjonspakke som kan inneholde ett eller flere felter med strukturert eller ustrukturert informasjon. Forespørsler inneholder 1) hvem som spør, 2) hvem forespørselen gjelder, og 3) hvilke datasett spørres det om.
+
+## Sikring av data og tilgangskontroll
+
+Løsningen er tilrettelagt for formidling av også ikke-åpne data og personopplysninger. Behandlingsgrunnlaget som kreves for å hente disse dataene oppstår gjennom at konsumenten har en hjemmel til å hente informasjonen, eller at det innhentes samtykke fra en bemyndiget representant for parten det innhentes opplysninger om. 
+
+data.altinn.no tilbyr ulike mekanismer som gjør det mulig for konsumenten å dokumentere at behandlingsgrunnlag foreligger, f.eks. gjennom Altinns samtykkeløsning, gjennom et spesifikt token fra Maskinporten, gjennom et strukturert verifiserbart vedlegg i forespørselen, gjennom å verifisere identiteten til den som utfører forespørselen - eller en kombinasjon av disse.
+
+I de tilfellene hvor datakilder avgir personopplysninger eller andre data som er underlagt taushetsplikt eller andre restriksjoner, kreves det at Digitaliseringsdirektoratet inngår databehandleravtaler med de partene som har behandlingsansvar. 
+
+## Bruk av samtykke
+
+Datasettene som krever samtykke vil igangsette en samtykkeprosess i Altinn. I de tilfeller hvor det skal hentes ut informasjon om en juridisk person, må en representant fra virksomheten, med tilstrekkelig tilgangsnivå, logge seg inn i Altinn-portalen og aktivt samtykke til at dataene skal tilgjengeliggjøres. Varsel om samtykkeforespørsel sendes som en melding til den aktuelle innboksen i Altinn, og inneholder en lenke som lar representanten ta stilling til om samtykke skal gis eller ikke.
+
+* [Mer informasjon om samtykkeprosessen](/samtykkeprosessen)
+* [Rollekrav i Altinn for samtykketjenestene](/rollekrav-i-altinn)

data/landing.yaml

@@ -0,0 +1,36 @@
+# Landing page (layouts/index.html): the three link groups under the hero.
+# `page` is a content path resolved with .Site.GetPage, so titles follow the
+# front matter (linktitle, then title) unless `title` overrides it here.
+groups:
+  - title: Kom i gang
+    icon: fa-plug
+    text: Integrer systemet ditt med API-et, følg flyten steg for steg og prøv det ut i testmiljøet.
+    links:
+      - page: /api
+        title: Kom i gang med API
+      - page: /api/steg-for-steg
+        title: Fra forespørsel til data, steg for steg
+      - page: /api/oas
+        title: OpenAPI-spesifikasjon
+      - page: /testing
+        title: Testing mot data.altinn.no
+  - title: Tilgang og samtykke
+    icon: fa-lock
+    text: Hjemmel, samtykke og fullmakt gir tilgang til data. Her står hva som kreves i Altinn, og hvordan apper kan bruke løsningen.
+    links:
+      - page: /samtykkeprosessen
+      - page: /rollekrav-i-altinn
+        title: Rollekrav i Altinn
+      - page: /altinnstudio
+  - title: Tjenester og datasett
+    icon: fa-database
+    text: Tjenestene som henter data gjennom data.altinn.no, og datasettene som er tilgjengelige i prod og test.
+    links:
+      - page: /tjenester
+        title: Alle tjenester
+      - page: /tjenester/ebevis
+        title: eBevis
+      - page: /tjenester/tilsynsdata
+        title: Tilda
+      - page: /datasett
+      - page: /ofte-stilte-spørsmål

layouts/index.html

@@ -0,0 +1,123 @@
+{{- /* Landing page for docs.data.altinn.no. Standalone skeleton (no sidebar): shares <head> and the
+      top bar with the doc pages, uses Designsystemet (static/css/designsystemet.css) for cards,
+      buttons and type, and static/css/landing.css for layout. Link groups come from data/landing.yaml. */ -}}
+<!DOCTYPE html>
+<html lang="{{ .Page.Language | default "nb" }}" class="js">
+  <head>
+    {{ partial "head.html" . }}
+  </head>
+  <body class="landing-page" data-url="{{ .RelPermalink }}">
+    {{ partial "topbar.html" . }}
+
+    <main id="content" class="landing">
+
+      <section class="landing-hero" aria-labelledby="landing-title">
+        <div class="landing-wrap">
+          <div class="landing-hero__text">
+          <p class="landing-hero__kicker">Teknisk dokumentasjon</p>
+          <h1 id="landing-title" class="ds-heading landing-hero__title" data-size="xl">Bygg på data.altinn.no</h1>
+          <p class="ds-paragraph landing-hero__lead" data-size="md">{{ .Site.Params.description }}</p>
+          <div class="landing-hero__cta">
+          <div class="landing-hero__actions">
+            <a class="ds-button" data-variant="secondary" href="{{ "/api/" | relURL }}">Kom i gang med API</a>
+            <a class="ds-button" data-variant="secondary" href="{{ "/api/steg-for-steg/" | relURL }}">Steg for steg</a>
+            <a class="ds-button" data-variant="secondary" href="{{ "/datasett/" | relURL }}">Se datasettene</a>
+          </div>
+          {{- if not .Site.Params.noSearch }}
+          <div class="landing-hero__search">
+            {{ partial "search.html" . }}
+          </div>
+          {{- end }}
+          </div>
+          </div>
+        {{- /* Band art: the data.altinn.no market icon (white, as the profile requires on dark
+              surfaces) with the design element beside it: the emblem's circle-and-square shape in
+              the profile's graphic colours, at the right edge and low on the surface. */ -}}
+        <svg class="landing-hero__art" viewBox="0 0 480 360" aria-hidden="true" focusable="false">
+          <defs>
+            <symbol id="de" viewBox="0 0 24.69 24.74">
+              <path d="M19.73,7.06H7.56a.5.5,0,0,0-.5.5V31.3a.5.5,0,0,0,.5.5H19.73a12.37,12.37,0,0,0,0-24.73m1.19,21a8.8,8.8,0,1,1,7.18-7.18,8.8,8.8,0,0,1-7.18,7.18" transform="translate(-7.06 -7.06)"/>
+            </symbol>
+          </defs>
+          <g class="landing-hero__icon" fill="#ffffff" fill-rule="evenodd" transform="translate(14 14) scale(4.4)">
+            <path d="M36.71,18.29l-1.42,1.42,3.3,3.29h-6.65c-.45-3.62-3.32-6.49-6.94-6.94v-4.19c1.73-.44,3-2.01,3-3.87,0-2.21-1.79-4-4-4s-4,1.79-4,4c0,1.86,1.27,3.43,3,3.87v4.19c-1.46.18-2.8.76-3.91,1.62l-3.65-3.65c.36-.59.56-1.29.56-2.03,0-2.21-1.79-4-4-4s-4,1.79-4,4,1.79,4,4,4c.74,0,1.43-.2,2.03-.55l3.65,3.64c-.86,1.11-1.44,2.45-1.62,3.91h-4.19c-.44-1.73-2.01-3-3.87-3-2.21,0-4,1.79-4,4s1.79,4,4,4c1.86,0,3.43-1.28,3.88-3h4.18c.18,1.46.76,2.79,1.62,3.9l-3.68,3.63c-1.54-.91-3.55-.7-4.87.62-1.56,1.56-1.56,4.09,0,5.65s4.09,1.56,5.66,0c1.31-1.31,1.52-3.32.62-4.85l3.68-3.63c1.11.86,2.45,1.44,3.91,1.62v4.21c-1.73.44-3,2.01-3,3.87,0,2.21,1.79,4,4,4s4-1.79,4-4c0-1.86-1.27-3.43-3-3.87v-6.15h-1c-3.31,0-6-2.69-6-6s2.69-6,6-6,5.99,2.68,6,5.99v1.01h8.59l-3.3,3.29,1.42,1.42,5.7-5.71-5.7-5.71ZM12,14c-1.1,0-2-.9-2-2s.9-2,2-2,2,.9,2,2-.89,2-2,2ZM8,26c-1.1,0-2-.9-2-2s.9-2,2-2,2,.9,2,2.01-.9,1.99-2,1.99ZM13.37,37.39c-.78.78-2.04.78-2.83,0-.78-.78-.78-2.05,0-2.83.79-.78,2.05-.78,2.83,0s.78,2.05,0,2.83ZM26,40.02c0,1.1-.9,2-2,2s-2-.9-2-2,.9-2,2-2,2,.9,2,2ZM22,8c0-1.1.9-2,2-2s2,.9,2,2-.9,2-2,2-2-.9-2-2Z"/>
+            <path d="M27.43,31.23c1.04-.5,1.96-1.21,2.7-2.09l-1.53-1.29c-.55.66-1.24,1.19-2.03,1.57l.86,1.81Z"/>
+          </g>
+          <use href="#de" x="240" y="0"   width="120" height="120" fill="#1e98f5"/>
+          <use href="#de" x="360" y="0"   width="120" height="120" fill="#e5aa20" transform="rotate(270 420 60)"/>
+          <use href="#de" x="240" y="120" width="120" height="120" fill="#ffffff" fill-opacity=".12" transform="rotate(180 300 180)"/>
+          <use href="#de" x="360" y="120" width="120" height="120" fill="#f45f63" transform="rotate(90 420 180)"/>
+          <use href="#de" x="120" y="240" width="120" height="120" fill="#1e98f5" transform="rotate(180 180 300)"/>
+          <use href="#de" x="240" y="240" width="120" height="120" fill="#ffffff" fill-opacity=".12" transform="rotate(90 300 300)"/>
+          <use href="#de" x="360" y="240" width="120" height="120" fill="#ffffff" fill-opacity=".12"/>
+        </svg>
+        </div>
+      </section>
+
+      <section class="landing-section" aria-labelledby="landing-groups-title">
+        <div class="landing-wrap">
+          <h2 id="landing-groups-title" class="ds-heading landing-section__title" data-size="md">Finn fram i dokumentasjonen</h2>
+          <div class="landing-cards">
+            {{- range .Site.Data.landing.groups }}
+            <article class="ds-card landing-card">
+              <div class="ds-card__block">
+                <span class="landing-card__icon" aria-hidden="true"><i class="fa {{ .icon }}"></i></span>
+                <h3 class="ds-heading" data-size="xs">{{ .title }}</h3>
+                <p class="ds-paragraph" data-size="sm">{{ .text }}</p>
+              </div>
+              <div class="ds-card__block">
+                <ul class="ds-list--unstyled landing-card__links">
+                  {{- range .links }}
+                    {{- $title := .title }}
+                    {{- with $.Site.GetPage .page }}
+                  <li><a class="ds-link" href="{{ .RelPermalink }}">{{ $title | default .LinkTitle }}</a></li>
+                    {{- else }}
+                      {{- warnf "landing.yaml: page %q not found" .page }}
+                    {{- end }}
+                  {{- end }}
+                </ul>
+              </div>
+            </article>
+            {{- end }}
+          </div>
+        </div>
+      </section>
+
+      <section class="landing-section landing-about" aria-labelledby="landing-about-title">
+        <div class="landing-wrap landing-about__grid">
+          <div>
+            <h2 id="landing-about-title" class="ds-heading landing-section__title" data-size="md">Hva er data.altinn.no?</h2>
+            <div class="landing-prose">{{ .Content }}</div>
+          </div>
+          <div class="landing-about__aside">
+            <h3 class="ds-heading" data-size="2xs">Les mer</h3>
+            <ul class="ds-list--unstyled landing-card__links">
+              {{- with .Site.GetPage "/om" }}
+              <li><a class="ds-link" href="{{ .RelPermalink }}">{{ .Title }}</a></li>
+              {{- end }}
+              <li><a class="ds-link" href="https://samarbeid.digdir.no/altinn/dataaltinnno/1929">data.altinn.no på Samarbeidsportalen</a></li>
+              <li><a class="ds-link" href="https://data.altinn.no">Portalen data.altinn.no</a></li>
+            </ul>
+          </div>
+        </div>
+      </section>
+
+      <section class="landing-section landing-contact" aria-labelledby="landing-contact-title">
+        <div class="landing-wrap">
+          <h2 id="landing-contact-title" class="ds-heading landing-section__title" data-size="md">Spør oss, eller bidra</h2>
+          <p class="ds-paragraph landing-section__intro" data-size="md">Dokumentasjonen er åpen kildekode. Fant du en feil, eller savner du noe? Opprett en sak, still spørsmål i Slack-kanalen vår, send en e-post, eller rett det selv.</p>
+          <div class="landing-contact__actions">
+            <a class="ds-button" data-variant="secondary" data-fullwidth href="https://github.com/data-altinn-no/docs/issues"><i class="fa fa-github" aria-hidden="true"></i> Opprett en sak på GitHub</a>
+            <a class="ds-button" data-variant="secondary" data-fullwidth href="https://join.slack.com/t/digdir-samarbeid/shared_invite/zt-2yp202pnk-PXnfUDQICM3PFDPXfehGiQ"><i class="fa fa-slack" aria-hidden="true"></i> #produkt-data-altinn-no</a>
+            <a class="ds-button" data-variant="secondary" data-fullwidth href="mailto:dan@altinn.no"><i class="fa fa-envelope-o" aria-hidden="true"></i> dan@altinn.no</a>
+            <a class="ds-button" data-variant="secondary" data-fullwidth href="https://github.com/data-altinn-no/docs/blob/master/CONTRIBUTING.md"><i class="fa fa-pencil" aria-hidden="true"></i> Bidra med endringer</a>
+          </div>
+        </div>
+      </section>
+
+    </main>
+
+    {{- partial "footer-content.html" . }}
+    {{- partial "custom-footer.html" . }}
+  </body>
+</html>

layouts/partials/custom-head.html

@@ -1,3 +1,7 @@
 <!-- Partial intended to be overwritten to add CSS -->
-<link href="{{"css/altinndigital.css" | relURL}}" rel="stylesheet"> 
-<link href="{{"css/custom.css" | relURL}}" rel="stylesheet">
+<link href="{{ printf "%s?v=%d" ("css/altinndigital.css" | relURL) now.Unix }}" rel="stylesheet"> 
+<link href="{{ printf "%s?v=%d" ("css/custom.css" | relURL) now.Unix }}" rel="stylesheet">
+{{- if .IsHome }}
+<link href="{{ printf "%s?v=%d" ("css/designsystemet.css" | relURL) now.Unix }}" rel="stylesheet">
+<link href="{{ printf "%s?v=%d" ("css/landing.css" | relURL) now.Unix }}" rel="stylesheet">
+{{- end }}