@navikt/ds-css 7.32.4 → 7.33.0

package/modal.css

@@ -1,3 +1,4 @@
+/* TODO: Remove in v8 */
 .navds-modal__document-body {
   overflow: hidden;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/ds-css",
-  "version": "7.32.4",
+  "version": "7.33.0",
   "description": "CSS for Nav Designsystem",
   "author": "Aksel | Nav designsystem team",
   "keywords": [
@@ -21,6 +21,10 @@
     "url": "git+https://github.com/navikt/aksel.git",
     "directory": "@navikt/core/css"
   },
+  "bugs": {
+    "url": "https://github.com/navikt/aksel/issues"
+  },
+  "homepage": "https://aksel.nav.no/designsystemet/",
   "scripts": {
     "build": "node config/bundle.js && yarn build:darkside",
     "css:get-version": "node config/get-version.js",
@@ -28,7 +32,7 @@
     "test": "yarn build && vitest run"
   },
   "devDependencies": {
-    "@navikt/ds-tokens": "^7.32.4",
+    "@navikt/ds-tokens": "^7.33.0",
     "autoprefixer": "^10.4.20",
     "browserslist": "^4.25.0",
     "cssnano": "7.1.1",

package/process.css

@@ -23,7 +23,11 @@
 
     margin-block-start: calc((var(--__ac-process-circle-small) / 2) * -1);
 
-    & .navds-process__line {
+    & .navds-process__line[data-position="start"] {
+      margin-block-end: calc(var(--__ac-process-circle-size) / 2 * -1);
+    }
+
+    & .navds-process__line[data-position="end"] {
       margin-block-start: calc(var(--__ac-process-circle-size) / 2);
     }
 
@@ -41,15 +45,51 @@
   min-height: 2rem;
   justify-self: center;
   grid-column: 1;
-  grid-row: line-2;
   border-color: var(--a-border-subtle);
 
+  &[data-position="start"] {
+    grid-row: line-1;
+
+    .navds-process__event[data-status="active"] & {
+      border-image: none;
+    }
+
+    .navds-process__event:first-of-type & {
+      border-start-start-radius: 4px;
+      border-start-end-radius: 4px;
+      min-height: 1.5rem;
+    }
+
+    .navds-process__event:not(:first-of-type) &,
+    .navds-process:is(:not([data-truncated="start"], [data-truncated="both"])) & {
+      display: none;
+    }
+  }
+
+  &[data-position="end"] {
+    grid-row: line-2;
+
+    .navds-process:is(:not([data-truncated="end"], [data-truncated="both"])) .navds-process__event:last-of-type & {
+      display: none;
+    }
+
+    .navds-process__event:last-of-type & {
+      border-end-start-radius: 4px;
+      border-end-end-radius: 4px;
+      min-height: 1.5rem;
+    }
+  }
+
   .navds-process__event[data-status="active"] & {
     border-color: var(--a-border-alt-3);
     border-image: linear-gradient(to bottom, var(--a-border-alt-3) 50%, var(--a-border-subtle) 90%);
     border-image-slice: 1;
   }
 
+  .navds-process__event[data-status="active"]:last-of-type & {
+    border-image: none;
+  }
+
   .navds-process__event[data-status="completed"] & {
     border-color: var(--a-border-alt-3);
   }
@@ -58,7 +98,7 @@
     border-image: none;
   }
 
-  .navds-process__event:last-of-type & {
+  .navds-process__event:last-of-type:is([data-connector="auto"]) & {
     display: none;
   }
 }

package/dist/darkside/version/7.32.4/component/modal.min.css

@@ -1 +0,0 @@
-@layer aksel.components{.aksel-modal__document-body{overflow:hidden}.aksel-modal{--__axc-modal-bg: var(--ax-bg-raised);background-color:var(--__axc-modal-bg);border:1px solid var(--ax-border-neutral-subtleA);border-radius:var(--ax-radius-12);box-shadow:var(--ax-shadow-dialog);max-width:100%;max-height:100%;color:var(--ax-text-neutral);margin:auto;padding:0;position:fixed}.aksel-modal[open]{flex-direction:column;animation:.7s cubic-bezier(.15,1,.3,1) akselModalFadeIn;display:flex}.aksel-modal--polyfilled{width:fit-content;height:fit-content;margin:auto;top:50%;left:0;right:0;transform:translateY(-50%)}.aksel-modal--polyfilled:not([open]){display:none}.aksel-modal--polyfilled .aksel-modal--polyfilled{overflow:auto}._dialog_overlay{position:fixed;inset:0}.aksel-modal--medium{width:700px}.aksel-modal--small{width:450px}.aksel-modal--small .aksel-modal__header,.aksel-modal--small .aksel-modal__body{padding:var(--ax-space-12) var(--ax-space-16)}.aksel-modal--small .aksel-modal__footer{padding-block:var(--ax-space-12) var(--ax-space-16);padding-inline:var(--ax-space-16)}@media(min-width:480px){.aksel-modal{max-width:calc(100% - 2em)}.aksel-modal--autowidth{max-width:min(700px,100% - 2em)}}@media(min-height:480px){.aksel-modal{max-height:calc(100% - 2em)}.aksel-modal--top{max-height:calc(100% - 4em);margin-top:2em}}.aksel-modal::backdrop{background:#021431cc;animation:.7s cubic-bezier(.15,1,.3,1) akselModalBackdropFadeIn}.aksel-modal--polyfilled+.backdrop{background:#021431cc;position:fixed;inset:0}.aksel-modal__button{margin-left:var(--ax-space-16);float:right}.aksel-modal__header{padding:var(--ax-space-16) var(--ax-space-20)}.aksel-modal__header-icon svg{vertical-align:-.25rem;margin-right:var(--ax-space-4);display:inline}.aksel-modal__label{font-weight:var(--ax-font-weight-bold);color:var(--ax-text-neutral-subtle)}.aksel-modal__body{padding:var(--ax-space-16) var(--ax-space-20);overscroll-behavior:contain;background:linear-gradient(var(--__axc-modal-bg) 30%,transparent) top,linear-gradient(transparent,var(--__axc-modal-bg) 60%) bottom,radial-gradient(farthest-side at 50% 0,rgba(0,0,0,.3),transparent) top,radial-gradient(farthest-side at 50% 100%,rgba(0,0,0,.3),transparent) bottom;background-repeat:no-repeat;background-size:100% 40px,100% 50px,100% 16px,100% 16px;background-attachment:local,local,scroll,scroll;position:relative;overflow:auto}.aksel-modal__header+.aksel-modal__body{padding-top:var(--ax-space-0)}.aksel-modal__footer{gap:var(--ax-space-16);padding-block:var(--ax-space-16) var(--ax-space-20);padding-inline:var(--ax-space-20);flex-flow:row-reverse wrap;display:flex}.aksel-modal__footer :nth-of-type(2){margin-left:auto}.aksel-modal--polyfilled .aksel-modal--polyfilled.aksel-date__nested-modal{min-width:fit-content;max-width:100vw;max-height:100vh;animation:none}@keyframes akselModalFadeIn{0%{opacity:.0001;transform:translate3d(0,4px,0)}50%{opacity:1}to{transform:none}}@keyframes akselModalBackdropFadeIn{0%{opacity:.0001}50%{opacity:1}to{opacity:1}}@media(forced-colors:active){.aksel-modal{outline:2px solid rgba(0,0,0,0)}}}

package/dist/darkside/version/7.32.4/component/process.min.css

@@ -1 +0,0 @@
-@layer aksel.components{.aksel-process{--__axc-process-circle-base: 2rem;--__axc-process-circle-large: var(--__axc-process-circle-base);--__axc-process-circle-small: 1rem;--__axc-process-circle-size: var(--__axc-process-circle-large);--__axc-process-border-width: 2px;margin:0;padding:0;list-style:none}.aksel-process__event{grid-template-rows:[line-1] auto [step-start] var(--__axc-process-circle-size) [line-2 step-end] auto;grid-template-columns:var(--__axc-process-circle-base) auto;justify-items:flex-start;display:grid}.aksel-process__event[data-dot=true]{--__axc-process-circle-size: var(--__axc-process-circle-small);margin-block-start:calc((var(--__axc-process-circle-small) / 2) * -1)}.aksel-process__event[data-dot=true] .aksel-process__line{margin-block-start:calc(var(--__axc-process-circle-size) / 2)}.aksel-process__event[data-dot=true] .aksel-process__bullet{--__axc-process-circle-size: var(--__axc-process-circle-small);margin-top:calc((var(--__axc-process-circle-large) - var(--__axc-process-circle-small)) / 2)}.aksel-process__line{border:calc(var(--__axc-process-border-width) / 2) solid;border-color:var(--ax-border-neutral-subtle);grid-area:line-2 / 1;justify-self:center;width:0;min-height:2rem}.aksel-process__event[data-status=active] .aksel-process__line{border-color:var(--ax-border-default);border-image:linear-gradient(to bottom,var(--ax-border-default) 50%,var(--ax-border-neutral-subtle) 90%);border-image-slice:1}.aksel-process__event[data-status=completed] .aksel-process__line{border-color:var(--ax-border-default)}.aksel-process__event:not([data-status=active]) .aksel-process__line{border-image:}.aksel-process__event:last-of-type .aksel-process__line{display:none}.aksel-process__item{grid-area:2 / 1 / -1 / -1;grid-template-columns:[bullet] var(--__axc-process-circle-base) [content] auto;gap:var(--ax-space-16);padding:var(--__axc-process-border-width);margin:calc(var(--__axc-process-border-width) * -1) calc(var(--__axc-process-border-width) * -1) var(--ax-space-16);justify-content:flex-start;width:100%;display:grid}.aksel-process__event:last-child .aksel-process__item{margin-bottom:0}.aksel-process__bullet{width:var(--__axc-process-circle-size);height:var(--__axc-process-circle-size);border-radius:var(--ax-radius-full);border:var(--__axc-process-border-width) solid;color:var(--ax-text-neutral-subtle);border-color:var(--ax-border-neutral-subtleA);grid-column:bullet;place-self:baseline center;place-items:center;line-height:1;transition-property:background,border-color;transition-duration:70ms;transition-timing-function:linear;display:inline-grid}.aksel-process__bullet svg{height:min(calc(var(--__axc-process-circle-size) * .75),1.5rem);width:min(calc(var(--__axc-process-circle-size) * .75),1.5rem)}.aksel-process__event:is([data-status=completed],[data-status=active]) .aksel-process__bullet{color:var(--ax-text-contrast);background:var(--ax-bg-strong);border-color:#0000}.aksel-process__event[data-status=active] .aksel-process__bullet{z-index:1;box-shadow:0 0 0 2px var(--ax-bg-default);outline:2px solid var(--ax-bg-strong);outline-offset:2px}.aksel-process__event[data-status=uncompleted] .aksel-process__bullet{transition:none}.aksel-process__body{grid-column:content}.aksel-process__title{padding-block:.16rem var(--ax-space-4)}.aksel-process__event[data-status=active] .aksel-process__title:has(+.aksel-process__active-label){padding-block-end:0}.aksel-process__active-label{margin-block:0 var(--ax-space-4);color:var(--ax-text-subtle)}.aksel-process__active-label:last-of-type{margin-block-end:0}@media(forced-colors:active){.aksel-process__bullet{transition:none}.aksel-process__event:is([data-status=completed],[data-status=active]) .aksel-process__bullet{color:buttonface;forced-color-adjust:none;background-color:buttontext;outline-color:buttontext}.aksel-process__event[data-status=active] .aksel-process__bullet{box-shadow:0 0 0 2px canvas}.aksel-process__event[data-status=active] .aksel-process__line{border-image:}}}