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

@dso-toolkit/core 98.0.0 → 99.1.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 (529) 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: '5a4099fc5d6ce14b20b587d8e62bfc11918b6d86', emphasized: true, onDsoCloseClick: (e) => this.dsoClose.emit({ originalEvent: e }), role: "dialog", "aria-labelledby": "panel-heading" }, h("h2", { key: 'f03325417ab807016ccefcfa24a4da835f4dbb68', id: "panel-heading", slot: "heading" }, "Help ons met een onderzoek"), h("strong", { key: '6ef7c26ffde99057fcf886ef0316788127d420d2' }, "Hoe moeilijk of makkelijk was deze taak om uit te voeren?"), h("form", { key: 'eb8514e4cc4e89bc55c49d0976a9c3ecf653efa7', onSubmit: (e) => this.handleForm(e) }, h("div", { key: '68fea48419eac3912dc30ef73949aaa832c1a871', class: "visual-rating-labels", "aria-hidden": "true" }, h("span", { key: 'fca067c067668615de7808598625480acb9b2eaf' }, "Heel moeilijk"), h("span", { key: '51a76e96cba6667434b244244a02c5534b8d4f03' }, "Heel makkelijk")), h("div", { key: '9d6477945ef3676a2b5b083546aa896c59c9bac6', 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: '659e0df5fee571799ec9bf0a56dff2ea909b871c', type: "submit", class: "dso-secondary" }, h("span", { key: '4062e16418955a900706e9d98fc653b1fbc70dd8' }, "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: '002a89f3ef0418d8833d15c5b3fbf7c8718f46c7', "is-responsive": this.isResponsive?.toString() }, this.modalActive && this.placeholderHeight && (h("div", { key: '96e3812f62c4a2dc1a08b9e54c525b08a0c71a5e', 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: '4a44a3f5b4183fba668eb37e9083bb71866aef9a' }, h("div", { key: 'cbf2e18cc35725d846549d557bead0d8133a278b', class: "tabs", role: "tablist", onKeyUp: this.keyUpHandler }, h("slot", { key: 'cafbccebd54d9ec8002b5595fc02b0d3a11a5471' })), h("div", { key: 'a86c75fc090ae36b4fcae2b8ff9cb4433cbca18b', role: "tabpanel", tabindex: "0" }, h("slot", { key: '83ed8f4078f347d8a43682cbeca57a52a996be9c', 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: 'ef5f6d647c3998d1bd562a904470710e1bbb1177' }, h("dso-icon", { key: 'af96dc3009774785a74fe60fe71271f3d30b4c6d', icon: "clock-outline" }), h("slot", { key: '92be636223afd77de6f5ec34ff2b9761961a18c6' }), h("slot", { key: '6113c5ba3be8f56779da8548e8153dbdd0f70e59', name: "button" })));
     }
     static get is() { return "dso-tijdreis-banner"; }
     static get encapsulation() { return "shadow"; }

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

@@ -22,10 +22,10 @@
   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;
+  font-size: 0.875rem;
   opacity: 0;
   position: absolute;
   transition: opacity 0.15s linear;

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: 'd2293d3a4c732b2baf750ae941d5c9589202afe5', class: { hidden: this.hidden }, role: "tooltip", onClick: this.listenClick }, h("div", { key: 'a31be198ba1b8972ea5b1b85569294b8bb6f08c8', class: clsx("tooltip", { in: this.active }) }, !this.noArrow && h("div", { key: 'e9394ee672085986caf5b2b67f859e95bb449ec0', "data-popper-arrow": true, class: "tooltip-arrow" }), h("div", { key: '9aa15980b1cb905cb5cff9e5d70e6d8423c1985e', "aria-hidden": !this.descriptive || undefined, class: clsx("tooltip-inner", { "dso-small": this.small }) }, h("slot", { key: '91d6af37985c5d236633bd92484d50a30cced3f6' })))));
     }
     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: 'ad891987ac4fbf1120c72bf99baf49065b027d1a', id: "tree", class: "dso-tree", onKeyDown: (e) => this.keyDownListener(e), ref: (element) => (this.tree = element) }, h("ul", { key: 'ee5eb8e7c3fafc0474e611e0472fa1c7353042d1', 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;
 }