altinn-designsystem

<!DOCTYPE html> <html lang="no" class=""> <head> <title>DESIGNSYSTEM PROTOTYPE - Altinn</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width" /> <meta name="format-detection" content="telephone=no"> <meta name="ROBOTS" content="NOINDEX, NOFOLLOW">  <link rel="apple-touch-icon" sizes="57x57" href="../../images/favicons/apple-touch-icon-57x57.png"> <link rel="apple-touch-icon" sizes="60x60" href="../../images/favicons/apple-touch-icon-60x60.png"> <link rel="apple-touch-icon" sizes="72x72" href="../../images/favicons/apple-touch-icon-72x72.png"> <link rel="apple-touch-icon" sizes="76x76" href="../../images/favicons/apple-touch-icon-76x76.png"> <link rel="apple-touch-icon" sizes="114x114" href="../../images/favicons/apple-touch-icon-114x114.png"> <link rel="apple-touch-icon" sizes="120x120" href="../../images/favicons/apple-touch-icon-120x120.png"> <link rel="apple-touch-icon" sizes="144x144" href="../../images/favicons/apple-touch-icon-144x144.png"> <link rel="apple-touch-icon" sizes="152x152" href="../../images/favicons/apple-touch-icon-152x152.png"> <link rel="apple-touch-icon" sizes="180x180" href="../../images/favicons/apple-touch-icon-180x180.png"> <link rel="icon" type="image/png" href="../../images/favicons/favicon-32x32.png" sizes="32x32"> <link rel="icon" type="image/png" href="../../images/favicons/android-chrome-192x192.png" sizes="192x192"> <link rel="icon" type="image/png" href="../../images/favicons/favicon-96x96.png" sizes="96x96"> <link rel="icon" type="image/png" href="../../images/favicons/favicon-16x16.png" sizes="16x16"> <link rel="manifest" href="../../images/favicons/manifest.json"> <link rel="mask-icon" href="../../images/favicons/safari-pinned-tab.svg"> <meta name="apple-mobile-web-app-title" content="Altinn"> <meta name="application-name" content="Altinn"> <meta name="msapplication-TileColor" content="#da532c"> <meta name="msapplication-TileImage" content="/mstile-144x144.png"> <meta name="theme-color" content="#ffffff">  <script src="https://use.fortawesome.com/ed31cded.js"></script> <script src="https://use.fortawesome.com/df832575.js"></script>  <link rel="stylesheet" href="../../css/style.prototype.altinn.css" type="text/css" media="screen"> <link rel="stylesheet" href="../../css/style.dist.brreg.css" type="text/css" media="screen"> <link rel="stylesheet" href="../../css/style.dist.altinnett.css" type="text/css" media="screen"> <script type="text/javascript"> if (self === top) { var elm = document.getElementsByTagName("html")[0]; elm.style.display = "none"; } </script>   <meta http-equiv="cache-control" content="max-age=0" /> <meta http-equiv="cache-control" content="no-cache" /> <meta http-equiv="expires" content="0" /> <meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" /> <meta http-equiv="pragma" content="no-cache" /> <link rel="stylesheet" href="../../styleguide/css/styleguide.min.css?1535451812396" media="all"> <link rel="stylesheet" href="../../styleguide/css/prism-typeahead.min.css?1535451812396" media="all" />  </head> <body class="" id="top"> <div class="a-sg-content-preloader"> <div class="a-sg-content-preloader-status"> </div> </div>  <div class="a-compare-category "> <h2>Kategori</h2> <div class="row"> <div class="a-compare-container col-6 col-md col-max-4">  <div class="a-compare-element "> <h3>Tittel på elementet</h3> <p>Her kommer en beskrivelse av det som karakteriserer selskapstypen innenfor den gitte kategorien. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> <strong>  <a href="/patterns/04-sider-infoportal-01-forside-00-forside/04-sider-infoportal-01-forside-00-forside.html" class=" " > Les mer </a>  </strong> </div>  </div> <div class="a-compare-container col-6 col-md col-max-4">  <div class="a-compare-element "> <h3>Tittel på elementet</h3> <p>Her kommer en beskrivelse av det som karakteriserer selskapstypen innenfor den gitte kategorien. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> <strong>  <a href="/patterns/04-sider-infoportal-01-forside-00-forside/04-sider-infoportal-01-forside-00-forside.html" class=" " > Les mer </a>  </strong> </div>  </div> <div class="a-compare-container col-6 col-md col-max-4">  <div class="a-compare-element "> <h3>Tittel på elementet</h3> <p>Her kommer en beskrivelse av det som karakteriserer selskapstypen innenfor den gitte kategorien. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> <strong>  <a href="/patterns/04-sider-infoportal-01-forside-00-forside/04-sider-infoportal-01-forside-00-forside.html" class=" " > Les mer </a>  </strong> </div>  </div> <div class="a-compare-container col-6 col-md col-max-4">  <div class="a-compare-element "> <h3>Tittel på elementet</h3> <p>Her kommer en beskrivelse av det som karakteriserer selskapstypen innenfor den gitte kategorien. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> <strong>  <a href="/patterns/04-sider-infoportal-01-forside-00-forside/04-sider-infoportal-01-forside-00-forside.html" class=" " > Les mer </a>  </strong> </div>  </div> </div> </div>   <script type="text/json" id="sg-pattern-data-footer" class="sg-pattern-data"> { "cssEnabled": false, "patternLineageExists": true, "patternLineages": [{ "lineagePattern": "molekyler-sammenligningselement", "lineagePath": "../../patterns/01-molekyler-00-tekst-06-sammenligningselement\\01-molekyler-00-tekst-06-sammenligningselement.html", "lineageState": "complete altinn altinnett" }], "lineage": [{ "lineagePattern": "molekyler-sammenligningselement", "lineagePath": "../../patterns/01-molekyler-00-tekst-06-sammenligningselement\\01-molekyler-00-tekst-06-sammenligningselement.html", "lineageState": "complete altinn altinnett" }], "patternLineageRExists": true, "patternLineagesR": [{ "lineagePattern": "maler-altinnett-artikkel", "lineagePath": "../../patterns/03-maler-altinnett-30-artikkel-10-artikkel\\03-maler-altinnett-30-artikkel-10-artikkel.html", "lineageState": "inprogress altinnett" }, { "lineagePattern": "maler-infoportal-sammenlikning", "lineagePath": "../../patterns/03-maler-infoportal-20-navigasjonssider-21-sammenlikning\\03-maler-infoportal-20-navigasjonssider-21-sammenlikning.html", "lineageState": "inprogress" }, { "lineagePattern": "maler-infoportal-artikkel", "lineagePath": "../../patterns/03-maler-infoportal-30-artikkel-10-artikkel\\03-maler-infoportal-30-artikkel-10-artikkel.html", "lineageState": "inreview" }, { "lineagePattern": "maler-infoportal-artikkel-v-aksjeselskap", "lineagePath": "../../patterns/03-maler-infoportal-30-artikkel-_14-artikkel-v-aksjeselskap\\03-maler-infoportal-30-artikkel-_14-artikkel-v-aksjeselskap.html" }, { "lineagePattern": "maler-infoportal-artikkel-jumbo-v-enkeltpersonforetak", "lineagePath": "../../patterns/03-maler-infoportal-30-artikkel-_41-artikkel-jumbo-v-enkeltpersonforetak\\03-maler-infoportal-30-artikkel-_41-artikkel-jumbo-v-enkeltpersonforetak.html" }, { "lineagePattern": "maler-infoportal-artikkel-jumbo-v-velg-foretaksform", "lineagePath": "../../patterns/03-maler-infoportal-30-artikkel-_42-artikkel-jumbo-v-velg-foretaksform\\03-maler-infoportal-30-artikkel-_42-artikkel-jumbo-v-velg-foretaksform.html", "lineageState": "needsrevalidation" }], "lineageR": [{ "lineagePattern": "maler-altinnett-artikkel", "lineagePath": "../../patterns/03-maler-altinnett-30-artikkel-10-artikkel\\03-maler-altinnett-30-artikkel-10-artikkel.html", "lineageState": "inprogress altinnett" }, { "lineagePattern": "maler-infoportal-sammenlikning", "lineagePath": "../../patterns/03-maler-infoportal-20-navigasjonssider-21-sammenlikning\\03-maler-infoportal-20-navigasjonssider-21-sammenlikning.html", "lineageState": "inprogress" }, { "lineagePattern": "maler-infoportal-artikkel", "lineagePath": "../../patterns/03-maler-infoportal-30-artikkel-10-artikkel\\03-maler-infoportal-30-artikkel-10-artikkel.html", "lineageState": "inreview" }, { "lineagePattern": "maler-infoportal-artikkel-v-aksjeselskap", "lineagePath": "../../patterns/03-maler-infoportal-30-artikkel-_14-artikkel-v-aksjeselskap\\03-maler-infoportal-30-artikkel-_14-artikkel-v-aksjeselskap.html" }, { "lineagePattern": "maler-infoportal-artikkel-jumbo-v-enkeltpersonforetak", "lineagePath": "../../patterns/03-maler-infoportal-30-artikkel-_41-artikkel-jumbo-v-enkeltpersonforetak\\03-maler-infoportal-30-artikkel-_41-artikkel-jumbo-v-enkeltpersonforetak.html" }, { "lineagePattern": "maler-infoportal-artikkel-jumbo-v-velg-foretaksform", "lineagePath": "../../patterns/03-maler-infoportal-30-artikkel-_42-artikkel-jumbo-v-velg-foretaksform\\03-maler-infoportal-30-artikkel-_42-artikkel-jumbo-v-velg-foretaksform.html", "lineageState": "needsrevalidation" }], "patternLineageEExists": true, "patternDesc": "<p>Foreløpig ingen retningslinjer.</p>\n", "patternBreadcrumb": { "patternType": "organismer", "patternSubtype": "seksjoner" }, "patternExtension": "mustache", "patternName": "Sammenligning", "patternPartial": "organismer-sammenligning", "patternState": "indesignreview altinn altinnett", "patternEngineName": "mustache", "extraOutput": {} } </script> <script> /*! * scriptLoader - v0.1 * * Copyright (c) 2014 Dave Olsen, http://dmolsen.com * Licensed under the MIT license * */ var scriptLoader = { run: function(js, cb, target) { var s = document.getElementById(target + '-' + cb); for (var i = 0; i < js.length; i++) { var src = (typeof js[i] != 'string') ? js[i].src : js[i]; var c = document.createElement('script'); c.src = '../../' + src + '?' + cb; if (typeof js[i] != 'string') { if (js[i].dep !== undefined) { c.onload = function(dep, cb, target) { return function() { scriptLoader.run(dep, cb, target); } }(js[i].dep, cb, target); } } s.parentNode.insertBefore(c, s); } } } </script> <script id="pl-js-polyfill-insert-1535451812396"> (function() { if (self != top) { var cb = '1535451812396'; var js = []; if (typeof document !== 'undefined' && !('classList' in document.documentElement)) { js.push('styleguide/bower_components/classList.min.js'); } scriptLoader.run(js, cb, 'pl-js-polyfill-insert'); } })(); </script> <script id="pl-js-insert-1535451812396"> (function() { if (self != top) { var cb = '1535451812396'; var js = [{ 'src': 'styleguide/bower_components/jwerty.min.js', 'dep': ['styleguide/js/patternlab-pattern.min.js'] }]; scriptLoader.run(js, cb, 'pl-js-insert'); } })(); </script>  <script src="../../js/jquery.min.js"></script>  <script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js?lang=css&skin=sunburst"></script>  <script src="../../js/altinnPrototyping.vendor.js"></script>  <script src="./../../js/altinnPrototyping.js"></script>  <script type="text/javascript">  $(document).ready(function() { if (self === top) { var $body = 'body'; if ($('.sg-top').length) { var $panelBrsys = '.welcome-panel-brsys'; var $panelaltinn = '.welcome-panel-altinn'; switch (window.localStorage.getItem('selected_project')) { case 'altinn': $('link[href*="style.dist.altinnett.css"]').remove(); $('link[href*="style.dist.brreg.css"]').remove(); $($panelBrsys).hide(); $($panelaltinn).show(); break; case 'altinnett': $('link[href*="style.prototype.altinn.css"]').remove(); $('link[href*="style.dist.brreg.css"]').remove(); $($panelBrsys).hide(); $($panelaltinn).show(); break; case 'brsys': $('link[href*="style.prototype.altinn.css"]').remove(); $('link[href*="style.dist.altinnett.css"]').remove(); $($panelaltinn).hide(); $($panelBrsys).show(); break; default: $('link[href*="style.prototype.altinn.css"]').remove(); $('link[href*="style.dist.altinnett.css"]').remove(); $('link[href*="style.dist.brreg.css"]').attr({ href: '../../css/style.prototype.altinn.css?1535451812396', media: 'all' }); break; } } else { $('link[href*="style.prototype.altinn.css"]').remove(); $('link[href*="style.dist.altinnett.css"]').remove(); $('link[href*="style.dist.brreg.css"]').attr({ href: '../../css/style.prototype.altinn.css?1535451812396', media: 'all' }); } } }); $(window).on('load', function() { if (self === top) { var elm = document.getElementsByTagName("html")[0]; elm.style.display = "block"; } }); </script> </body> </html>