npm - @dso-toolkit/core - Versions diffs - 98.0.0 → 99.0.0 - Mend

@dso-toolkit/core 98.0.0 → 99.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (515) hide show

package/dist/collection/components/survey-rating/survey-rating.css CHANGED Viewed

@@ -106,23 +106,14 @@ label.survey-rating-1::before, label.survey-rating-1:has(input:checked) {
   --_dso-alert-error-border-color: #ce3f51;
   --_dso-alert-info-border-color: #6ca4d9;
   --_dso-alert-warning-border-color: #dcd400;
-  --link-color: currentColor;
-  --link-hover-color: currentColor;
-  --link-visited-color: currentColor;
-}
-label.survey-rating-1::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible), label.survey-rating-1:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#download-wit"));
-}
-label.survey-rating-1::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible), label.survey-rating-1:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-wit"));
-}
-label.survey-rating-1::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible), label.survey-rating-1:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#call-wit"));
-}
-label.survey-rating-1::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible), label.survey-rating-1:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#mail-outline-wit"));
-}
-label.survey-rating-1::before, label.survey-rating-1:has(input:checked) {
+  --_dso-link-color: currentColor;
+  --_dso-link-hover-color: currentColor;
+  --_dso-link-visited-color: currentColor;
+  --_dso-link-download-icon: var(--_dso-di-download-wit);
+  --_dso-link-extern-icon: var(--_dso-di-external-link-wit);
+  --_dso-link-phone-icon: var(--_dso-di-call-wit);
+  --_dso-link-mail-icon: var(--_dso-di-mail-outline-wit);
+  --_dso-link-list-chevron-icon: var(--_dso-di-chevron-right-wit);
   --_dso-icon-button-secondary-active-color: #fff;
   --_dso-icon-button-secondary-active-background-color: rgba(255, 255, 255, 0.4);
   --_dso-icon-button-secondary-toggled-color: #fff;
@@ -134,6 +125,8 @@ label.survey-rating-1::before, label.survey-rating-1:has(input:checked) {
   --_dso-icon-button-tertiary-toggled-color: #fff;
   --_dso-icon-button-tertiary-toggled-hover-color: rgba(255, 255, 255, 0.3);
   --_dso-icon-button-tertiary-disabled-color: #b2b2b2;
+  --_dso-button-tertiary-download-icon: var(--_dso-di-download-wit);
+  --_dso-button-tertiary-external-link-icon: var(--_dso-di-external-link-wit);
   --_dso-button-primary-background-color: #fff;
   --_dso-button-primary-hover-background-color: rgba(255, 255, 255, 0.8);
   --_dso-button-primary-active-background-color: #f2f2f2;
@@ -171,23 +164,14 @@ label.survey-rating-2::before, label.survey-rating-2:has(input:checked) {
   --_dso-alert-error-border-color: #ce3f51;
   --_dso-alert-info-border-color: #6ca4d9;
   --_dso-alert-warning-border-color: #dcd400;
-  --link-color: currentColor;
-  --link-hover-color: currentColor;
-  --link-visited-color: currentColor;
-}
-label.survey-rating-2::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible), label.survey-rating-2:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#download-wit"));
-}
-label.survey-rating-2::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible), label.survey-rating-2:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-wit"));
-}
-label.survey-rating-2::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible), label.survey-rating-2:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#call-wit"));
-}
-label.survey-rating-2::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible), label.survey-rating-2:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#mail-outline-wit"));
-}
-label.survey-rating-2::before, label.survey-rating-2:has(input:checked) {
+  --_dso-link-color: currentColor;
+  --_dso-link-hover-color: currentColor;
+  --_dso-link-visited-color: currentColor;
+  --_dso-link-download-icon: var(--_dso-di-download-wit);
+  --_dso-link-extern-icon: var(--_dso-di-external-link-wit);
+  --_dso-link-phone-icon: var(--_dso-di-call-wit);
+  --_dso-link-mail-icon: var(--_dso-di-mail-outline-wit);
+  --_dso-link-list-chevron-icon: var(--_dso-di-chevron-right-wit);
   --_dso-icon-button-secondary-active-color: #fff;
   --_dso-icon-button-secondary-active-background-color: rgba(255, 255, 255, 0.4);
   --_dso-icon-button-secondary-toggled-color: #fff;
@@ -199,6 +183,8 @@ label.survey-rating-2::before, label.survey-rating-2:has(input:checked) {
   --_dso-icon-button-tertiary-toggled-color: #fff;
   --_dso-icon-button-tertiary-toggled-hover-color: rgba(255, 255, 255, 0.3);
   --_dso-icon-button-tertiary-disabled-color: #b2b2b2;
+  --_dso-button-tertiary-download-icon: var(--_dso-di-download-wit);
+  --_dso-button-tertiary-external-link-icon: var(--_dso-di-external-link-wit);
   --_dso-button-primary-background-color: #fff;
   --_dso-button-primary-hover-background-color: rgba(255, 255, 255, 0.8);
   --_dso-button-primary-active-background-color: #f2f2f2;
@@ -236,23 +222,14 @@ label.survey-rating-3::before, label.survey-rating-3:has(input:checked) {
   --_dso-alert-error-border-color: #ce3f51;
   --_dso-alert-info-border-color: #6ca4d9;
   --_dso-alert-warning-border-color: #dcd400;
-  --link-color: currentColor;
-  --link-hover-color: currentColor;
-  --link-visited-color: currentColor;
-}
-label.survey-rating-3::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible), label.survey-rating-3:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#download-zwart"));
-}
-label.survey-rating-3::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible), label.survey-rating-3:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-zwart"));
-}
-label.survey-rating-3::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible), label.survey-rating-3:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#call-zwart"));
-}
-label.survey-rating-3::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible), label.survey-rating-3:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#mail-outline-zwart"));
-}
-label.survey-rating-3::before, label.survey-rating-3:has(input:checked) {
+  --_dso-link-color: currentColor;
+  --_dso-link-hover-color: currentColor;
+  --_dso-link-visited-color: currentColor;
+  --_dso-link-download-icon: var(--_dso-di-download-zwart);
+  --_dso-link-extern-icon: var(--_dso-di-external-link-zwart);
+  --_dso-link-phone-icon: var(--_dso-di-call-zwart);
+  --_dso-link-mail-icon: var(--_dso-di-mail-outline-zwart);
+  --_dso-link-list-chevron-icon: var(--_dso-di-chevron-right-zwart);
   --_dso-icon-button-secondary-active-color: #fff;
   --_dso-icon-button-secondary-active-background-color: #1f472c;
   --_dso-icon-button-secondary-toggled-color: #fff;
@@ -264,6 +241,8 @@ label.survey-rating-3::before, label.survey-rating-3:has(input:checked) {
   --_dso-icon-button-tertiary-toggled-color: #275937;
   --_dso-icon-button-tertiary-toggled-hover-color: #1b3e27;
   --_dso-icon-button-tertiary-disabled-color: #999;
+  --_dso-button-tertiary-download-icon: var(--_dso-di-download-zwart);
+  --_dso-button-tertiary-external-link-icon: var(--_dso-di-external-link-zwart);
   --_dso-button-tertiary-color: #191919;
   --_dso-button-tertiary-hover-color: #4c4c4c;
   --_dso-button-tertiary-active-color: #173521;
@@ -277,23 +256,14 @@ label.survey-rating-4::before, label.survey-rating-4:has(input:checked) {
   --_dso-alert-error-border-color: #ce3f51;
   --_dso-alert-info-border-color: #6ca4d9;
   --_dso-alert-warning-border-color: #dcd400;
-  --link-color: currentColor;
-  --link-hover-color: currentColor;
-  --link-visited-color: currentColor;
-}
-label.survey-rating-4::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible), label.survey-rating-4:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#download-zwart"));
-}
-label.survey-rating-4::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible), label.survey-rating-4:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-zwart"));
-}
-label.survey-rating-4::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible), label.survey-rating-4:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#call-zwart"));
-}
-label.survey-rating-4::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible), label.survey-rating-4:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#mail-outline-zwart"));
-}
-label.survey-rating-4::before, label.survey-rating-4:has(input:checked) {
+  --_dso-link-color: currentColor;
+  --_dso-link-hover-color: currentColor;
+  --_dso-link-visited-color: currentColor;
+  --_dso-link-download-icon: var(--_dso-di-download-zwart);
+  --_dso-link-extern-icon: var(--_dso-di-external-link-zwart);
+  --_dso-link-phone-icon: var(--_dso-di-call-zwart);
+  --_dso-link-mail-icon: var(--_dso-di-mail-outline-zwart);
+  --_dso-link-list-chevron-icon: var(--_dso-di-chevron-right-zwart);
   --_dso-icon-button-secondary-active-color: #fff;
   --_dso-icon-button-secondary-active-background-color: #1f472c;
   --_dso-icon-button-secondary-toggled-color: #fff;
@@ -305,6 +275,8 @@ label.survey-rating-4::before, label.survey-rating-4:has(input:checked) {
   --_dso-icon-button-tertiary-toggled-color: #275937;
   --_dso-icon-button-tertiary-toggled-hover-color: #1b3e27;
   --_dso-icon-button-tertiary-disabled-color: #999;
+  --_dso-button-tertiary-download-icon: var(--_dso-di-download-zwart);
+  --_dso-button-tertiary-external-link-icon: var(--_dso-di-external-link-zwart);
   --_dso-button-tertiary-color: #191919;
   --_dso-button-tertiary-hover-color: #4c4c4c;
   --_dso-button-tertiary-active-color: #173521;
@@ -318,23 +290,14 @@ label.survey-rating-5::before, label.survey-rating-5:has(input:checked) {
   --_dso-alert-error-border-color: #ce3f51;
   --_dso-alert-info-border-color: #6ca4d9;
   --_dso-alert-warning-border-color: #dcd400;
-  --link-color: currentColor;
-  --link-hover-color: currentColor;
-  --link-visited-color: currentColor;
-}
-label.survey-rating-5::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible), label.survey-rating-5:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#download-zwart"));
-}
-label.survey-rating-5::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible), label.survey-rating-5:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-zwart"));
-}
-label.survey-rating-5::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible), label.survey-rating-5:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#call-zwart"));
-}
-label.survey-rating-5::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible), label.survey-rating-5:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#mail-outline-zwart"));
-}
-label.survey-rating-5::before, label.survey-rating-5:has(input:checked) {
+  --_dso-link-color: currentColor;
+  --_dso-link-hover-color: currentColor;
+  --_dso-link-visited-color: currentColor;
+  --_dso-link-download-icon: var(--_dso-di-download-zwart);
+  --_dso-link-extern-icon: var(--_dso-di-external-link-zwart);
+  --_dso-link-phone-icon: var(--_dso-di-call-zwart);
+  --_dso-link-mail-icon: var(--_dso-di-mail-outline-zwart);
+  --_dso-link-list-chevron-icon: var(--_dso-di-chevron-right-zwart);
   --_dso-icon-button-secondary-active-color: #fff;
   --_dso-icon-button-secondary-active-background-color: #1f472c;
   --_dso-icon-button-secondary-toggled-color: #fff;
@@ -346,6 +309,8 @@ label.survey-rating-5::before, label.survey-rating-5:has(input:checked) {
   --_dso-icon-button-tertiary-toggled-color: #275937;
   --_dso-icon-button-tertiary-toggled-hover-color: #1b3e27;
   --_dso-icon-button-tertiary-disabled-color: #999;
+  --_dso-button-tertiary-download-icon: var(--_dso-di-download-zwart);
+  --_dso-button-tertiary-external-link-icon: var(--_dso-di-external-link-zwart);
   --_dso-button-tertiary-color: #191919;
   --_dso-button-tertiary-hover-color: #4c4c4c;
   --_dso-button-tertiary-active-color: #173521;
@@ -359,23 +324,14 @@ label.survey-rating-6::before, label.survey-rating-6:has(input:checked) {
   --_dso-alert-error-border-color: #ce3f51;
   --_dso-alert-info-border-color: #6ca4d9;
   --_dso-alert-warning-border-color: #dcd400;
-  --link-color: currentColor;
-  --link-hover-color: currentColor;
-  --link-visited-color: currentColor;
-}
-label.survey-rating-6::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible), label.survey-rating-6:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#download-wit"));
-}
-label.survey-rating-6::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible), label.survey-rating-6:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-wit"));
-}
-label.survey-rating-6::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible), label.survey-rating-6:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#call-wit"));
-}
-label.survey-rating-6::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible), label.survey-rating-6:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#mail-outline-wit"));
-}
-label.survey-rating-6::before, label.survey-rating-6:has(input:checked) {
+  --_dso-link-color: currentColor;
+  --_dso-link-hover-color: currentColor;
+  --_dso-link-visited-color: currentColor;
+  --_dso-link-download-icon: var(--_dso-di-download-wit);
+  --_dso-link-extern-icon: var(--_dso-di-external-link-wit);
+  --_dso-link-phone-icon: var(--_dso-di-call-wit);
+  --_dso-link-mail-icon: var(--_dso-di-mail-outline-wit);
+  --_dso-link-list-chevron-icon: var(--_dso-di-chevron-right-wit);
   --_dso-icon-button-secondary-active-color: #fff;
   --_dso-icon-button-secondary-active-background-color: rgba(255, 255, 255, 0.4);
   --_dso-icon-button-secondary-toggled-color: #fff;
@@ -387,6 +343,8 @@ label.survey-rating-6::before, label.survey-rating-6:has(input:checked) {
   --_dso-icon-button-tertiary-toggled-color: #fff;
   --_dso-icon-button-tertiary-toggled-hover-color: rgba(255, 255, 255, 0.3);
   --_dso-icon-button-tertiary-disabled-color: #b2b2b2;
+  --_dso-button-tertiary-download-icon: var(--_dso-di-download-wit);
+  --_dso-button-tertiary-external-link-icon: var(--_dso-di-external-link-wit);
   --_dso-button-primary-background-color: #fff;
   --_dso-button-primary-hover-background-color: rgba(255, 255, 255, 0.8);
   --_dso-button-primary-active-background-color: #f2f2f2;
@@ -424,23 +382,14 @@ label.survey-rating-7::before, label.survey-rating-7:has(input:checked) {
   --_dso-alert-error-border-color: #ce3f51;
   --_dso-alert-info-border-color: #6ca4d9;
   --_dso-alert-warning-border-color: #dcd400;
-  --link-color: currentColor;
-  --link-hover-color: currentColor;
-  --link-visited-color: currentColor;
-}
-label.survey-rating-7::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible), label.survey-rating-7:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#download-wit"));
-}
-label.survey-rating-7::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible), label.survey-rating-7:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-wit"));
-}
-label.survey-rating-7::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible), label.survey-rating-7:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#call-wit"));
-}
-label.survey-rating-7::before a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible), label.survey-rating-7:has(input:checked) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#mail-outline-wit"));
-}
-label.survey-rating-7::before, label.survey-rating-7:has(input:checked) {
+  --_dso-link-color: currentColor;
+  --_dso-link-hover-color: currentColor;
+  --_dso-link-visited-color: currentColor;
+  --_dso-link-download-icon: var(--_dso-di-download-wit);
+  --_dso-link-extern-icon: var(--_dso-di-external-link-wit);
+  --_dso-link-phone-icon: var(--_dso-di-call-wit);
+  --_dso-link-mail-icon: var(--_dso-di-mail-outline-wit);
+  --_dso-link-list-chevron-icon: var(--_dso-di-chevron-right-wit);
   --_dso-icon-button-secondary-active-color: #fff;
   --_dso-icon-button-secondary-active-background-color: rgba(255, 255, 255, 0.4);
   --_dso-icon-button-secondary-toggled-color: #fff;
@@ -452,6 +401,8 @@ label.survey-rating-7::before, label.survey-rating-7:has(input:checked) {
   --_dso-icon-button-tertiary-toggled-color: #fff;
   --_dso-icon-button-tertiary-toggled-hover-color: rgba(255, 255, 255, 0.3);
   --_dso-icon-button-tertiary-disabled-color: #b2b2b2;
+  --_dso-button-tertiary-download-icon: var(--_dso-di-download-wit);
+  --_dso-button-tertiary-external-link-icon: var(--_dso-di-external-link-wit);
   --_dso-button-primary-background-color: #fff;
   --_dso-button-primary-hover-background-color: rgba(255, 255, 255, 0.8);
   --_dso-button-primary-active-background-color: #f2f2f2;

package/dist/collection/components/survey-rating/survey-rating.js CHANGED Viewed

@@ -18,10 +18,10 @@ export class SurveyRating {
             "Makkelijk",
             "Heel makkelijk",
         ];
-        return (h("dso-panel", { key: '5d37cadebe4a30b60a333ae312a8ec599e9dd689', emphasized: true, onDsoCloseClick: (e) => this.dsoClose.emit({ originalEvent: e }), role: "dialog", "aria-labelledby": "panel-heading" }, h("h2", { key: '105f896f31081bd20293985ace6d7757cf354858', id: "panel-heading", slot: "heading" }, "Help ons met een onderzoek"), h("strong", { key: '08b870e41e17967458a1630ce47ce054471f8fe2' }, "Hoe moeilijk of makkelijk was deze taak om uit te voeren?"), h("form", { key: '639198b670fa1e4a986b6a3d476e026c1d50b806', onSubmit: (e) => this.handleForm(e) }, h("div", { key: '591d6e78de80f2c71b50002d9abbfbbd33c962dd', class: "visual-rating-labels", "aria-hidden": "true" }, h("span", { key: 'f9937a42a32019e48a7511d9237059242537babb' }, "Heel moeilijk"), h("span", { key: '2e0952f21cfe980b3151ea4aa78a1ef34eccf5ae' }, "Heel makkelijk")), h("div", { key: '9bac6c3b0167721de3a386db6cbeff88f122d646', role: "radiogroup" }, ratings.map((rating, index) => {
+        return (h("dso-panel", { key: '5a179ed2af0e08ca4425ff722678b4181f167079', emphasized: true, onDsoCloseClick: (e) => this.dsoClose.emit({ originalEvent: e }), role: "dialog", "aria-labelledby": "panel-heading" }, h("h2", { key: 'a9999f60adf50f4710dafd51540e070b680d86f6', id: "panel-heading", slot: "heading" }, "Help ons met een onderzoek"), h("strong", { key: '14541ee73f7eb7df7aa31540e8b36068728e4e85' }, "Hoe moeilijk of makkelijk was deze taak om uit te voeren?"), h("form", { key: '6495adf58f4eaae96b14e7b48f9ab288c706e401', onSubmit: (e) => this.handleForm(e) }, h("div", { key: 'be89bb54448a7fea343722ba19933a5c34ed2bee', class: "visual-rating-labels", "aria-hidden": "true" }, h("span", { key: 'b64fdcd408a644acac69ec4b2e8f123276d76e31' }, "Heel moeilijk"), h("span", { key: '4c5c42713f2b65a780f3d35a3aea40a5d1dd27b6' }, "Heel makkelijk")), h("div", { key: '752a3638aa3e2056a58162874b0a524c039fc74d', role: "radiogroup" }, ratings.map((rating, index) => {
             const ratingNumber = index + 1;
             return (h(Fragment, null, h("label", { class: `survey-rating-${ratingNumber}` }, ratingNumber, h("span", { class: "sr-only" }, rating), h("input", { type: "radio", name: "rating", value: ratingNumber, checked: ratingNumber === this.rating, onChange: (e) => this.handleChange(e) }))));
-        })), h("button", { key: '3cd0c53fbe1fcf6c6b77ec04365c0bec421ecf04', type: "submit", class: "dso-secondary" }, h("span", { key: 'cd5e598cfec32413f22cb6f9216637fe1c67d7ca' }, "Antwoord verzenden")))));
+        })), h("button", { key: '5b0c126c839ce6cec139ae05f090efbf856c6e23', type: "submit", class: "dso-secondary" }, h("span", { key: 'f504e4c046b4cc9bb5826bbf89c0803a93daba71' }, "Antwoord verzenden")))));
     }
     static get is() { return "dso-survey-rating"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/table.css CHANGED Viewed

@@ -209,20 +209,24 @@ label.dso-primary.dso-spinner-right::after {
 a.dso-primary.download::after,
 button.dso-primary.download::after,
 label.dso-primary.download::after {
-  background: url("./di.svg#download-wit") no-repeat center;
+  background-image: var(--_dso-di-download-wit);
+  background-repeat: no-repeat;
+  background-position: center;
   background-size: cover;
   block-size: 24px;
-  vertical-align: top;
   inline-size: 24px;
+  vertical-align: top;
 }
 a.dso-primary.extern::after,
 button.dso-primary.extern::after,
 label.dso-primary.extern::after {
-  background: url("./di.svg#external-link-wit") no-repeat center;
+  background-image: var(--_dso-di-external-link-wit);
+  background-repeat: no-repeat;
+  background-position: center;
   background-size: cover;
   block-size: 24px;
-  vertical-align: top;
   inline-size: 24px;
+  vertical-align: top;
 }
 a.dso-secondary,
 button.dso-secondary,
@@ -451,40 +455,44 @@ label.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after {
 a.dso-secondary.download::after,
 button.dso-secondary.download::after,
 label.dso-secondary.download::after {
-  background: url("./di.svg#download") no-repeat center;
+  background-image: var(--_dso-di-download-grasgroen);
+  background-repeat: no-repeat;
+  background-position: center;
   background-size: cover;
   block-size: 24px;
-  vertical-align: top;
   inline-size: 24px;
+  vertical-align: top;
 }
 a.dso-secondary.download:hover::after,
 button.dso-secondary.download:hover::after,
 label.dso-secondary.download:hover::after {
-  background-image: var(--_dso-di-background-image, url("./di.svg#download-bosgroen"));
+  background-image: var(--_dso-di-download-bosgroen);
 }
 a.dso-secondary.download[disabled]::after,
 button.dso-secondary.download[disabled]::after,
 label.dso-secondary.download[disabled]::after {
-  background-image: var(--_dso-di-background-image, url("./di.svg#download-grasgroen-40"));
+  background-image: var(--_dso-di-download-grasgroen-40);
 }
 a.dso-secondary.extern::after,
 button.dso-secondary.extern::after,
 label.dso-secondary.extern::after {
-  background: url("./di.svg#external-link") no-repeat center;
+  background-image: var(--_dso-di-external-link-grasgroen);
+  background-repeat: no-repeat;
+  background-position: center;
   background-size: cover;
   block-size: 24px;
-  vertical-align: top;
   inline-size: 24px;
+  vertical-align: top;
 }
 a.dso-secondary.extern:hover::after,
 button.dso-secondary.extern:hover::after,
 label.dso-secondary.extern:hover::after {
-  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-bosgroen"));
+  background-image: var(--_dso-di-external-link-bosgroen);
 }
 a.dso-secondary.extern[disabled]::after,
 button.dso-secondary.extern[disabled]::after,
 label.dso-secondary.extern[disabled]::after {
-  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-grasgroen-40"));
+  background-image: var(--_dso-di-external-link-grasgroen-40);
 }
 a.dso-tertiary,
 button.dso-tertiary,
@@ -762,44 +770,48 @@ label.dso-tertiary.download::after {
 a.dso-tertiary.download::after,
 button.dso-tertiary.download::after,
 label.dso-tertiary.download::after {
-  background: url("./di.svg#download") no-repeat center;
+  background-image: var(--_dso-button-tertiary-download-icon, var(--_dso-di-download-grasgroen));
+  background-repeat: no-repeat;
+  background-position: center;
   background-size: cover;
   block-size: 24px;
-  vertical-align: top;
   inline-size: 24px;
+  vertical-align: top;
 }
 a.dso-tertiary.download[disabled]::after,
 button.dso-tertiary.download[disabled]::after,
 label.dso-tertiary.download[disabled]::after {
-  background-image: var(--_dso-di-background-image, url("./di.svg#download-grasgroen-40"));
+  background-image: var(--_dso-di-download-grasgroen-40);
 }
 a.dso-tertiary.download:not([disabled]):hover::after, a.dso-tertiary.download:not([disabled]):active::after,
 button.dso-tertiary.download:not([disabled]):hover::after,
 button.dso-tertiary.download:not([disabled]):active::after,
 label.dso-tertiary.download:not([disabled]):hover::after,
 label.dso-tertiary.download:not([disabled]):active::after {
-  background-image: var(--_dso-di-background-image, url("./di.svg#download-bosgroen"));
+  background-image: var(--_dso-button-tertiary-download-icon, var(--_dso-di-download-bosgroen));
 }
 a.dso-tertiary.extern::after,
 button.dso-tertiary.extern::after,
 label.dso-tertiary.extern::after {
-  background: url("./di.svg#external-link") no-repeat center;
+  background-image: var(--_dso-button-tertiary-external-link-icon, var(--_dso-di-external-link-grasgroen));
+  background-repeat: no-repeat;
+  background-position: center;
   background-size: cover;
   block-size: 24px;
-  vertical-align: top;
   inline-size: 24px;
+  vertical-align: top;
 }
 a.dso-tertiary.extern[disabled]::after,
 button.dso-tertiary.extern[disabled]::after,
 label.dso-tertiary.extern[disabled]::after {
-  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-grasgroen-40"));
+  background-image: var(--_dso-di-external-link-grasgroen-40);
 }
 a.dso-tertiary.extern:not([disabled]):hover::after, a.dso-tertiary.extern:not([disabled]):active::after,
 button.dso-tertiary.extern:not([disabled]):hover::after,
 button.dso-tertiary.extern:not([disabled]):active::after,
 label.dso-tertiary.extern:not([disabled]):hover::after,
 label.dso-tertiary.extern:not([disabled]):active::after {
-  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-bosgroen"));
+  background-image: var(--_dso-button-tertiary-external-link-icon, var(--_dso-di-external-link-bosgroen));
 }
 a.dso-map,
 button.dso-map,
@@ -1055,14 +1067,13 @@ a.dso-secondary, a.dso-secondary:visited {
   color: #39870c;
 }
 a.dso-secondary:hover, a.dso-secondary:focus-visible {
-  color: #275937;
   text-decoration: none;
 }
 a.dso-tertiary {
   text-decoration: none;
 }
 a.dso-tertiary, a.dso-tertiary:visited {
-  color: #39870c;
+  color: var(--_dso-button-tertiary-color, #39870c);
 }
 .dso-primary + .dso-primary,

package/dist/collection/components/table/table.js CHANGED Viewed

@@ -46,7 +46,7 @@ export class Table {
     render() {
         const caption = this.host.querySelector(":scope > table > caption")?.textContent?.trim();
         const dialogLabel = caption || "Uitvergrote tabel";
-        return (h(Host, { key: '69cdc1cfab5128a370adfef088396aaba646055c', "is-responsive": this.isResponsive?.toString() }, this.modalActive && this.placeholderHeight && (h("div", { key: '0dff9b29546b769cdfcb4b10c36aa2c7bdb4954d', class: "dso-table-placeholder", style: { height: `${this.placeholderHeight}px` } })), this.modalActive ? (h("dso-modal", { modalTitle: caption ? dialogLabel : undefined, closable: true, returnFocus: false, onDsoClose: () => this.closeModal() }, !caption && (h("span", { slot: "body", class: "sr-only" }, dialogLabel)), h("div", { slot: "body", class: "dso-table-body" }, h("slot", null)))) : (h(Fragment, null, h("div", { class: "dso-table-utilities", hidden: !this.isResponsive && this.noModal }, this.isResponsive && (h("div", { class: "dso-responsive-message" }, h("span", null, "beweeg de tabel van links naar rechts"))), !this.noModal && (h("button", { type: "button", class: "dso-tertiary open-modal-button", onClick: () => this.openModal() }, h("span", { class: "sr-only" }, "tabel ", caption ?? "", " "), h("span", null, "vergroten"), h("dso-icon", { icon: "external-link" })))), h("div", { class: "dso-table-body" }, h("slot", null))))));
+        return (h(Host, { key: '4350d1d6d65139c521c8bc65ab529e868453571c', "is-responsive": this.isResponsive?.toString() }, this.modalActive && this.placeholderHeight && (h("div", { key: 'eacf5ae7b24a04140adeafdd6f5af2eb86ecfca3', class: "dso-table-placeholder", style: { height: `${this.placeholderHeight}px` } })), this.modalActive ? (h("dso-modal", { modalTitle: caption ? dialogLabel : undefined, closable: true, returnFocus: false, onDsoClose: () => this.closeModal() }, !caption && (h("span", { slot: "body", class: "sr-only" }, dialogLabel)), h("div", { slot: "body", class: "dso-table-body" }, h("slot", null)))) : (h(Fragment, null, h("div", { class: "dso-table-utilities", hidden: !this.isResponsive && this.noModal }, this.isResponsive && (h("div", { class: "dso-responsive-message" }, h("span", null, "beweeg de tabel van links naar rechts"))), !this.noModal && (h("button", { type: "button", class: "dso-tertiary open-modal-button", onClick: () => this.openModal() }, h("span", { class: "sr-only" }, "tabel ", caption ?? "", " "), h("span", null, "vergroten"), h("dso-icon", { icon: "external-link" })))), h("div", { class: "dso-table-body" }, h("slot", null))))));
     }
     openModal() {
         this.placeholderHeight = this.host.clientHeight;

package/dist/collection/components/tabs/tabs.js CHANGED Viewed

@@ -60,7 +60,7 @@ export class Tabs {
         this.mutationObserver?.disconnect();
     }
     render() {
-        return (h(Host, { key: '69cdc0bd5753cc65ff546ba1c2969c3b9ac6482c' }, h("div", { key: '4171b7b417ecfb7c3b9d69cd50b2fef583b51081', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, h("slot", { key: 'ad50f36cc2b02bd54c7646e6a36d475a76695f94' })), h("div", { key: 'b9fe37167164089894407c8d1788a749d820503c', role: "tabpanel", tabindex: "0" }, h("slot", { key: 'ea6204b048ae528b8f82b08bd4f73c0f3ada7ee0', name: "panel" }))));
+        return (h(Host, { key: '8254800bb5a0c14a3c1273229cfcb79e9c54f613' }, h("div", { key: '661d468205eef9943c2b739d784b6da07c88ae68', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, h("slot", { key: 'b9c5f5b2910af297d18af9faebdcf0a52ea4fcd4' })), h("div", { key: '1aa10670bb13fd6d10741c1b585a8b0a05467927', role: "tabpanel", tabindex: "0" }, h("slot", { key: 'a2a7595521fe4d224a6e70d27b0a6913a7729a58', name: "panel" }))));
     }
     static get is() { return "dso-tabs"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tijdreis-banner/tijdreis-banner.css CHANGED Viewed

@@ -9,23 +9,14 @@
   --_dso-alert-error-border-color: #ce3f51;
   --_dso-alert-info-border-color: #6ca4d9;
   --_dso-alert-warning-border-color: #dcd400;
-  --link-color: currentColor;
-  --link-hover-color: currentColor;
-  --link-visited-color: currentColor;
-}
-:host a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#download-wit"));
-}
-:host a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-wit"));
-}
-:host a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#call-wit"));
-}
-:host a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible) {
-  background-image: var(--_dso-di-background-image, url("./di.svg#mail-outline-wit"));
-}
-:host {
+  --_dso-link-color: currentColor;
+  --_dso-link-hover-color: currentColor;
+  --_dso-link-visited-color: currentColor;
+  --_dso-link-download-icon: var(--_dso-di-download-wit);
+  --_dso-link-extern-icon: var(--_dso-di-external-link-wit);
+  --_dso-link-phone-icon: var(--_dso-di-call-wit);
+  --_dso-link-mail-icon: var(--_dso-di-mail-outline-wit);
+  --_dso-link-list-chevron-icon: var(--_dso-di-chevron-right-wit);
   --_dso-icon-button-secondary-active-color: #fff;
   --_dso-icon-button-secondary-active-background-color: rgba(255, 255, 255, 0.4);
   --_dso-icon-button-secondary-toggled-color: #fff;
@@ -37,6 +28,8 @@
   --_dso-icon-button-tertiary-toggled-color: #fff;
   --_dso-icon-button-tertiary-toggled-hover-color: rgba(255, 255, 255, 0.3);
   --_dso-icon-button-tertiary-disabled-color: #b2b2b2;
+  --_dso-button-tertiary-download-icon: var(--_dso-di-download-wit);
+  --_dso-button-tertiary-external-link-icon: var(--_dso-di-external-link-wit);
   --_dso-button-primary-background-color: #fff;
   --_dso-button-primary-hover-background-color: rgba(255, 255, 255, 0.8);
   --_dso-button-primary-active-background-color: #f2f2f2;

package/dist/collection/components/tijdreis-banner/tijdreis-banner.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { Fragment, h } from "@stencil/core";
 export class TijdreisBanner {
     render() {
-        return (h(Fragment, { key: 'a20b08110a3df8900f6de701bcb3bc6b4d485984' }, h("dso-icon", { key: '778139814e1dc3de82f955047319acb38efc4b0c', icon: "clock-outline" }), h("slot", { key: '45e6529857a046f7bbec4fd0098689e7dddffa02' }), h("slot", { key: '251d8dd8f53477b8b7053b417f0d2f5a3d9739e1', name: "button" })));
+        return (h(Fragment, { key: '25db11ceca193a6e71a0f79195d2da21c0472a6b' }, h("dso-icon", { key: 'd2a57ce5abf585189544447392f2b8361c458290', icon: "clock-outline" }), h("slot", { key: '465b99fb06bed30fd16c96045b81e335fdf65aa8' }), h("slot", { key: '66cd4ee75e30476429d60ce093c95c6534151d31', name: "button" })));
     }
     static get is() { return "dso-tijdreis-banner"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tooltip/tooltip.css CHANGED Viewed

@@ -22,7 +22,7 @@
   word-spacing: normal;
   overflow-wrap: normal;
   white-space: normal;
-  --link-color: #39870c;
+  --_dso-link-color: #39870c;
   display: block;
   filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.4));
   font-size: 14px;

package/dist/collection/components/tooltip/tooltip.js CHANGED Viewed

@@ -186,7 +186,7 @@ export class Tooltip {
         }
     }
     render() {
-        return (h(Host, { key: '1831f694a8e5514eed8e5d8788636d4a6d02e07b', class: { hidden: this.hidden }, role: "tooltip", onClick: this.listenClick }, h("div", { key: '8495fc83da43cd9dc032056a70b293b8c64ed174', class: clsx("tooltip", { in: this.active }) }, !this.noArrow && h("div", { key: 'd0e810eb07ca36b02a30fade6bd8e0aebccd3c5d', "data-popper-arrow": true, class: "tooltip-arrow" }), h("div", { key: '9f91c5b9a9cff0edf1ed7b278a90f75cb12ffb00', "aria-hidden": !this.descriptive || undefined, class: clsx("tooltip-inner", { "dso-small": this.small }) }, h("slot", { key: '59baf2ab49437a757728340931970f8de2652da6' })))));
+        return (h(Host, { key: '925fdfa915cf6fa74880c939e7970009a8cfff7f', class: { hidden: this.hidden }, role: "tooltip", onClick: this.listenClick }, h("div", { key: 'ec46d37fc08aea82c5f9b125cd495879049f405b', class: clsx("tooltip", { in: this.active }) }, !this.noArrow && h("div", { key: '773fbbce39f5c4e952acce7e1b3600f449829487', "data-popper-arrow": true, class: "tooltip-arrow" }), h("div", { key: '2dc12b827958b298930f5714ca2386ffae7ad5d7', "aria-hidden": !this.descriptive || undefined, class: clsx("tooltip-inner", { "dso-small": this.small }) }, h("slot", { key: 'b1dda0bd5e39515a70205a24610ed254a5cbbda2' })))));
     }
     activatePopper() {
         this.hidden = false;

package/dist/collection/components/tree-view/tree-view.js CHANGED Viewed

@@ -170,7 +170,7 @@ export class TreeView {
         return false;
     }
     render() {
-        return (h("div", { key: 'b7a5d643eea6e407e4c31660b8f004511f409984', id: "tree", class: "dso-tree", onKeyDown: (e) => this.keyDownListener(e), ref: (element) => (this.tree = element) }, h("ul", { key: '6d90ef1fef5afe13eb13fc37605e3a7026c710ba', role: "tree", "aria-label": "Objectenboom" }, this.collection?.map((item, index) => (h(DsoTreeItem, { owner: this, ancestors: [], item: item, index: index, level: 1, setSize: this.collection.length }))))));
+        return (h("div", { key: '9126ca8ab9534c5499b493bf511a8a042d78986e', id: "tree", class: "dso-tree", onKeyDown: (e) => this.keyDownListener(e), ref: (element) => (this.tree = element) }, h("ul", { key: 'e9a7780673b7b1eed4bf6af470e7d61691fd30a8', role: "tree", "aria-label": "Objectenboom" }, this.collection?.map((item, index) => (h(DsoTreeItem, { owner: this, ancestors: [], item: item, index: index, level: 1, setSize: this.collection.length }))))));
     }
     static get is() { return "dso-tree-view"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/viewer-grid/viewer-grid.css CHANGED Viewed

@@ -623,7 +623,6 @@ slot[name=legend] {
   display: flex;
   flex-direction: row;
   align-items: flex-start;
-  block-size: auto;
   overflow: visible;
   flex-shrink: 0;
   order: -1;
@@ -632,7 +631,7 @@ slot[name=legend] {
   flex: 1;
   min-inline-size: 0;
   align-self: stretch;
-  min-block-size: 400px;
+  block-size: 400px;
   position: relative;
   inset: auto;
 }
@@ -649,7 +648,7 @@ slot[name=legend] {
   max-inline-size: none;
   min-inline-size: 0;
   position: relative;
-  margin-inline-start: 0px;
+  margin-inline-start: 0;
 }
 :host([print]) .dso-main-panel .content {
   align-items: flex-start;
@@ -686,4 +685,8 @@ slot[name=legend] {
 :host([print]) .dso-document-panel .content {
   block-size: auto;
   overflow-y: visible;
+}
+:host([print]) .sizing-buttons,
+:host([print]) .toggle-button {
+  display: none;
 }