Release notes

Nedenfor vises release notes — en opsummering af bug fixes, nye features og andre opdateringer.

Versionering og release-proces

Designsystemets måde at versionere på er inspireret af semantisk versionering. Versionsnummeret indikerer, hvilken type rettelse, der er tale om.

Versionsnummeret skrives altid x.y.z (fx 2.1.3) og skal læses MAJOR (x), MINOR (y), PATCH (z)

• MAJOR: Ændringer i kode og/eller design, der ikke er bagud-kompatible - som fx erstatning eller sletning af komponenter eller ændringer i kode og/eller design, der medfører bagudrettede tilpasninger ved opdatering til den pågældende version.
• MINOR: Tilføjelser, ændringer og ny funktionalitet, der er bagud-kompatible.
• PATCH: Bagud-kompatible fejlrettelser (bug fixes).

Release-proces

Designsystemet er “levende” og skal holdes ajour, hvorfor langt de fleste bagud-kompatible ændringer og tilføjelser vil ske løbende. Fejlrettelser vil ske hurtigst muligt. Ikke bagud-kompatible ændringer vil samles op og blive releaset med lavere frekvens.

Har du et nyt forslag til en feature eller et bug fix? Så må du meget gerne oprette et issue på GitHub

Tidligere versioner af dokumentationen

Har du brug for at se en version af dokumentationen på designsystem.dk, som stemmer overens med en tidligere release, så er du velkommen til at kontakte os.

Version 10.1.0

Som noget nyt introducerer vi en beslutningslog, der fremover skal supplere den aktuelle release. Her vil der være detaljer og baggrund om de valg, der er truffet.

Se beslutningslog for version 10.1.0.

• New Tilføjet paginering til tabeller.
• Change Fjernet role="presentation" fra “…“-elementerne.
• Change Tilføjet en skærmlæserbesked til “…“-elementerne.
• Visuelt løft af pagineringsknapperne.
• Fjernet klassen pagination__dropdown, der ikke blev anvendt.

• Change Flyttet knapperne i tabeller med valgbare rækker og funktionsknapper ned under tabellen i HTML’en, så de ikke scroller horisontalt, hvis tabellen har mange kolonner.
• Change Tilføjet tabindex og synligt fokus til tabeller, så det er muligt at navigere til og scrolle brede tabeller med tastaturet.
• Change Ændret beskeden “Vælg en eller flere rækker” til “Ingen rækker valgt” og tilføjet den til alle tabeller med valgbare rækker.
• Tilføjet padding i tabeller uden ramme og strukturerede lister, så de har samme padding som de øvrige tabeltyper.
• Tilføjet kant til bunden af tabelrækkerne på store skærme, når varianterne tabeller uden ramme og tabeller med zebralinjer kombineres.
• Klassen table--borderless kan nu også anvendes sammen med klassen table-actions (og den nye tabelpaginering), hvis man anvender tabeller uden ramme sammen med funktionsknapper.
• Rettet fejl, hvor tjekboksen i headeren for tabeller med valgbare rækker ikke fik den korrekte status i JavaScripten.

• Change Rettet en stylingfejl, som opstod, når man anvendte inputfelter med prefix eller suffix, som samtidigt var read-only eller disabled. Tilføj klassen disabled eller readonly til form-input-wrapper for at få den korrekte styling.
• Change Fjernet klassen search-link, der satte en alternativ styling tiltænkt overskrifter på søgeresultatsider. Der er nu ikke længere forskel på linkoverskifter, uanset om de anvendes i søgeresultateter eller ej. Hvis man anvender klassen i sin løsning, kan man blot fjerne den, da den ikke længere har nogen effekt.
• Opdateret pakkerne i package.json til nyere versioner. Dette har medført en tilretning i flere sass-filer, så der ikke er deklarationer blandet med indlejrede regler eller anvendelse af globale built-in Sass-funktioner. Rækkefølgen af visse deklarationer i CSS-filerne er derfor ændret, men dette har ikke nogen funktionel betydning.
• Opdateret siderne for radioknapper og tjekbokse med flere eksempler og retningslinjer.
• Rettet eksemplerne for dropdown, så de alle indeholder en “vælg”-mulighed.
• Ændret opførsel for overflowmenu, så komponenten lukker, når fokus forsvinder fra menuen. Dette kan for eksempel ske, ved at brugeren navigerer videre med Tab-tasten.

Version 10.0.2

• Fjernet visse browseres modificeringer af søgefeltet, der kunne indsætte knapper til sletning af søgning, søgehistorik eller ekstra padding. For mere info, se issue #237 på GitHub.
• Tilføjet ikonerne chevron-double-left, chevron-double-right og file-upload til filen ‘all-svg-icons.svg’. For mere info, se issue #243 på GitHub.
• Rettet fejl i headeren, hvor variablerne $header-portal-logo-width og $header-portal-logo-height ikke blev anvendt. For mere info, se issue #245 på GitHub.
• Rettet fejl, hvor pilen i detaljekomponenten kun var delvist synlig ved tekstforstørrelse.
• Rettet fejl, hvor prikkerne i lister med punktopstilling kom for tæt på teksten ved tekstforstørrelse.

Version 10.0.1

• Ændret baggrundsfarven på fokuserede accordions fra gennemsigtig til grå.
• Rettet fejl, hvor teksten i sprogvælger med tooltip stod skævt.
• Rettet fejl, hvor readonly-inputfelter ikke blev vist korrekt, hvis de havde en anden type end text.
• Tilføjet eksempler for ‘siden kunne ikke findes’ (fejl 404).
• Tilføjet manglende teksttykkelse (font-weight) på billedtekst og subheadings.
• Opdateret flere af dokumentationsidens eksempler og retningslinjer, så de er mere retvisende og anvendelige.

Version 10.0.0

Hvis du skal opgradere fra version 9 til version 10, så læs vores migreringsguide for v10.0.0 på GitHub først. Version 10 indeholder mange breaking changes, man som designer og udvikler skal forholde sig til, da der både er ændringer i grundlæggende komponenter som header og mobilmenu, samt omstrukturering af designsystemets kodefiler.

• Breaking change Headerens række 4 og række 5 er fjernet, mens de øvrige rækker i headeren har fået opdateret design og forbedret tilgængelighed. Se flere detaljer på headerkomponentens side.
• Breaking change Mobilmenuens design er opdateret.
• New Tilføjet mulighed for at placere sprogvælgeren i headeren og mobilmenuen udover footeren.
• New Hvis der ikke er plads til alle menupunkter, vil de overskydende menupunkter automatisk ryge ind i en ‘Mere’-menu.
• New Tilføjet eksempel på søgefelt i header.
• Løsningstitlen behøver ikke længere være et link.

• Breaking change Ny fanebladskomponent. Den tidligere fanebladskomponent understøttes ikke længere.
• New Faneblade kan nu også anvendes til sidenavigation.
• New Tilføjet mulighed for at indsætte ikoner i faneblade.

• Breaking change Tooltips er ændret grundlæggende i opførsel, design, anvendelse og implementering.
• Breaking change Rettet fejl, hvor tooltips kunne sætte sig forkert, hvis brugeren zoomede eller ændrede browservinduets størrelse.
• Breaking change Rettet fejl, hvor tooltips ikke kunne tilgås med tastatur samt visse skærmlæsere.
• Breaking change Ændret måden tooltips anvendes til forklaring af ord i tekstparagraffer grundet tilgængelighedsproblemer.
• Breaking change Tooltips på sprogvælgeren er opdateret som følge af tooltipkomponentens ændringer.

• Breaking change Anchorlinks er fjernet fra venstremenuen.
• Breaking change HTML og styling er opdateret i både trinindikator og venstremenu som følge af ændringerne i header og anchorlinks.
• Change Opdateret eksempler for trinindikator og venstremenu med aria-label for nav-elementet.
• Change Tilpasset roller, opmærkning og aria-attributter.
• Breaking change Rettet fejl, hvor tekst eller ikon kunne ryge ud over komponentens kanter.
• Tilføjet understregning til klikbare trin for at adskille dem fra låste trin. For mere info, se issue #204 på GitHub.

• Breaking change Fjernet muligheden for at vælge mellem store (32 pixels) og små (20 pixels) radioknapper og tjekbokse. Den nye standardstørrelse er 24 pixels. Bemærk at HTML’en for tabeller med valgbare rækker og tjekbokse skal opdateres.
• Rettet fejl, hvor udseendet af inaktive radioknapper og tjekbokse kunne variere.
• Rettet fejl, hvor skjult indhold i enten radioknapper eller tjekbokse kunne få forkert styling ved fejlbeskeder.

• Ændret accordions border-radius (hjørner) fra 3px til 4px.
• Change Rettet fejl, hvor tekst ikke altid blev ombrudt korrekt i accordions.
• Fjernet forældet JavaScript fra accordions.

• Rettet fejl, hvor fokusmarkeringen kunne mangle delvist i overflowmenuen.
• Rettet fejl, hvor links i overflowmenuen kunne sidde i den forkerte side.
• Indsat en tynd streg mellem de forskellige elementer i overflowmenuen.
• Change Opdateret HTML for overflowmenu og sortering som følge af header-ændringerne.
• Opdateret JavaScript for sortering, så kravene til HTML’en er mindre rigide. Fx er det nu tilladt at have et span-element inde i button-elementet.

Nedenstående ændringer har primært betydning, hvis man selv bygger kodefiler ud fra designsystemets filer, hvis man har ændret i de oprindelige filer eller anvender designsystemet på en anden måde end specificeret på dokumentationssiden.

• Designsystemet anvender nu webpack i stedet for gulp til at bygge filer.
• Breaking change Ændret devDependencies og scripts i package.json.
• Breaking change Fjernet flere polyfills til ikke-supporterede browsere. Hvis man i sit projekt har et krav om at supportere ældre browsere, skal man derfor selv sikre, at man anvender den nødvendige transpiling og polyfills. Se eventuelt browserunderstøttelse.
• Breaking change Erstattet @import i alle SASS-filer med @use og @forward. Dette har medført en generel restruktur i alle SASS-filer og tilhørende mapper, hvor flere funktioner og mixins er blevet slettet eller flyttet. For mere info, se issue #199 på GitHub.
• Breaking change Flere SASS-variable er blevet slettet, flyttet eller erstattet, da de gjorde det muligt at tilpasse styling, det ikke var tiltænkt, man skulle ændre.
• Erstattet ‘normalize.css’ med styling i ‘_base.scss’.
• Flere macroer har fået mindre rettelser og tilføjelser, så der blandt andet kan sættes klasser og attributter.
• Mindre koderettelser som følge af et linter-tjek.
• Breaking change Fjernet forældede klasser, heriblandt icon-svg-large, collapse-transition-collapse, collapse-transition-expand, button-small, sidebar-col og flere ubrugte klasser for accordion’s åbn/luk alle-knap.
• Opdateret README-fil.
• Breaking change Ensrettet stistrukturen til hhv. fonte, ikoner og billeder.
• Rettet fejl, hvor klassen sr-only risikerede at blive unødvendigt gentaget flere gange i ens stylesheet, hvis man anvendte SCSS-filerne.

• Dokumentationssiden har fået en større omstrukturering, hvor flere sider er flyttet rundt.
• Flere sider er blevet opdelt i to faner kaldet ‘Retningslinjer’ og ‘Kode’. Man skal derfor ikke længere ind på to forskellige hovedmenupunkter for at finde hhv. kode og design.
• Nyt hovedmenupunkt “Kom i gang”, som indeholder overordnet information om bl.a. krav, tilgængelighed og ressourcer for kode og design.
• ‘Design’ er omdøbt til ‘Styleguide’.
• Det er ikke længere muligt at hente designsystemets komponenter som svg-filer. Se designressourcer for øvrige muligheder.
• Ny side om justering af tema og stylesheets.

• Breaking change Fjernet klasser, der visuelt kunne få links til at fremstå inaktive.
• New Anchorlinks har fået sin egen komponent.
• Rettet ikonet file-upload, der kunne smide en fejl i konsollen, når man anvendte visse browser extensions.
• Breaking change Fjernet ikonet ‘Log af (åben hængelås)’ (lock-open). Ikonet lock skal i stedet bruges til ‘log af’.
• Breaking change Fjernet JavaScript fra datofelter og ændret inputtypen fra tel til number. Man skal derfor sikre sig, at ens løsning har en passende validering af de indtastede værdier.
• Change Ændret fontstørrelse og linjehøjde for typografi inklusiv overskrifter, billedtekst, subheading og manchet - vær opmærksom på, at disse tekster kan fylde mere end tidligere.
• Breaking change Toggle switch har fået ny HTML, ny styling og opdaterede retningslinjer med det formål at øge tilgængeligheden, samt gøre det muligt at anvende komponenten på andre sprog end dansk.
• Breaking change Rettet fejl, hvor fokus kunne ryge ud af modaler til indholdet bagved. Rettelsen kræver, at alle modaler lægges i et container-element. Se kode for modaler for mere info.
• Breaking change For tabeller med sortering er hele headeren gjort klikbar.
• Change Fejlopsummering anvender nu en nav som udgangspunkt.
• Ændret font-smoothing for flere elementer.
• Rettet fejl, hvor tilbage til toppen-knappen nogle gange var vist, selvom den skulle være skjult.
• Tilføjet klassen no-max-width, der forhindrer max-width på en paragraf eller liste.
• Breaking change Fjernet varianten af beskeder uden ikon. Klassen alert--show-icon bruges ikke længere og ikonet skal indsættes manuelt.
• Rettet fejl, hvor responsive tabeller med sortering indeholdt sorteringsknappernes tekst på mindre skærme. For mere info, se issue #229 på GitHub.
• Change Justeret ikonets placering i funktionslink og eksterne links samt line-height på knapper for bedre centrering.

Version 9.1.0

• Change Ændret design på readonly-inputfelter og deaktiverede inputfelter. Bemærk at deaktiverede inputfelter kræver en mindre opdatering af HTML’ens klasser.
• Tilføjet styling til placeholder-attributten for inputfelter, så placeholder-tekst afviger i udseende fra indtastet tekst. Vær dog opmærksom på, at hjælpetekster fortsat er måden at give brugere hjælp til indtastning på.
• Opdateret funktionslinks, så teksten er venstrestillet, når de i HTML’en er angivet med <button>.
• Rettet fejl, hvor visse typer af id kunne få overflowmenuen til at fejle. For mere info, se issue #220 på Github.
• Tilføjet inline til hjælpeklasser for display.
• Tilføjet autocomplete-attributter til flere eksempler, tilføjet afsnit om autocomplete til inputfelter og gjort det muligt at sætte autocomplete i date-input-macroen.
• New Tilføjet pattern for inputfelter med hentet data.
• Tilføjet ny side til dokumentationen kaldet Ofte stillede spørgsmål, samt opdateret siderne Designressourcer, Tjekliste og Komponenter.

Version 9.0.2

• Rettet fejl, hvor musemarkøren ikke blev vist korrekt på deaktiverede felter, når de var angivet som andet end type="text".
• Rettet fejl, hvor knapper ikke altid stod på linje, når de lå i samme række. For mere info, se issue #215 på Github.

Version 9.0.1

• Rettet fejl, hvor teksten på knapper røg ud over kanten, hvis teksten fyldte flere linjer.
• Rettet fejl, hvor cookiemeddelelsen ikke kunne læses, når der var zoomet kraftigt ind i browseren.
• Tilføjet tjek i JavaScript-koden for modaler, så man ikke længere får en fejlbesked i browserens konsol, hvis man programmatisk forsøger at lukke en allerede lukket modal. For mere info, se issue #210 på Github.
• Rettet fejl i dokumentationen, hvor nogle farver stod angivet forkert.

Version 9.0.0

• Rettet fejl, hvor datoer fik en forkert dag læst højt af skærmlæsere. For mere info, se issue #201 på Github.
• Rettet fejl, hvor navigationen i datovælgeren ikke fungerede sammen med visse skærmlæsere.
• Rettet fejl, hvor markøren skiftede udseende på navigationsknapperne, selvom disse knapper ikke var synlige.
• Breaking change Fjernet, tilføjet og ændret flere skærmlæserbeskeder. Anvender du dine egne sprogoversættelser, skal disse derfor opdateres.
• Ændret aria-selected til aria-current på valgte datoer, måneder og år.
• New Tilføjet muligheden for at tilpasse datoformatet.
• Breaking change Opdateret inputfeltet, så datovælgeren accepterer flere måder at indtaste en dato på (uafhængigt af det valgte datoformat).

• Change Rettet fejl vedrørende trinindikatorens gennemført-ikon, hvor skærmlæsere ikke annoncerede, når et trin var markeret som gennemført.
• Breaking change Rettet fejl, hvor lange tekster blev ombrudt forkert (ændringen påvirker både venstremenu og trinindikator).
• Breaking change Rettet fejl, hvor trinindikatoren kunne blive for lille, medmindre den var responsiv.
• New Tilføjet muligheden for at vise, når der er fejl i et trin i trinindikatoren. For mere info, se issue #142 på Github.

• Breaking change Fjernet klassen table--lines, der var en forældet variant.
• Rettet fejl relateret til margin og padding for tabeller.
• Change Opdateret teksten på søgeknappen ved søgning i tabeller.
• Change Skærmlæserbeskederne til tjekboksene i tabeller med valgbare rækker er ændret til kun at være “vælg række”. Da JavaScripten ikke længere ændrer i skærmlæserbeskederne, skal eventuelle oversættelser skrives direkte i HTML’en fremadrettet.
• Change Fjernet aria-label fra label-elementet for tjekbokse i tabeller med valgbare rækker.
• Change Opdateret opsummeringssiderne i selvbetjeningseksemplerne, hvor tidligere tomme headers har fået en skærmlæserbesked.
• Breaking change Opdateret DKFDS.init(), så kun tabeller markeret med responsive klasser får indsat attributten data-title.
• Change Strukturerede lister er flyttet ind under tabeller og er ændret til en tabelstruktur.

• Change Opdateret myndighedsnavnet i række 2, så det er kodet med <strong>.
• Rettet fejl, hvor portalnavnet ikke blev vist korrekt ved print.
• Change Opdateret Log af-knappen, så den altid er kodet som en button uanset skærmstørrelse.
• Change title er fjernet fra mobilmenuens knapper og erstattet af aria-label.
• Change Rettet fejl, hvor den aktive side i række 3 ikke blev fremhævet for skærmlæsere eller fremgik af mobilmenuen.

• Breaking change Fjernet linjen "jsnext:main": "src/js/start.js".
  For mere info, se issue #194 på Github.
• Breaking change Fjernet release fra scripts.
• Breaking change Fjernet app-root-path, array-filter, gulp4-run-sequence og zip-folder fra devDependencies.

Øvrige

• Breaking change Større opdatering og omskrivning af flere macroer. Se macroernes tilhørende YAML-filer for den komplette dokumentation. Såfremt man ikke anvender macroer, men blot har anvendt HTML-koden vist i dokumentationssidens eksempler, kan man se bort fra dette punkt i release notes.
• Change Flere afvigelser i dokumentationens kodeeksempler og beskrivelser er rettet. Nogle eksempler kan derfor se anderledes ud end tidligere.
• Fjernet flere billeder fra dokumentationen, der viste eksempler på avancerede komponenter uden tilhørende kode.
• Change Opdateret HTML’en for følgende komponenter, så titler og fremhævet tekst er angivet med enten et heading-element eller <strong>-element: Badges, beskeder, cookiemeddelelser, footer og toastbeskeder.
• Change Toastbeskeders aria-attributter og skærmlæserbeskeder er opdateret. Skærmlæsere annoncerer nu også beskedens variant og derudover titlen ved fokus på luk-knappen.
• Breaking change Opdateret accordions, så de altid kan åbnes og lukkes uafhængigt af de øvrige accordions i gruppen (mobilversionen af faneblade er dog undtaget).
  For mere info, se issue #207 på Github.
• Change Opdateret fejlbeskeder i accordions, så skærmlæsere kun læser fejlbeskeden højt og ikke hele accordionens indhold.
• Change Rettet fejl, hvor den lille version af tilbage til toppen-knappen ikke blev læst korrekt op af skærmlæsere.
• Breaking change Attributten aria-selected på sortering er ændret til aria-current og flyttet fra li-elementet til button-elementet.
• Rettet fejl, hvor søgefelter blev grå i stedet for hvide på iPhones.
• Change Radioknapper og tjekbokse er omskrevet, så de ikke længere indeholder listeelementerne li og ul.
• Mindsket afstanden mellem label og hjælpetekst ved store radioknapper og store tjekbokse.
• Breaking change Rettet fejl, hvor sprogoversættelser for karakterbegrænsning og Accordions påvirkede sproget i disse komponenter generelt i stedet for kun i de initialiserede komponenter. Denne opførsel kan dog ikke undgås for Datovælgeren, hvor dokumentationen er præciseret.
• Breaking change Tidligere public funktioner og variable er gjort private i koden for karakterbegrænsning. Funktionen init samt sprogskifte er uændrede.
• Breaking change Fjernet ikonet delete. Brug i stedet ikonet trash-can.
• Breaking change Klikbare ikoner med klassen button-unstyled fylder ikke længere hele skærmbredden på mindre skærme og HTML’en er opdateret for alle eksempler.
• Rettet fejl, hvor deaktiverede tertiærknapper skiftede farve på hover.
• Change Fjernet pattern for visning af modal, når en side forlades. I stedet kan browseradvarsler anvendes.
• Rettet fejl i overflow menuer, hvor indholdet kunne ryge ud over skærmkanten på små skærme.
• Change Tilføjet aria-haspopup til knapper, der åbner modaler. Modalkomponenten, selvbetjeningseksemplerne og pattern for session udløber er opdateret.

Tidligere versioner

Version 8.2.1

• Tilføjet klassen full-width-image, der kan bruges til billeder anvendt som links.
• Rettet fejl i modaler, hvor baggrunden kunne blive dækket helt af modalen på især mindre skærme.
• Opdateret licensinformation og tilføjet licensfilen til zip-filen i GitHub.

Version 8.2.0

• New Tilføjet mulighed for at ændre sprog i komponenterne accordions, tabeller med valgbare rækker, karakterbegrænsning og datovælgeren.
• Change Ændret aria-attributter for toastbeskeder, da beskederne ikke blev læst højt af skærmlæsere. De nye aria-attributter skal sættes på henholdsvis toast-containeren og toastbeskederne.
• Change Ændret placeringen af toastbeskeder, så de nu vises øverst på både store og små skærme. Hvis der vises flere beskeder ad gangen, anbefales det at lade den nyeste stå øverst.
• Tilføjet cursor:pointer til toastbeskeders luk-knap.
• Opdateret dropdown-komponentens background-image, så det sættes ved hjælp af ikonet expand-more.
• Ændret stylingen på responsive trinindikatorers top- og bund-kanter, så de ikke længere forsvinder på mindre skærme.
• Rettet en mindre fejl, hvor tooltip-pilen kunne pege væk fra elementet.

Version 8.1.0

• New Ny komponent: Tilbage til toppen
• New Ny variant: Karakterbegræsning er tilføjet til inputfelter og tekstområder
• Tilføjet manglende padding i venstre side af overflow-menupunkter i headerens række 3
• Rettet fejl hvor skip-links ikke blev vist, når der var zoomet ca. 400% ind i browseren
• Fjernet text-transform:uppercase på subheading, der ved en fejl var blevet genintroduceret efter version 7.5.3
• Change Negativ letter-spacing er fjernet fra al tekst - vær opmærksom på, at brødtekster og titler kan fylde mere end tidligere
• Change Begge knapper i cookiemeddelelse har nu typen sekundærknapper
• Flere macroer har fået mindre ændringer, for eksempel fejlrettelser (dropdowns og tekstområder) eller tilføjelse af (valgfri) properties
• Change Dokumentationens eksempler på selvbetjeningsløsninger og templates er opdateret og gjort generiske. Derudover er der foretaget flere mindre rettelser, heriblandt er formularer flyttet ind under patterns, ‘sidenavigation’ er omdøbt til ‘venstremenu’, ‘felter’ er omdøbt til ‘inputfelter’, ‘notifikation’ er omdøbt til ‘toastbesked’, ‘skip-link’ er omdøbt til ‘gå til sidens indhold’ og ‘spinner’ er omdøbt til ‘loading spinner’. De nye navne har udelukkende betydning for, hvor på sitet der kan findes dokumentation og koden er derfor uændret.

Version 8.0.1

• Rettet aria-labels i datovælgerens tilbage/frem-knapper. For mere info, se issue #180 på Github.
• Tilføjet chevron-double-left og chevron-double-right til ikoner, der manglede efter version 8.0.0. For mere info, se issue #177 på Github.
• Opdateret ikonet arrow-left, der viste det forkerte ikon, når man indsatte det ved hjælp af klassen.
• Opdateret ikonerne sort-default og sort-table-none, så de også kan bruges som klasse.
• Opdateret ikonerne sort-ascending, sort-default, sort-descending, sort-table-ascending, sort-table-descending og sort-table-none, så det er muligt at ændre farve på disse, når man anvender ikonsamlingen.

Version 8.0.0

• Ny komponent: Paginering
• Ny komponent: Strukturerede lister
• Taget højde for alignment af lange trinnavne i trinindikator
• Tilpasset afstande ved tjekboks og radioknap med skjult indhold
• Change Javascript tilføjet til fejlopsummeringskomponenten så links sætter korrekt fokus i felter i Safari.
• DKFDS.init() udvidet med scope json parameter, så man kan køre DKFDS.init() mere målrettet på siden.
• Change Ændret slet ikonet, da det gamle ikon ikke fungerede i brugertest.
• Breaking change Indført nye datavisualiseringsfarver.
• Breaking change Omdøbt FDS farver
• Erstattet brug af / ved division i scss med math.div For mere info, se issue #157 på Github.
• Breaking change Fjernet javascript på detaljekomponenten, da FDS ikke længere understøtter Internet Explorer
• Breaking change Opdateret javascript kald for komponenter, således at man for visse komponenter skal køre init(). Se mere under hver komponent i kodesektionen
• Breaking change Ændret attributter for radioknap med skjult indhold
• Breaking change Fjernet gamle ikoner
• Breaking change Tilføjet JavaScript til luk knap i beskeder
• Tilføjet Modal som kræver handling, så brugeren ikke kan lukke modalen uden at tage stilling til dets indhold.
• Change Ved luk af modal sættes fokus på element, som åbnede modalen
• Breaking change Luk modal, hvis en ny modal åbnes.
• Breaking change Forbedret headeren på mobil.
• Vis tjekbokse og radioknapper ved print.
• Breaking change Større opdatering af macroer for nemmere vedligehold og brug.
• Vis dage for forrige og næste måned, når de deler uge med aktuelle måned i datovælgeren.
• Opdateret breakpoints i knapper, så knapperne ikke er helt så brede på mindre skærme.
• Fjernet accordion uden ramme.
• Tilpasset afstande i modal på mindre skærme
• Opdateret normalize.css til v8.0.1
• Fjernet styling på badges, som gør teksten til store bogstaver. Store bogstaver gav udfordringer med korrekt oplæsning af teksten med skærmlæser.
• Grå baggrundsfarve på dropdown i Firefox er ændret til hvid.
• Header komponent: Log ud og Log ind knapper i mobilnavigationen er sat til fuld bredde, så knapper præsenteres ens i menuen.
• Lille fejl i border på tabeller er fikset.
• Bredde på overflow menu ændret til at fylde hele skærmens bredde på små skærme.
• Ændringer i opførelse af tooltip, for at sikre teksten kan markeres. For mere info, se issue #163 på Github.
• Breaking change Tilføjet og ændret SASS variabler for bedre vedligehold og tematisering.
• Opdateret højden på knapper med ikoner, så de nu har samme højde som knapper uden ikoner.

Version 7.5.3

• Fjernet text-transform:uppercase på subheading, så skærmlæsere læser teksten frem for at stave

Version 7.5.2

• Gjort det muligt at markere tekst i knapper for support af hjælpeværktøjer som Adgang for alle.

Version 7.5.1

• Fikset fejl med placering af årstal i datovælger i mobilvisning.
• Rettet fejl i datovælgeren der gjorde, at den første dag i måneden ikke blev vist, når den var en søndag.
• Tillader nu dato i datovælgeren fra start.

Version 7.5.0

• Valgbare rækker i tabel
• Prefix og suffix på felter
• Småtilpasninger i designet på modaler
• Opdateret design på datovælger
• Tilføjet 72px i bunden af footer
• Tilføjet styling og retningslinjer for sortering i tabeller
• Tilføjet eksempel og retningslinjer på søgning i tabeller
• Tilføjet en tykkere border i bunden af knapper
• Opdateret retningslinjer for obligatoriske og frivillige felter
• Tilføjet ikoner til sortering i tabel
• Tilføjet variant til overflow menu til brug ved sortering
• Ændret ikon i detalje komponent

Version 7.4.0

• Ændringer i tooltip komponenten - der er tilføjet delay og pil på tooltip
• Links får nu automatisk sort farve i beskeder
• Ny komponent: Toggle switch komponent
• Tilføjet status tekst i forbindelse med spinner komponenten

Version 7.3.0

• Ikontaksonomi
• Ny komponent: Notifikation (Toast) komponent
• Fjernet unødvendige kald til fontfiler
• Timing issue på datovælger - sæt ikke knappen, hvis den allerede eksisterer
• Generel oprydning i dependencies For mere info, se issue #130 på Github.
• Håndtering af situation: Escape funktion på overflow menu og modaler kolliderer og lukker begge, når en overflow er inde i en modal For mere info, se issue #125 på Github.
• Facit streger
• Udvidelse af breakpoint for responsiv tabel For mere info, se issue #45 på Github.

Version 7.2.0

• Ændret font i drop down for at fikse bug i Firefox For mere info, se issue #102 på Github.
• Ny komponent: Datovælger
• Fiks fejl, hvor ol liste bliver vist med bullets i accordions For mere info, se issue #120 på Github.
• Tilføjet brugervenlige JS fejl, når en komponent ikke er tilføjet korrekt
• Opdateret typografi
• Tilføjet styling af billedtekst (figcaption)
• Åbn/luk alle accordions function
• Accordion knapper kan nu være i en overskrift For mere info, se issue #88 på Github.
• Padding fikset på extracompact tabeller For mere info, se issue #113 på Github.

Version 7.1.1

• Fikset fejl, hvor border ved aktivt menupunkt i header hopper ved hover. For mere info, se issue #118 på Github.
• Fikset fejl i Internet Explorer, hvor feltbredde i tekstfelter er defineret ved antal karakterer bliver ignoreret.
• Luk overflow menu i header ved klik uden for menuen.
• Tilføjet ARIA attributter i trinindikator for bedre tilgængelighed

Version 7.1.0

• Ny komponent: Sprogvælger

Version 7.0.0

• Breaking change Opdateret fonten IBM Plex Sans til version 5.0.0 Hvis man preloader fonten - hvilket anbefales - så bør man tjekke om stien til fonten skal ændres, da mappestrukturen under fonts er ændret i dkfds
• Breaking change Ændret attributter på tjekboks med collapse funktion, så HTML nu er valid.
• Tilføjet ny modal komponent
• Fikset fejl med fokus i header i Firefox
• Tilføjet maks. bredde på tooltip
• Fjernet dokumentation for brug af dkfds-plugins, da det fremover ikke vil blive vedligeholdt Se mere under Plugins i Kode sektionen
• Fikset fejl, hvor valgt radioknap ikke blev vist ved print i Internet Explorer og Edge For mere info, se issue #112 på Github.

Version 6.1.1

• Ændret lille knap til normal knap i standard header grundet usability issues i mobilvisning

Version 6.1.0

• Ny komponent: Brødkrumme
• Mulighed for en mere kompakt header med brug af en lille knap
• Linjehøjden for lille brødtekst er ændret til 20px
• Tilføjet dokumentation og eksempler på fejlmeddelelser og fejlopsummeringer.
• Tilpasset alignment på venstremenu

Version 6.0.1

• Fjernet inkludering af IBM Plex Sans definitionen i dkfds-tippy-theme.standalone.css. For mere info, se issue #104 på Github.
• Understøttelse af Tippy.js v6.1.0 For mere info, se issue #105 på Github.
• Tilpasset CSS til faneblade, så der ikke længere kommer fejl ved import af dkfds scss i angular.

Version 6.0.0

• Detalje komponent tilføjet.
• Breaking change Skjul/vis indhold med knap er fjernet.
• Breaking change Cookiemeddelelse opdateret i udseende og HTML.
• Rettet fejl med border i tabel. For mere info, se issue #96 på Github.
• Tilføjet mulighed for styling af links i overskrifter.
• Breaking change Faneblade er ændret i HTML og JavaScript.
• Ændret aktive farve på undermenupunkt i venstremenu
• Tilføjet retningslinjer for funktionslink, tilbage-link og cookiemeddelelse.
• Change Tilføjet korrekte ARIA attributer på venstremenuen, mobilmenu og headermenuen.
• Fikset fejl på responsiv trinindikator. For mere info, se issue #94 på Github.

Version 5.3.0

• Tilbage link har fået større linje højde.
• Mere padding i toppen af navbar indeholdende funktionslink og overflow menu i header.
• Ændret udseende af cookiemeddelelse komponenten.
• Lister har fået nyt udtryk.
• Ændret farve og tykkelse på aktivt menupunkt i header samt venstremenuen.
• Tilføjet mulighed for hjælpetekst på radioknap.
• Tilpasset fokusramme om funktions link.
• Tilpasset retningslinjer for Skjul/vis med radioknapper.
• Opdateret SVG filer, samt tilføjet link til Figma komponent bibliotek.

Version 5.2.0

• Change Ændret accordion aria-multiselectable så man i stedet kan bruge klassen accordion-multiselectable Ændringen er fortsat bagudkompatibel, men den tidligere implementering anbefales ikke, da det ikke var valid HTML.
• Teksten i cards med samme højde placeres nu korrekt
• Tilføjet mere afstand mellem links i footer
• Overskriftstørrelser på mobil er blevet opdateret
• Tilpasset farve på informationstekst på komponenterne venstremenu med ekstra information og trinindikator med ekstra information
• Tilføjet eksempel på tabel i Datatable Efterspurgt i Github issue #55.
• Opdateret Eksempel på implementering i Angular

Version 5.1.0

• Cookiemeddelelse komponent er tilføjet i kernen.
• Tilbage link er tilføjet i kernen. Bemærk, at Tilbage link anbefales frem for Tilbage knap.
• Fokuskant tilføjet på #main-content ved fokus fra Skip link.
• Statusbadges er tilføjet i kernen.
• Fejl i overflow menu brugt i header fikset. Se mere om fejlen på Github issue #75.
• Fikset print af modal fra iPhone. Se mere om fejlen på Github issue #67.
• Opdateret beskrivelse af implementering af DKFDS under Til udviklere. Bemærk, at neutralt tema kun bør benyttes som skabelon til et nyt tema, og ikke som et enkeltstående tema. Læs mere om temahåndtering.

Version 5.0.0

• Breaking change JavaScript i kernen er skrevet om. Man skal initiere javascript med funktionen DKFDS.init() på hver side. For mere info, se issue #74 på Github eller vores afsnit om implementering af DKFDS til udviklere.
• Breaking change JavaScript i DKFDS kernen bliver nu udstillet til brug i projekter. For mere info, se issue #74 på Github.
• Breaking change Venstremenuen har fået nyt design. HTML er ændret - se korrekt struktur under venstremenu-komponenten.
• Breaking change Faneblade er blevet redefineret. Hele komponenten er blevet redefineret - se den nye komponent under faneblade.
• Breaking change Den gamle tooltip (tippy) komponent er blevet flyttet til plugins. Bemærk, at komponenten ikke længere er en del af kernen, men at der er kommet en erstatning i kernen.
• Breaking change Modal-komponenten er blevet flyttet til plugins. Bemærk, at komponenten ikke længere er en del af kernen.
• Ny og simpel tooltip komponent er tilføjet til kernen - Komponenten er ikke længere baseret på tredjeparts bibliotek.
• Der er tilføjet events til komponenter. Man sætte eventlisteners på bestemte events - Fx når en accordion åbner og lukker. For mere info, se implementeringsafsnittet under hver komponent.
• Information om krav til selvbetjeningsløsninger er nu tilføjet til designsystem.dk.
• Tabellerne følger nu 8point grid

Version 4.4.0

• Change Tilpasset CSS til print
• Farven på valgt menupunkt i venstremenu er ændret til #1A1A1A
• Ændret udseende på tjekboks og radioknap ved print
• Fikset fejl med border på den sidste række i en tabel
• Fikset fejl med modal ved print
• Tilpasset retningslinjer for ikoner i forhold til tilgængelighed

Version 4.3.0

• Fjernet farve på small-text mixin.
• Tilpasset positionering af ikon på knapper.
• Fikset fejl i input felter, hvor specialtegn (Å, Ö, Ä etc.) ikke blev vist korrekt.
• Tilføjet eksempel på luk knap i Beskeder.
• Change Tilføjet mulighed for at positionere action knapper i cards i bunden.
• Fikset fejl ved print af eksempelløsninger i Firefox - tilføjet yderligere print CSS.

Version 4.2.0

• Fjernet margin-top på h1.
• Change Fjernet form-group div fra li i radioknap og tjekboks liste (Løser udfordringen med at JAWS skærmlæseren læser skrivebeskyttet ved hver tjekboks eller radioknap).
• Fikset styling i niveau 4 i sidemenuen på mobil.
• Fikset tilgængelighed på responsiv trinindikator - aria-hidden opdateres nu automatisk alt efter status på komponenten.
• Responsiv tabel er nu sat til display:block på små skærme således at skærmlæsere ikke tror det er en tom tabel.

Version 4.1.1

• Fjernet primærfarven på tekst i aktivt menupunkt i header.
• Tilføjet klassen inline-svg, som kan bruges på ikoner, der skal fremgå i tekst, således at de matcher teksthøjden.
• Ændret afstand fra label til read-only felt.
• Ændret JavaScript, der håndterer regex maske på dato felt, således at man nu kan bruge copy/paste igen.
  • Fejlhåndtering omkring ikke gyldige karakterer indsat i feltet med copy/paste bør håndteres i projektet selv.
• Tilføjet sektion omkring formularstruktur.

Version 4.1.0

• Change Fjernet fast højde på tekstområde (textarea) - man kan/bør nu sætte højden med rows attributten.
• Fjernet tekstmarkøren på et read only felt i Internet Explorer.
• Tilføjet eksempler på advarsel, når man forlader siden i eksempelløsningerne.
• Tilføjet afstand af tags, når de fylder flere linjer.
• Fjernet primærfarve på teksten i faneblade ved hover.
• Fikset fokusramme på faneblade.
• Fikset fejl i modal, hvor overskriften blev overlappet af luk knappen.
• Change Log ud skal nu hedde Log af.

Version 4.0.1

• Opdateret skip link udseende
• Ændret styling, så a-element i solution-header nu kan være et h1-element
• Fikset readonly fejl i Internet Explorer
• Tilpasset footer margin og padding
• Tilføjet print display css klasser (Fx d-print-none)
• Tilføjet logo definition
• Tooltip skriftstørrelse ændret fra 13 til 16px
• Fikset hover farve på icon knap (button-unstyled)

Version 4.0.0

• Breaking change Fjernet højde på cards
• Tilføjet klassen card-align-height, så cards kan have ens højde på samme række.
• Fikset fokus border på faneblade

Version 3.0.3

• Fjernet eksempler fra projekt
• Breaking change Ændret macros, så de er mere dynamiske, så flere projekter kan gøre brug af dem
• Fikset fejl med fokus på overflow menu i Firefox
• Fikset fejl med ol liste i flere niveauer
• Fjernet gammel JavaScript, som var årsag til fejl ved loading af javascript filen
• Ændret HR kant farve
• Ændret kant farve på tertiær knap
• Tilføjet afstand på tags og knapper på lille skærm
• Opdateret footers
• Tilføjet JavaScript der håndterer lukning af overflow menuer, når man åbner en ny

Version 3.0.2

• Tilføjet info om fiks af Microsoft Edge bug i navigation, hvor bullets blev vist trods styling
• Breaking change Defineret tilbage-knap
• Tilføjet readonly eksempel i input felter
• Ændret Skjul/Vis eksempel ved brug af radio knap for at løse tilgængelighedsproblemer
• Fikset fejl på dropdown i Internet Explorer, hvor pilen blev vist to gange
• Nederste border i header ændret til $outer-border
• Tilføjet klassen .nobullet-list, som kan bruges ved liste af links
• Breaking change Flyttet Pikaday datovælger plugin til Plugins-projektet
• Tilføjet .break-word klasse til brug i tabeller, hvor man bruger lange filnavne i kolonnerne
• Ændret disabled link farve
• Breaking change Fjernet $color-link-active farven, da den ikke længere bliver brugt
• Opdateret styling og definition af eksterne links
• Ændret skrifttype tykkelse på søgefelts knappen

Version 3.0.1

Smårettelser til CSS og ikoner

• small-text og small-tag klasserne fik ændret font-size fra 13px til 14px
• Ændrede level 2 og 3 i venstremenu på mobil
• Rettede ikonerne help og close-circle

Smårettelser til eksempler

• Typesetting blev delt i to: Linjeafstand og Linjelængde.
• Fejl i Popover-eksemplet blev rettet.
• Neutralt logo til header-eksempler blev opdateret.

Version 3.0.0

• Breaking change Refaktoreret fra ‘dkwds’ til ‘dkfds’ Alt kode er blevet refaktoreret så den nu benytter forkortelsen ‘dkfds’ i stedet for ‘dkwds’.
• Breaking change Bourbon er fjernet Biblioteket ‘Bourbon’ er ikke længere en del af designsystemet. Det vil derfor ikke længere være muligt at benytte sig af deres hjælpeklasser og funktioner.
• Breaking change Nyt gridsystem USWDS’ gamle float-grid (NEAT) og Bootstraps grid er fjernet. I stedet for er USWDS’ nye grid inkluderet. Der er lavet tilpasninger af dette grid så det køre på de samme variable og klassenavne som i den forrige version af FDS. Der skal derfor ikke laves nogen tilpasninger for at få dette grid inkluderet.
• Breaking change Plugins project Datatables og SelectWoo er ikke længere en del af komponent-biblioteket. Der er derimod oprettet et nyt projekt (dkfds-plugins) hvor disse nu lever.
• Nye klasser De følgende klasser er blev omdøbt:
  • input-success er omdøbt til form-success
  • input-error-message er omdøbt til form-error-message
• Accordion Accordions plus og minus ikon er flyttet til starten af accordion-knappen
• Fokus farve Fokus farven er ændret fra den gule farve (#febb30) til en grå farve (#747474). Farven er blevet ændret fordi den gule farve ikke overholder WCAG 2.1. Hvis man ønsker en anden fokus farve kan variablen $color-focus overskrives.
• Radioknapper og checkbokse
  • Styling af radio knapper kræver nu denne klasse på selve input[type=radio]: “form-radio”.
  • Styling af tjekbokse kræver nu denne klasse på selve input[type=checkbox]: “form-check”.

Version 2.1.2

• Nye skriftstørrelser til H1-H6
  • H1 går fra 36px til 40px.
  • H2 går fra 27px til 30px.
  • H3 er stadig 24px.
  • H4 går fra 22px til 20px;
  • H5 går fra 20px til 16px;
  • H6 går fra 16px til 13px;
  • Display-1 går fra 120px til 80px
  • Display-2 går fra 60px til 32px;

  Hvis du ønsker at beholde det samme visuelle udtryk skal man gå fra h5 til h4.

• Ny max-width styling

  Klassen '.content' er fjernet. Max-width style er nu kodet direkte til p, font-lead etc.

• Navigation i bunden af eksempelsiderne:

  "Breadcrumb" er omdøbt til "page-navigation". HTML ser nu således ud:

  <nav class="page-navigation">
   <a href="#" class="button button-primary">Næste</a>
   <a href="#" class="button button-ghost">Tilbage</a>
</nav>