@oiz/stzh-components 4.0.0-beta3 → 4.0.0

package/dist/collection/components/stzh-ratio/stzh-ratio.js

@@ -16,7 +16,7 @@ export class StzhRatio {
         const classes = {
             "stzh-ratio": true,
         };
-        return (h(Host, { key: '69130dc906bacaaa8e317d3bf9415e5ba60cf7d4' }, h("div", { key: '929f50068591cffe4c0b26fa3a01ad43c7cc374b', class: classes }, h("slot", { key: '5a56a2c9bed157f1c88b909cf27c381ca33dd660' }))));
+        return (h(Host, { key: '69130dc906bacaaa8e317d3bf9415e5ba60cf7d4' }, h("div", { key: '929f50068591cffe4c0b26fa3a01ad43c7cc374b', class: classes }, h("slot", { key: 'ec8675047fc223e66fdc5f875b6bf8f6b734d7f8', name: "image" }), h("slot", { key: '41e2fb57245933c45e0d1030d4737eb6ce424fdd' }))));
     }
     static get is() { return "stzh-ratio"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stzh-ratio/stzh-ratio.js.map

@@ -1 +1 @@
-{"version":3,"file":"stzh-ratio.js","sourceRoot":"","sources":["../../../../src/components/stzh-ratio/stzh-ratio.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAIlE;;GAEG;AAMH,MAAM,OAAO,SAAS;;qBAE2B,MAAM;0BAEW,SAAS;2BAER,SAAS;0BAEV,SAAS;0BAET,SAAS;wBAG5B,KAAK;mBAGE,OAAO;;IAI3D,MAAM;QACJ,MAAM,OAAO,GAAG;YACd,YAAY,EAAE,IAAI;SACnB,CAAC;QAEF,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAE,OAAO;gBACjB,8DAAa,CACT,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, h, Host, Prop } from \"@stencil/core\";\n\nimport { Layout } from \"../../index\";\n\n/**\n * @slot - Slot for e.g. image or video\n */\n@Component({\n  tag: \"stzh-ratio\",\n  styleUrl: \"stzh-ratio.scss\",\n  shadow: true,\n})\nexport class StzhRatio {\n  /** Aspect ratio */\n  @Prop({ reflect: true }) ratio: Layout.Ratio = \"16:9\";\n  /** Aspect ratio above small breakpoint */\n  @Prop({ reflect: true }) ratioSmall: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above medium breakpoint */\n  @Prop({ reflect: true }) ratioMedium: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above large breakpoint */\n  @Prop({ reflect: true }) ratioLarge: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above ultra breakpoint */\n  @Prop({ reflect: true }) ratioUltra: Layout.Ratio | \"inherit\" = \"inherit\";\n\n  /** Whether aspect ratio is in portrait mode */\n  @Prop({ reflect: true }) portrait: boolean = false;\n\n  /** Fit mode */\n  @Prop({ reflect: true }) fit: \"cover\" | \"contain\" = \"cover\";\n\n  @Element() element: HTMLStzhRatioElement;\n\n  render() {\n    const classes = {\n      \"stzh-ratio\": true,\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"stzh-ratio.js","sourceRoot":"","sources":["../../../../src/components/stzh-ratio/stzh-ratio.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAIlE;;GAEG;AAMH,MAAM,OAAO,SAAS;;qBAE2B,MAAM;0BAEW,SAAS;2BAER,SAAS;0BAEV,SAAS;0BAET,SAAS;wBAG5B,KAAK;mBAGE,OAAO;;IAI3D,MAAM;QACJ,MAAM,OAAO,GAAG;YACd,YAAY,EAAE,IAAI;SACnB,CAAC;QAEF,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAE,OAAO;gBACjB,6DAAM,IAAI,EAAC,OAAO,GAAQ;gBAC1B,8DAAa,CACT,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, h, Host, Prop } from \"@stencil/core\";\n\nimport { Layout } from \"../../index\";\n\n/**\n * @slot - Slot for e.g. image or video\n */\n@Component({\n  tag: \"stzh-ratio\",\n  styleUrl: \"stzh-ratio.scss\",\n  shadow: true,\n})\nexport class StzhRatio {\n  /** Aspect ratio */\n  @Prop({ reflect: true }) ratio: Layout.Ratio = \"16:9\";\n  /** Aspect ratio above small breakpoint */\n  @Prop({ reflect: true }) ratioSmall: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above medium breakpoint */\n  @Prop({ reflect: true }) ratioMedium: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above large breakpoint */\n  @Prop({ reflect: true }) ratioLarge: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above ultra breakpoint */\n  @Prop({ reflect: true }) ratioUltra: Layout.Ratio | \"inherit\" = \"inherit\";\n\n  /** Whether aspect ratio is in portrait mode */\n  @Prop({ reflect: true }) portrait: boolean = false;\n\n  /** Fit mode */\n  @Prop({ reflect: true }) fit: \"cover\" | \"contain\" = \"cover\";\n\n  @Element() element: HTMLStzhRatioElement;\n\n  render() {\n    const classes = {\n      \"stzh-ratio\": true,\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <slot name=\"image\"></slot>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/stzh-readspeaker/stzh-readspeaker.css

@@ -666,8 +666,8 @@ stzh-readspeaker .stzh-fylingfocus-focused::-moz-focus-inner {
   font-family: var(--stzh-font-family-medium);
   font-weight: var(--stzh-font-weight-medium);
   font-style: var(--stzh-font-style-medium);
-  font-size: var(--stzh-font-pico-font-size);
-  line-height: var(--stzh-font-pico-text-line-height);
+  font-size: var(--stzh-font-micro-font-size);
+  line-height: var(--stzh-font-micro-text-line-height);
   border-radius: 0px;
   border: none;
   box-shadow: none;
@@ -804,8 +804,8 @@ stzh-readspeaker .stzh-fylingfocus-focused::-moz-focus-inner {
   font-family: var(--stzh-font-family-medium);
   font-weight: var(--stzh-font-weight-medium);
   font-style: var(--stzh-font-style-medium);
-  font-size: var(--stzh-font-pico-font-size);
-  line-height: var(--stzh-font-pico-text-line-height);
+  font-size: var(--stzh-font-micro-font-size);
+  line-height: var(--stzh-font-micro-text-line-height);
   z-index: var(--stzh-z-index-popup);
   border: none;
   border-radius: 0px;

package/dist/collection/components/stzh-readspeaker/stzh-readspeaker.js

@@ -192,9 +192,9 @@ export class StzhReadspeaker {
             "stzh-readspeaker": true,
             rs_skip: true, // will prevent component being read by readspeaker
         };
-        return (h(Host, { key: 'ad65dd6253ea946a17f905c86b80b50e1d815cb2' }, h("div", { key: '62d0b35ec6663af893e21389b80cb02022c3e171', class: classes }, h("div", { key: '41475c2930ade685a3cee9505db621ec03b41047', class: "stzh-readspeaker__actions" }, h("div", { key: '362eb32bdae38f5de4263dac06a8908d10a8e7c1', ref: el => (this.triggerElement = el), class: "stzh-readspeaker__trigger" }, h("slot", { key: 'e4de817898ea795d673c09744379c5216d121e53' })), h("stzh-button", { key: '09139eac9295ff60d4f229ab95852b8b5f967537', class: "stzh-readspeaker__close", variant: "tertiary", size: "small", icon: "close-big", iconOnly: true, onClick: () => {
+        return (h(Host, { key: 'c1f32d69379cf08aa871829eb87e6f210786ab11' }, h("div", { key: '96e2036fc814e90e161b2b5afce5e6421f3609c2', class: classes }, h("div", { key: '3f3b638ccb29c670c7081d2d6f4bd8823064ef0f', class: "stzh-readspeaker__actions" }, h("div", { key: 'da2bbbc7e18da2566429a74587eeced1c3b4e173', ref: el => (this.triggerElement = el), class: "stzh-readspeaker__trigger" }, h("slot", { key: '33d7183bbf5350b7ed54f6a0ea4d2846038b1a24' })), h("stzh-button", { key: 'ce8b4c874e1144a311f7e38554a8882a90c196fc', class: "stzh-readspeaker__close", variant: "tertiary", size: "small", icon: "close-big", iconOnly: true, onClick: () => {
                 this.closePlayer();
-            } })), h("div", { key: '4c66ea949e129c6ef4de232a8fe888e957155099', id: this.readspeakerId, class: "rs_addtools rs_splitbutton rs_preserve rs_skip rs_exp" }))));
+            } })), h("div", { key: 'b88f87a0ef0acf56c285636ebff71411e11c7d8b', id: this.readspeakerId, class: "rs_addtools rs_splitbutton rs_preserve rs_skip rs_exp" }))));
     }
     static get is() { return "stzh-readspeaker"; }
     static get originalStyleUrls() {

package/dist/collection/components/stzh-richtext/stzh-richtext.js

@@ -51,7 +51,7 @@ export class StzhRichtext {
         const classes = {
             "stzh-richtext": true,
         };
-        return (h(Host, { key: '0380348ada233e8a6a7c5f21ce91abf382848fc4', "has-hidden-first-margin": typeof this.removeFirstMargin === "boolean" ? this.removeFirstMargin : true, "has-hidden-last-margin": typeof this.removeLastMargin === "boolean" ? this.removeLastMargin : true }, h("div", { key: '80b7f4fe36a879c801997fee0eb9aae03dea623a', class: classes }, h("div", { key: '506bb03dc3f4e8e06d583b5f0fdf81e05bff9010', class: "stzh-richtext__text" }, h("slot", { key: 'c12cb11fb9f95ac972a6c94b15430fe6cb3ae73a' })))));
+        return (h(Host, { key: '8d4cfa5bd967bc015772f798fe7792c36331d845', "has-hidden-first-margin": typeof this.removeFirstMargin === "boolean" ? this.removeFirstMargin : true, "has-hidden-last-margin": typeof this.removeLastMargin === "boolean" ? this.removeLastMargin : true }, h("div", { key: 'bd446dfa6c8008c4681147a4a0cfa060aa641371', class: classes }, h("div", { key: '1f7c621b874d789931bd0ba786c1af258f790ca6', class: "stzh-richtext__text" }, h("slot", { key: 'ca853998227e5d2321def1fead06e533de75e0f1' })))));
     }
     static get is() { return "stzh-richtext"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/stzh-row/stzh-row.js

@@ -14,12 +14,12 @@ export class StzhRow {
         this.content = "start";
     }
     render() {
-        return (h(Host, { key: '6407dc8ee26e81fcb5d9f8e2d4a0d7b24c7e5b41' }, h("div", { key: '8d0b0130c7f58f8b34b4c1ae7bb5376bcc423f18', class: {
+        return (h(Host, { key: '0790a6e16fdba80673274f0b48c0d3985b8e5232' }, h("div", { key: '8eff8f37798efa0dd19bb23ca9eb238cfb27dcbb', class: {
                 "stzh-row": true,
                 [`stzh-row--justify-${this.justify}`]: !!this.justify,
                 [`stzh-row--items-${this.items}`]: !!this.items,
                 [`stzh-row--content-${this.content}`]: !!this.content
-            } }, h("slot", { key: '7bb6c474b112e3336e27bedd3269fefce07c1081' }))));
+            } }, h("slot", { key: '69ae1cdb79028780194d989f1b2a970815b20b0a' }))));
     }
     static get is() { return "stzh-row"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stzh-saptcha/stzh-saptcha.js

@@ -63,10 +63,10 @@ export class StzhSaptcha {
         const classes = {
             "stzh-saptcha": true
         };
-        return (h(Host, { key: '508b36f8f986b1303704958ad7f34a27e429211a', "is-invalid": this.invalid || this._error.length > 0 }, h("div", { key: 'ba990346a4d626d186c2166d5514e3a50d5c5538', class: classes }, h("div", { key: '1ea9a21683d19d4c57a87d9512e7c1579079de41', class: "stzh-saptcha__box" }, h("div", { key: '59c4cdc97b9ce1560740e520915f0ed0cfc90dce', class: "stzh-saptcha__info", id: `${this.saptchaId}-info` }, this.localization.info, " ", this.localization.question), h("div", { key: 'e1977df6b777f2ddca39644915426bb409bf60e9', class: "stzh-saptcha__answer", id: `${this.saptchaId}-answer` }, this._numbers.map((number, index) => h("span", { class: "stzh-saptcha__number" }, number, index < this._numbers.length - 1 &&
+        return (h(Host, { key: '45e5ae9ea931d92609563149eb17d9937ad8b018', "is-invalid": this.invalid || this._error.length > 0 }, h("div", { key: 'aa77d54b4c91a597d2f8f00b1209d6ffc603ec95', class: classes }, h("div", { key: '860279d1b6887f7c6a099d8ee22e5121309787a4', class: "stzh-saptcha__box" }, h("div", { key: '731eaaf5d33d96fd1f4a0960ece20ffa6cc742ba', class: "stzh-saptcha__info", id: `${this.saptchaId}-info` }, this.localization.info, " ", this.localization.question), h("div", { key: 'b01a02570a163ea216d89c17f16aef60d1515958', class: "stzh-saptcha__answer", id: `${this.saptchaId}-answer` }, this._numbers.map((number, index) => h("span", { class: "stzh-saptcha__number" }, number, index < this._numbers.length - 1 &&
             (index === this._numbers.length - 2
                 ? this.localization.answerOr
-                : ", ")))), h("stzh-input", { key: '4e187d4e881c210f2ec833020a6ddb3ae201fddd', class: "stzh-saptcha__input", label: this.localization.answer, name: this.name, invalid: this.invalid, error: this.error, disabled: this.disabled, value: this.value, onStzhChange: this.onInputChange, required: true, a11yDescribedby: `${this.saptchaId}-info ${this.saptchaId}-answer` })))));
+                : ", ")))), h("stzh-input", { key: '95e4d2e4af61655d06fcf6c3e7ae0469501bd505', class: "stzh-saptcha__input", label: this.localization.answer, name: this.name, invalid: this.invalid, error: this.error, disabled: this.disabled, value: this.value, onStzhChange: this.onInputChange, required: true, a11yDescribedby: `${this.saptchaId}-info ${this.saptchaId}-answer` })))));
     }
     static get is() { return "stzh-saptcha"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/stzh-scrollup/stzh-scrollup.js

@@ -28,7 +28,7 @@ export class StzhScrollup {
         const classes = {
             "stzh-scrollup": true,
         };
-        return (h(Host, { key: 'deda31b1ec662993903318b9c803d9a6330fe887' }, h("div", { key: 'd9aa01d30bb6abbee0d0b03c2728058e76707576', class: classes }, h("slot", { key: 'ea3f6114a38023cef4683b8b0b3c16157735b89a', onSlotchange: this.handleSlotchange }))));
+        return (h(Host, { key: '5dce13acbe1335a55ddbdf1dd10eea332be846ec' }, h("div", { key: '6d7e887f12979457f4d4f1d389e1ba845a8f534c', class: classes }, h("slot", { key: '72659c769b97f46d4f64b29200f083c26dbfc50e', onSlotchange: this.handleSlotchange }))));
     }
     static get is() { return "stzh-scrollup"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stzh-search/stzh-search.js

@@ -471,13 +471,13 @@ export class StzhSearch {
         const wrapperProps = typeof this.templateResultWrapperProps === "function"
             ? this.templateResultWrapperProps(this.element)
             : this.templateResultWrapperProps;
-        return (h(Host, { key: '04b14cd63060feec9fa81f04ef167b2b3952fb02', "has-aside-filters": filtersAsideUsed, fullwidth: this.isStzhAnchornavVisible.toString() }, h("form", { key: 'bdeb6bacdcedb642a0bc5b81c17dbe2bf94c8ab7', ref: el => (this.formElement = el), novalidate: true, class: classes, onSubmit: this.handleFormSubmit, onReset: this.handleFormReset }, h("div", { key: '78ff3d89431bc547932b28c2d730ffe80391cd86', class: "stzh-search__filters-main", onStzhChange: this.handleMainFilterChange }, !!this.heading && (h("stzh-heading", { key: 'd6120207362a2712503d8feae1baaaca7a4827bc', class: "stzh-search__header-heading", curve: "h2" }, this.heading)), h("slot", { key: '736d817eccb4e13d69b86eabc6addc2ba5a33f69', name: "filters-main" }), !chipsProvided && this.chipResults.length > 0 && (h("div", { key: '4eed32976365beb6056ae8210f79db724e51593c', class: "stzh-search__filters-main-chips" }, this.chipResultsHeading && (h("stzh-text", { key: '754c958ebd601b3fc89d947bffcfe59d1aa78703', font: "heavy", size: "milli", color: "primary" }, this.chipResultsHeading)), this.chipResults[0].options ? (h("stzh-chipgroup", null, this.chipResults.map(chipResult => (h("stzh-dropdown", { label: chipResult.label, name: chipResult.value, variant: "filter", size: "large", "no-search": true, "hide-optional": true, inline: true, options: chipResult.options }))))) : (h("stzh-chipselect", { multiple: true, name: "subject", label: this.chipResultsHeading, "label-hidden": true, data: this.chipResults.map(chipResult => ({
+        return (h(Host, { key: 'c674f925f42a86a2325126c2d4dff957ba3e1328', "has-aside-filters": filtersAsideUsed, fullwidth: this.isStzhAnchornavVisible.toString() }, h("form", { key: '194bb64ff606903c181548538f18a7094b1a38f6', ref: el => (this.formElement = el), novalidate: true, class: classes, onSubmit: this.handleFormSubmit, onReset: this.handleFormReset }, h("div", { key: 'd023ef1594df804d1646b02d517819b3ac39e313', class: "stzh-search__filters-main", onStzhChange: this.handleMainFilterChange }, !!this.heading && (h("stzh-heading", { key: '56c3589649ebe805514dc147419ddafa6152b7b3', class: "stzh-search__header-heading", curve: "h2" }, this.heading)), h("slot", { key: 'a6269f252a873fdee21bd8621a03792132e12dc8', name: "filters-main" }), !chipsProvided && this.chipResults.length > 0 && (h("div", { key: '7443fbd9e8deea64102ba759ac5e34b659125181', class: "stzh-search__filters-main-chips" }, this.chipResultsHeading && (h("stzh-text", { key: '468937cc2eb83d47fc8ea084ea4f54ce15f94c90', font: "heavy", size: "milli", color: "primary" }, this.chipResultsHeading)), this.chipResults[0].options ? (h("stzh-chipgroup", null, this.chipResults.map(chipResult => (h("stzh-dropdown", { label: chipResult.label, name: chipResult.value, variant: "filter", size: "large", "no-search": true, "hide-optional": true, inline: true, options: chipResult.options }))))) : (h("stzh-chipselect", { multiple: true, name: "subject", label: this.chipResultsHeading, "label-hidden": true, data: this.chipResults.map(chipResult => ({
                 label: chipResult.label,
                 value: chipResult.value,
                 counter: `${chipResult.amount}`,
                 variant: "filter",
                 size: "large",
-            })) }))))), filtersAsideUsed && (h(Fragment, { key: '62f681a61516414f96c7edb21a13896b0564b7ce' }, h("div", { key: '107ec7f0d0c1da7e17bc3dd923f92e9936448218', class: "stzh-search__filters-aside", onStzhChange: this.handleAsideFilterChange }, h("div", { key: '3fead9696cad86a188d41d36448bea140de36ab8', class: "stzh-search__filters-aside-inner" }, h("div", { key: 'a04a8ff65ab54b5403e19d647e2878c5034dc154', class: "stzh-search__filters-aside-heading" }, this.localization.moreFilter), h("stzh-details", { key: 'e10a75fb5b35741d2aee9b15e955b75708c53cdb', open: this.isDetailsOpen, class: "stzh-search__filters-aside-details" }, h("stzh-button", { key: 'b91f91478132b20f80e9ceb68e13f5b2dd545a71', class: "stzh-search__filters-aside-details-trigger", variant: "tertiary-plain", size: "small", noPaddingLeft: true, showToggleIcon: true, iconPosition: "right", label: this.localization.moreFilter }), h("div", { key: '442243f983c87358ea8130861697a682d3b4c2b3', slot: "content" }, h("slot", { key: '817c99137fb4c507b9b79cb90022214b1b0b47d4', name: "filters-aside" }))))))), h("div", { key: '00a76515982c55455a90ffadfdb2c2671d995dab', class: "stzh-search__results-wrapper" }, resultsShown && (h(Fragment, { key: '3828982de0b708e276e6837a4fd098d5f38bc9e7' }, this.results.length === 0 ? (h(Fragment, null, this.variant !== "teaser" && this.resultsHeading && !this.hideResultsHeading && (h("stzh-heading", { class: "stzh-search__results-heading", curve: "h3", level: this.resultHeadingLevel, innerHTML: this.resultsHeading })), this.resultsText && this.renderResultsText(), this.subscribePath && this.renderSubscribeButton(), this.emptyText && (h("stzh-text", { class: "stzh-search__empty-text", innerHTML: this.emptyText })), this.emptyLinkLabel && this.emptyLinkHref && (h("div", { class: "stzh-search__empty-link-wrapper" }, h("stzh-link", { href: this.emptyLinkHref, label: this.emptyLinkLabel }))))) : (h(Fragment, null, h("div", { class: "stzh-search__results-header" }, this.variant !== "teaser" && this.resultsHeading && !this.hideResultsHeading && (h("stzh-heading", { class: "stzh-search__results-heading", curve: "h3", level: this.resultHeadingLevel, htmlContent: this.resultsHeading })), this._sortOptions.length > 0 && (h("div", { class: "stzh-search__results-sort" }, h("stzh-dropdown", { "hide-optional": true, inline: true, "no-search": true, "no-wrap": true, class: "stzh-search__results-sort-dropdown", variant: "plain", size: "small", sizeMedium: "tiny", name: "sortby", items: [this._sortBy], options: this._sortOptions, onStzhChange: this.onDropdownSortChange })))), this.resultsText && this.renderResultsText(), this.subscribePath && this.renderSubscribeButton(), h(WrapperElement, Object.assign({ class: "stzh-search__results", "max-3-columns": filtersAsideUsed }, wrapperProps), this.results.map(result => (h("div", { class: "stzh-search__results-item", innerHTML: result.html || "" })))), h("div", { class: "stzh-search__actions-wrapper" }, this._showMoreLink && (h("stzh-button", { variant: "secondary", class: "stzh-search__action-more", label: this.localization.showMore, onClick: this.handleMoreClick, disabled: this.loading, a11yDisabled: this.loading }))))))), this.error && (h("div", { key: 'd75bb2c631a5f76f405b29f8b5042a6d9f2d6467', class: "stzh-search__error" }, h("stzh-message", { key: '5fc3748a4f51db659b63c90ecb461d6ad15fb6c0', type: "error", label: this.error }))), this.loading && h("stzh-loader", { key: '15719c5aa201ed8e06b97b73ab61b1481f17950a', class: "stzh-search__loader" })), h("slot", { key: 'ac7cbd25af23a283c45c4018f9538eb76809b8b9' }))));
+            })) }))))), filtersAsideUsed && (h(Fragment, { key: '74f5fe22505a2a0edddf67845febb9a62eb51138' }, h("div", { key: '4f6a96dd6d0d6b5aa86958c88c14597c8cf72bf6', class: "stzh-search__filters-aside", onStzhChange: this.handleAsideFilterChange }, h("div", { key: '8d250de88a52ee3f462946563828c053ba58e496', class: "stzh-search__filters-aside-inner" }, h("div", { key: 'ebe5bd60cb7eb87e25840482eb8dbc6ee5e09db5', class: "stzh-search__filters-aside-heading" }, this.localization.moreFilter), h("stzh-details", { key: 'dbb87cfa02364039bd2440d3adb4c1dfa47911d1', open: this.isDetailsOpen, class: "stzh-search__filters-aside-details" }, h("stzh-button", { key: '2644dfe13e26cbe61cfd2f8be8bbcf37d5bfb507', class: "stzh-search__filters-aside-details-trigger", variant: "tertiary-plain", size: "small", noPaddingLeft: true, showToggleIcon: true, iconPosition: "right", label: this.localization.moreFilter }), h("div", { key: '57748cfc1d3afa41ace39f41e527857cab0977de', slot: "content" }, h("slot", { key: '165ca236789b8440f4919be9c095ca085df69692', name: "filters-aside" }))))))), h("div", { key: 'f22e24207b3c95c233a1f49db2e76ca8651579f7', class: "stzh-search__results-wrapper" }, resultsShown && (h(Fragment, { key: '87e63ea254dc2a9ec9a340644840259ce3de3218' }, this.results.length === 0 ? (h(Fragment, null, this.variant !== "teaser" && this.resultsHeading && !this.hideResultsHeading && (h("stzh-heading", { class: "stzh-search__results-heading", curve: "h3", level: this.resultHeadingLevel, innerHTML: this.resultsHeading })), this.resultsText && this.renderResultsText(), this.subscribePath && this.renderSubscribeButton(), this.emptyText && (h("stzh-text", { class: "stzh-search__empty-text", innerHTML: this.emptyText })), this.emptyLinkLabel && this.emptyLinkHref && (h("div", { class: "stzh-search__empty-link-wrapper" }, h("stzh-link", { href: this.emptyLinkHref, label: this.emptyLinkLabel }))))) : (h(Fragment, null, h("div", { class: "stzh-search__results-header" }, this.variant !== "teaser" && this.resultsHeading && !this.hideResultsHeading && (h("stzh-heading", { class: "stzh-search__results-heading", curve: "h3", level: this.resultHeadingLevel, htmlContent: this.resultsHeading })), this._sortOptions.length > 0 && (h("div", { class: "stzh-search__results-sort" }, h("stzh-dropdown", { "hide-optional": true, inline: true, "no-search": true, "no-wrap": true, class: "stzh-search__results-sort-dropdown", variant: "plain", size: "small", sizeMedium: "tiny", name: "sortby", items: [this._sortBy], options: this._sortOptions, onStzhChange: this.onDropdownSortChange })))), this.resultsText && this.renderResultsText(), this.subscribePath && this.renderSubscribeButton(), h(WrapperElement, Object.assign({ class: "stzh-search__results", "max-3-columns": filtersAsideUsed }, wrapperProps), this.results.map(result => (h("div", { class: "stzh-search__results-item", innerHTML: result.html || "" })))), h("div", { class: "stzh-search__actions-wrapper" }, this._showMoreLink && (h("stzh-button", { variant: "secondary", class: "stzh-search__action-more", label: this.localization.showMore, onClick: this.handleMoreClick, disabled: this.loading, a11yDisabled: this.loading }))))))), this.error && (h("div", { key: 'e942f4732330748b1c58807646208fae7542d6fe', class: "stzh-search__error" }, h("stzh-message", { key: '6ef273c26a7977901223d9ed8264051f37662488', type: "error", label: this.error }))), this.loading && h("stzh-loader", { key: 'b6a84ee18dbd3f6e7c77b6d48c141c6e9e987910', class: "stzh-search__loader" })), h("slot", { key: 'e25476df1dcd0156b8d9d35f1d572e590fbe9597' }))));
     }
     static get is() { return "stzh-search"; }
     static get originalStyleUrls() {

package/dist/collection/components/stzh-section/stzh-section.js

@@ -45,12 +45,12 @@ export class StzhSection {
         this.init();
     }
     render() {
-        return (h(Host, { key: '3b3e663cb9e0f13143290c3685796dd4867dcbae' }, h("section", { key: 'd56d203ac83258973fc82f6ab37c599ebc9421e0', class: {
+        return (h(Host, { key: '1720582f9c111d7b3773ed363e24d15b3e4ae67c' }, h("section", { key: 'faddc191d92dc3279bbacd47302ec5575ade7934', class: {
                 "stzh-section": true,
                 "stzh-section--is-breakout": this.breakout,
                 [`stzh-section--${this.variant}`]: !!this.variant,
                 [`stzh-section--margin-bottom-${this.marginBottom}`]: !!this.marginBottom
-            } }, h("div", { key: '3e405827fa8b4ae9125706c817f44e77744ad086', class: "stzh-section__outer" }, h("div", { key: '896adf94c275bce5a8dee0ffb9f435f41deff77d', class: "stzh-section__heading" }, h("slot", { key: 'ac3a4c3d65ef7e7f2006b3b2752026db4010a3e3', name: "heading" })), h("div", { key: 'b7a5285d4f930988cdd304fe00a175d41839dffc', class: "stzh-section__wrapper" }, h("slot", { key: '53736f602bc578cffc909f4307b1b960697f90f4', onSlotchange: this.onSlotChange, ref: el => (this.slotElement = el) }))))));
+            } }, h("div", { key: 'a71029fad62750bc23ab1e937dec3d61e4545b94', class: "stzh-section__outer" }, h("div", { key: 'fa78050a1d6f33e886b13949c223a006ea374d60', class: "stzh-section__heading" }, h("slot", { key: 'b29cf889f5bcba3a74f523157709ffa7a15b2eb2', name: "heading" })), h("div", { key: '4fb22916b3a95eb9739c5f49cd69f67dbc0d3b57', class: "stzh-section__wrapper" }, h("slot", { key: 'a68da08449ba942be625f96293b365dc076b0483', onSlotchange: this.onSlotChange, ref: el => (this.slotElement = el) }))))));
     }
     static get is() { return "stzh-section"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stzh-share/stzh-share.js

@@ -82,7 +82,7 @@ export class StzhShare {
                 icon: "xing"
             }
         };
-        return (h(Host, { key: 'd04564f91fd50bfc57a1a81a7fe8715b32e7fd64' }, h("div", { key: '4cfc06c2cff040493955355db2651b12dd940074', class: classes }, h("ul", { key: 'ea458ea43e34630874c1a7b9ea645e25afdb7526', class: "stzh-share__list" }, this._services.map((service) => h("li", { class: "stzh-share__item" }, h("stzh-tooltip", { content: serviceData[service].text, size: "small" }, h("stzh-button", { class: `stzh-share__button is-${service}`, size: "small", variant: "tertiary", iconOnly: true, href: serviceData[service].url, rel: serviceData[service].blank ? "nofollow noopener noreferrer" : "nofollow", target: serviceData[service].blank ? "_blank" : "_self", onClick: serviceData[service].popup ? (e) => this.openPopup(serviceData[service].url, e) : null, analyticsId: serviceData[service].text, icon: serviceData[service].icon }))))))));
+        return (h(Host, { key: '3c0e7d9a2d9c4a9ac53f9013446b174d2d525ea4' }, h("div", { key: '91124d386269bd381c50764092f22ae68881edc3', class: classes }, h("ul", { key: '799e19b5f40435dd16be8db96d8f6b65dc16af4c', class: "stzh-share__list" }, this._services.map((service) => h("li", { class: "stzh-share__item" }, h("stzh-tooltip", { content: serviceData[service].text, size: "small" }, h("stzh-button", { class: `stzh-share__button is-${service}`, size: "small", variant: "tertiary", iconOnly: true, href: serviceData[service].url, rel: serviceData[service].blank ? "nofollow noopener noreferrer" : "nofollow", target: serviceData[service].blank ? "_blank" : "_self", onClick: serviceData[service].popup ? (e) => this.openPopup(serviceData[service].url, e) : null, analyticsId: serviceData[service].text, icon: serviceData[service].icon }))))))));
     }
     static get is() { return "stzh-share"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/stzh-show/stzh-show.js

@@ -54,9 +54,9 @@ export class StzhShow {
     }
     render() {
         const timeNow = Date.now();
-        return (h(Host, { key: 'fceb92953d1b8f5956b0b563a59c24c5ab800208', hidden: this._showFromDate && timeNow <= this._showFromDate.getTime()
+        return (h(Host, { key: '00aee00057a89730b9e3af8b4575148cbe3a33e0', hidden: this._showFromDate && timeNow <= this._showFromDate.getTime()
                 || this._hideFromDate && timeNow >= this._hideFromDate.getTime()
-                || this.closedByCookie }, h("slot", { key: '951e809d6120cfe717970b5293c31148c9778909' })));
+                || this.closedByCookie }, h("slot", { key: 'da5067469a05f9d04f6a5a1c237068713283c544' })));
     }
     static get is() { return "stzh-show"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stzh-sitemap/stzh-sitemap.js

@@ -9,7 +9,7 @@ export class StzhSitemap {
         const classes = {
             "stzh-sitemap": true
         };
-        return (h(Host, { key: 'f8165c49f6a9b57a4e4f9f3797d1ae350ab7ed8c' }, h("div", { key: 'ddd955748dd7df588bf5785f900863a3539c4e7a', class: classes }, h("stzh-datalist", { key: '1d27e910f122ff6ebf539d1c7d9a979e32e8ef01', items: this.items }))));
+        return (h(Host, { key: '4a796e69bba0da20ccc21261e2d94acccf3b87f2' }, h("div", { key: '657afb604c09c31fa5ab551700f9126b6161c5ca', class: classes }, h("stzh-datalist", { key: '337524f65b5b75087cd6b3f65c466fe14a64bdba', items: this.items }))));
     }
     static get is() { return "stzh-sitemap"; }
     static get originalStyleUrls() {

package/dist/collection/components/stzh-skin-portal-mitwirken/stzh-skin-portal-mitwirken.css

@@ -757,6 +757,28 @@ the .has-focus class is used by the focus target */
   --stzh-color-vbz-cyan100-rgb: 0 29 41;
   --stzh-color-vbz-cyan100: rgba(var(--stzh-color-vbz-cyan100-rgb) / 1);
 
+  /* MKZ */
+  --stzh-color-mkz-cyan10-rgb: 235 249 255;
+  --stzh-color-mkz-cyan10: rgba(var(--stzh-color-mkz-cyan10-rgb) / 1);
+  --stzh-color-mkz-cyan20-rgb: 194 238 255;
+  --stzh-color-mkz-cyan20: rgba(var(--stzh-color-mkz-cyan20-rgb) / 1);
+  --stzh-color-mkz-cyan30-rgb: 132 220 255;
+  --stzh-color-mkz-cyan30: rgba(var(--stzh-color-mkz-cyan30-rgb) / 1);
+  --stzh-color-mkz-cyan40-rgb: 52 197 254;
+  --stzh-color-mkz-cyan40: rgba(var(--stzh-color-mkz-cyan40-rgb) / 1);
+  --stzh-color-mkz-cyan50-rgb: 0 159 223;
+  --stzh-color-mkz-cyan50: rgba(var(--stzh-color-mkz-cyan50-rgb) / 1);
+  --stzh-color-mkz-cyan60-rgb: 5 127 172;
+  --stzh-color-mkz-cyan60: rgba(var(--stzh-color-mkz-cyan60-rgb) / 1);
+  --stzh-color-mkz-cyan70-rgb: 0 102 143;
+  --stzh-color-mkz-cyan70: rgba(var(--stzh-color-mkz-cyan70-rgb) / 1);
+  --stzh-color-mkz-cyan80-rgb: 3 76 103;
+  --stzh-color-mkz-cyan80: rgba(var(--stzh-color-mkz-cyan80-rgb) / 1);
+  --stzh-color-mkz-cyan90-rgb: 0 44 61;
+  --stzh-color-mkz-cyan90: rgba(var(--stzh-color-mkz-cyan90-rgb) / 1);
+  --stzh-color-mkz-cyan100-rgb: 0 29 41;
+  --stzh-color-mkz-cyan100: rgba(var(--stzh-color-mkz-cyan100-rgb) / 1);
+
   /* PKZH */
   --stzh-color-shakespeare-rgb: 74 150 200;
   --stzh-color-shakespeare: rgba(var(--stzh-color-shakespeare-rgb) / 1);
@@ -1348,7 +1370,21 @@ the .has-focus class is used by the focus target */
 
 .stzh-theme-aoz {
   --stzh-color-primary-rgb: var(--stzh-color-tabasco-rgb);
+  --stzh-color-primary: rgba(var(--stzh-color-tabasco-rgb) / 1);
   --stzh-color-primary-hover-rgb: var(--stzh-color-mahogany-rgb);
+  --stzh-color-primary-hover: rgba(var(--stzh-color-mahogany-rgb) / 1);
+  
+  /* Buttons */
+  --stzh-button-background-color: var(--stzh-color-primary);
+  --stzh-button-hover-background-color: var(--stzh-color-primary-hover);
+  --stzh-button-disabled-background-color: var(--stzh-color-grey70);
+    
+  /* Links */
+  --stzh-link-color: var(--stzh-color-primary);
+  --stzh-link-hover-color: var(--stzh-color-primary-hover);
+  
+  /* Header */
+  --stzh-header-logobar-background-color: var(--stzh-color-primary);
 }
 
 .stzh-theme-vbz {
@@ -1440,9 +1476,11 @@ the .has-focus class is used by the focus target */
   --stzh-button-secondary-hover-color: var(--stzh-color-primary80);
   --stzh-button-secondary-disabled-color: var(--stzh-color-grey70);
 
+  /*Must be checked
   --stzh-button-tertiary-background-color: var(--stzh-color-white);
   --stzh-button-tertiary-hover-background-color: var(--stzh-color-secondary20);
   --stzh-button-tertiary-disabled-background-color: var(--stzh-color-white);
+  */
   --stzh-button-tertiary-color: var(--stzh-color-primary70);
   --stzh-button-tertiary-hover-color: var(--stzh-color-primary80);
   --stzh-button-tertiary-disabled-color: var(--stzh-color-grey70);
@@ -1465,6 +1503,102 @@ the .has-focus class is used by the focus target */
   --stzh-cardlist-description-color: var(--stzh-color-primary70);
 }
 
+.stzh-theme-mkz {
+  --stzh-color-primary10-rgb: var(--stzh-color-mkz-cyan10-rgb);
+  --stzh-color-primary10: rgba(var(--stzh-color-primary10-rgb) / 1);
+  --stzh-color-primary20-rgb: var(--stzh-color-mkz-cyan20-rgb);
+  --stzh-color-primary20: rgba(var(--stzh-color-primary20-rgb) / 1);
+  --stzh-color-primary30-rgb: var(--stzh-color-mkz-cyan30-rgb);
+  --stzh-color-primary30: rgba(var(--stzh-color-primary30-rgb) / 1);
+  --stzh-color-primary40-rgb: var(--stzh-color-mkz-cyan40-rgb);
+  --stzh-color-primary40: rgba(var(--stzh-color-primary40-rgb) / 1);
+  --stzh-color-primary50-rgb: var(--stzh-color-mkz-cyan50-rgb);
+  --stzh-color-primary50: rgba(var(--stzh-color-primary50-rgb) / 1);
+  --stzh-color-primary60-rgb: var(--stzh-color-mkz-cyan60-rgb);
+  --stzh-color-primary60: rgba(var(--stzh-color-primary60-rgb) / 1);
+  --stzh-color-primary70-rgb: var(--stzh-color-mkz-cyan70-rgb);
+  --stzh-color-primary70: rgba(var(--stzh-color-primary70-rgb) / 1);
+  --stzh-color-primary80-rgb: var(--stzh-color-mkz-cyan80-rgb);
+  --stzh-color-primary80: rgba(var(--stzh-color-primary80-rgb) / 1);
+  --stzh-color-primary90-rgb: var(--stzh-color-mkz-cyan90-rgb);
+  --stzh-color-primary90: rgba(var(--stzh-color-primary90-rgb) / 1);
+  --stzh-color-primary100-rgb: var(--stzh-color-mkz-cyan100-rgb);
+  --stzh-color-primary100: rgba(var(--stzh-color-primary100-rgb) / 1);
+
+  --stzh-color-secondary10-rgb: var(--stzh-color-cyan10-rgb);
+  --stzh-color-secondary10: rgba(var(--stzh-color-secondary10-rgb) / 1);
+  --stzh-color-secondary20-rgb: var(--stzh-color-cyan20-rgb);
+  --stzh-color-secondary20: rgba(var(--stzh-color-secondary20-rgb) / 1);
+  --stzh-color-secondary30-rgb: var(--stzh-color-cyan30-rgb);
+  --stzh-color-secondary30: rgba(var(--stzh-color-secondary30-rgb) / 1);
+  --stzh-color-secondary40-rgb: var(--stzh-color-cyan40-rgb);
+  --stzh-color-secondary40: rgba(var(--stzh-color-secondary40-rgb) / 1);
+  --stzh-color-secondary50-rgb: var(--stzh-color-cyan50-rgb);
+  --stzh-color-secondary50: rgba(var(--stzh-color-secondary50-rgb) / 1);
+  --stzh-color-secondary60-rgb: var(--stzh-color-cyan60-rgb);
+  --stzh-color-secondary60: rgba(var(--stzh-color-secondary60-rgb) / 1);
+  --stzh-color-secondary70-rgb: var(--stzh-color-cyan70-rgb);
+  --stzh-color-secondary70: rgba(var(--stzh-color-secondary70-rgb) / 1);
+  --stzh-color-secondary80-rgb: var(--stzh-color-cyan80-rgb);
+  --stzh-color-secondary80: rgba(var(--stzh-color-secondary80-rgb) / 1);
+  --stzh-color-secondary90-rgb: var(--stzh-color-cyan90-rgb);
+  --stzh-color-secondary90: rgba(var(--stzh-color-secondary90-rgb) / 1);
+  --stzh-color-secondary100-rgb: var(--stzh-color-cyan100-rgb);
+  --stzh-color-secondary100: rgba(var(--stzh-color-secondary100-rgb) / 1);
+
+  --stzh-color-info10-rgb: var(--stzh-color-cobaltblue10-rgb);
+  --stzh-color-info10: rgba(var(--stzh-color-info10-rgb) / 1);
+  --stzh-color-info20-rgb: var(--stzh-color-cobaltblue20-rgb);
+  --stzh-color-info20: rgba(var(--stzh-color-info20-rgb) / 1);
+  --stzh-color-info30-rgb: var(--stzh-color-cobaltblue30-rgb);
+  --stzh-color-info30: rgba(var(--stzh-color-info30-rgb) / 1);
+  --stzh-color-info40-rgb: var(--stzh-color-cobaltblue40-rgb);
+  --stzh-color-info40: rgba(var(--stzh-color-info40-rgb) / 1);
+  --stzh-color-info50-rgb: var(--stzh-color-cobaltblue50-rgb);
+  --stzh-color-info50: rgba(var(--stzh-color-info50-rgb) / 1);
+  --stzh-color-info60-rgb: var(--stzh-color-cobaltblue60-rgb);
+  --stzh-color-info60: rgba(var(--stzh-color-info60-rgb) / 1);
+  --stzh-color-info70-rgb: var(--stzh-color-cobaltblue70-rgb);
+  --stzh-color-info70: rgba(var(--stzh-color-info70-rgb) / 1);
+  --stzh-color-info80-rgb: var(--stzh-color-cobaltblue80-rgb);
+  --stzh-color-info80: rgba(var(--stzh-color-info80-rgb) / 1);
+  --stzh-color-info90-rgb: var(--stzh-color-cobaltblue90-rgb);
+  --stzh-color-info90: rgba(var(--stzh-color-info90-rgb) / 1);
+  --stzh-color-info100-rgb: var(--stzh-color-cobaltblue100-rgb);
+  --stzh-color-info100: rgba(var(--stzh-color-info100-rgb) / 1);
+
+  /* Buttons */
+  --stzh-button-background-color: var(--stzh-color-primary60);
+  --stzh-button-hover-background-color: var(--stzh-color-primary80);
+  --stzh-button-disabled-background-color: var(--stzh-color-grey70);
+
+  --stzh-button-secondary-background-color: var(--stzh-color-secondary30);
+  --stzh-button-secondary-hover-background-color: var(--stzh-color-secondary40);
+  --stzh-button-secondary-disabled-background-color: var(--stzh-color-grey20);
+  --stzh-button-secondary-color: var(--stzh-color-primary80);
+  --stzh-button-secondary-hover-color: var(--stzh-color-primary90);
+  --stzh-button-secondary-disabled-color: var(--stzh-color-grey70);
+  /*Must be checked.
+  --stzh-button-tertiary-background-color: var(--stzh-color-white);
+  --stzh-button-tertiary-hover-background-color: var(--stzh-color-secondary20);
+  --stzh-button-tertiary-disabled-background-color: var(--stzh-color-white);
+  */
+  --stzh-button-tertiary-color: var(--stzh-color-primary80);
+  --stzh-button-tertiary-hover-color: var(--stzh-color-primary90);
+  --stzh-button-tertiary-disabled-color: var(--stzh-color-grey70);
+  
+  /* Links */
+  --stzh-link-color: var(--stzh-color-primary80);
+  --stzh-link-hover-color: var(--stzh-color-primary90);
+
+  /* Header */
+  --stzh-header-logobar-background-color: var(--stzh-color-primary70);
+  
+  /* Card list */
+  --stzh-cardlist-background-color: var(--stzh-color-coolgrey10);
+  --stzh-cardlist-description-color: var(--stzh-color-primary70);
+  }
+
 /* ZVV Overrides */
 #zvv-searchmask > div {
   margin: 0;
@@ -1474,7 +1608,7 @@ the .has-focus class is used by the focus target */
 #zvv-searchmask * {
   font-weight: inherit;
 }
-
+/*
 .stzh-theme-mkz {
   --stzh-color-secondary10-rgb: var(--stzh-color-cyan10-rgb);
   --stzh-color-secondary10: rgba(var(--stzh-color-secondary10-rgb) / 1);
@@ -1496,24 +1630,54 @@ the .has-focus class is used by the focus target */
   --stzh-color-secondary90: rgba(var(--stzh-color-secondary90-rgb) / 1);
   --stzh-color-secondary100-rgb: var(--stzh-color-cyan100-rgb);
   --stzh-color-secondary100: rgba(var(--stzh-color-secondary100-rgb) / 1);
-
+*/
   /* Homepage Service Highlights */
-  --stzh-homepage-service-highlights-topnews-subtitle-font: var(--stzh-font-family-heavy);
+/*  
+--stzh-homepage-service-highlights-topnews-subtitle-font: var(--stzh-font-family-heavy);
 }
+*/
 
 .stzh-theme-uvz {
   --stzh-color-primary-rgb: var(--stzh-color-monza-rgb);
+  --stzh-color-primary: rgba(var(--stzh-color-monza-rgb) / 1);
   --stzh-color-primary-hover-rgb: var(--stzh-color-venetianred-rgb);
-
+  --stzh-color-primary-hover: rgba(var(--stzh-color-venetianred-rgb) / 1);
+  
+  /* Buttons */
+  --stzh-button-background-color: var(--stzh-color-primary);
+  --stzh-button-hover-background-color: var(--stzh-color-primary-hover);
+  --stzh-button-disabled-background-color: var(--stzh-color-grey70);
+    
+  /* Links */  
+  --stzh-link-color: var(--stzh-color-primary);
+  --stzh-link-hover-color: var(--stzh-color-primary-hover);
+/*
   --stzh-link-color: var(--stzh-color-scienceblue);
   --stzh-heading-color: rgb(77, 77, 77);
+*/
+  /* Header */
+  --stzh-header-logobar-background-color: var(--stzh-color-primary);
 }
 
 .stzh-theme-pkzh {
   --stzh-pkzh-font-family: Verdana, 'Geneva', 'Helvetica Neue', Helvetica, Arial, sans-serif;
 
   --stzh-color-primary-rgb: var(--stzh-color-shakespeare-rgb);
+  --stzh-color-primary: rgba(var(--stzh-color-shakespeare-rgb) / 1);
   --stzh-color-primary-hover-rgb: var(--stzh-color-chambray-rgb);
+  --stzh-color-primary-hover: rgba(var(--stzh-color-chambray-rgb) / 1);
+  
+  /* Buttons */
+  --stzh-button-background-color: var(--stzh-color-primary);
+  --stzh-button-hover-background-color: var(--stzh-color-primary-hover);
+  --stzh-button-disabled-background-color: var(--stzh-color-grey70);
+    
+  /* Links */
+  --stzh-link-color: var(--stzh-color-primary);
+  --stzh-link-hover-color: var(--stzh-color-primary-hover);  
+
+  /* Header */
+  --stzh-header-logobar-background-color: var(--stzh-color-primary);
 
   --stzh-font-family-light: var(--stzh-pkzh-font-family);
   --stzh-font-family-regular: var(--stzh-pkzh-font-family);

package/dist/collection/components/stzh-skin-portal-mitwirken/stzh-skin-portal-mitwirken.js

@@ -8,7 +8,7 @@ export class StzhSkinPortalMitwirken {
         console.log(this.constructor.style.replace('@charset "UTF-8";', ''));
     }
     render() {
-        return (h(Host, { key: '576a0692529a15a310c536d1df177b495647b310' }));
+        return (h(Host, { key: '9d61ae156edb9d7f92b4f627f3197727d1ea1a15' }));
     }
     static get is() { return "stzh-skin-portal-mitwirken"; }
     static get originalStyleUrls() {

package/dist/collection/components/stzh-skin-storybook-preview/stzh-skin-storybook-preview.js

@@ -8,7 +8,7 @@ export class StzhSkinStorybookPreview {
         console.log(this.constructor.style.replace('@charset "UTF-8";', ''));
     }
     render() {
-        return (h(Host, { key: '049679bb956ce0f7868286efc06e56792d8b7d1c' }));
+        return (h(Host, { key: '20b83b3099326ad2c8b1b43b65ed3561492da2c6' }));
     }
     static get is() { return "stzh-skin-storybook-preview"; }
     static get originalStyleUrls() {

package/dist/collection/components/stzh-skiplink/stzh-skiplink.js

@@ -83,7 +83,7 @@ export class StzhSkiplink {
         }
     }
     render() {
-        return (h(Host, { key: '0d51b24110459507db7d94b099eed85c65481521', focused: this.focused, tabindex: "-1", onFocus: this.onRootFocus }, h("a", { key: '45fbd420bb0ea38fd51a892e614853d73b309461', ref: (el) => (this.link = el), class: "stzh-skiplink", href: this.href, accessKey: this.linkAccesskey, title: this.linkTitle, onFocus: this.onFocus, onBlur: this.onBlur }, h("div", { key: '8dd42e47ef1180641946e4903c7d5bf451acd3cf', ref: (el) => (this.text = el) }, this.label ? this.label : h("slot", null)))));
+        return (h(Host, { key: 'c3940a5145c3d6318843dc09cfbe2055a9b3deda', focused: this.focused, tabindex: "-1", onFocus: this.onRootFocus }, h("a", { key: 'eff1a3b462bcd1dc01740d779dd629e9b6908a23', ref: (el) => (this.link = el), class: "stzh-skiplink", href: this.href, accessKey: this.linkAccesskey, title: this.linkTitle, onFocus: this.onFocus, onBlur: this.onBlur }, h("div", { key: '679afbbe8aa2d52bdb6c90d6e2fcb59aa7d2fc89', ref: (el) => (this.text = el) }, this.label ? this.label : h("slot", null)))));
     }
     static get is() { return "stzh-skiplink"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/stzh-socialmediastream/stzh-socialmediastream.js

@@ -78,7 +78,7 @@ export class StzhSocialmediastream {
             "stzh-socialmediastream": true,
             "stzh-socialmediastream--has-heading": headingSlotUsed || !!this.heading,
         };
-        return (h(Host, { key: 'cbe805f3b1d20284878332954e72c86051d9b8c7' }, h("div", { key: '2a6913220174ed90ad4ac0f418fa08a9d06a533d', class: classes }, h("div", { key: '70d79a351ba25f880671e9fa3f64dfe4f84d59c7', class: "stzh-socialmediastream__heading" }, !!this.heading ? (h("stzh-heading", { level: this.headingLevel }, this.heading)) : (h("slot", { name: "heading" }))), h("div", { key: 'f5be98ccd30ee1a18376b478c8d857685eef10fa', class: "stzh-socialmediastream__items" }, this._items &&
+        return (h(Host, { key: '428fc7da1ddc6ac970287f802648de5adf2d1948' }, h("div", { key: '2e7bf07f0c095a0f9a60e3c72375f6bbd1a9d9e9', class: classes }, h("div", { key: 'ef11cfede1b015d49707360c32b1aa869f8fcf32', class: "stzh-socialmediastream__heading" }, !!this.heading ? (h("stzh-heading", { level: this.headingLevel }, this.heading)) : (h("slot", { name: "heading" }))), h("div", { key: 'bd460662448b95faabf5ba4cb6e49cf0724a3f8e', class: "stzh-socialmediastream__items" }, this._items &&
             this._items.length &&
             this._items.map(item => (h("stzh-socialmediastream-item", { class: "stzh-socialmediastream__item", item: item })))))));
     }

package/dist/collection/components/stzh-socialmediastream-item/stzh-socialmediastream-item.js

@@ -72,7 +72,7 @@ export class StzhSocialmediastreamItem {
         const classes = {
             "stzh-socialmediastream-item": true,
         };
-        return (h(Host, { key: 'd0d38e82f0566ad1e5d7b1047337be0afc09ebf6' }, h("a", { key: 'bb3791833ad0e743227a9b6d80e478429e2c2198', class: classes, href: this._item.link, target: "_blank" }, this._item.image && (h("div", { key: 'dfbe111151965ee75e29fbaf2f421635ad8af625', class: "stzh-socialmediastream-item__image" }, h("stzh-ratio", { key: '440d44f48a10091b3a03d08b7c36f83dd0fa41e2', ratio: "1:1" }), h("div", { key: 'b76f8dce5ade82b505d7785aa8f3e2ef148d7f58', class: "stzh-socialmediastream-item__image-inner-wrapper" }, h("img", { key: '40b90b2e5f9eb29bb2945b2ce6c51459a9c94323', src: this._item.image, alt: this._item.account.title })))), h("div", { key: '4f7288d877bfa62853a4622f54bbe73dd7480773', class: "stzh-socialmediastream-item__content" }, h("div", { key: '387eef5ffe7e6f730d56af3dc37ec5dd71343ea8', class: "stzh-socialmediastream-item__content-head" }, h("stzh-text", { key: '1e6cf71e83e3d11531e4394359a1ac7eb96c3570', size: "nano", class: "stzh-socialmediastream-item__content-title" }, h("strong", { key: '595260b9ab1b2d5fd3ffa5e4438a4707af791066' }, this._item.account.title), h("br", { key: '25270462d3b3fd4753d739d14ffc8fd9da3cf162' }), this.dateAdapter.format(this.getParsedDate(this._item.date), "dateInput")), h("stzh-icon", { key: 'e8c9d3fa0469977581205be5cfc9df0a45fa3fec', name: this.getIconName(this._item) })), h("div", { key: 'ac7fe169099d966c7e38887a0cc5b63bdba9c33c', class: "stzh-socialmediastream-item__content-body", innerHTML: this._item.text }), h("div", { key: '40e91fb81d0b50cd2475e6f6cf6c9d987aeba809', class: "stzh-socialmediastream-item__content-footer 1q23" }, this._item.actions &&
+        return (h(Host, { key: 'e7f3fb9d2144bef2d5286859074f362f9fd69f80' }, h("a", { key: 'b25d73abbf4980e0d128a04512b0bf69f533b684', class: classes, href: this._item.link, target: "_blank" }, this._item.image && (h("div", { key: '82d1444277d3e2400a46b9a04a7515f68b5d0d29', class: "stzh-socialmediastream-item__image" }, h("stzh-ratio", { key: 'ef5f6241799c23e04401536d8f6cf205cc4ff464', ratio: "1:1" }), h("div", { key: '5ded83cee583fd0c68eaad813a6b9133acd58a79', class: "stzh-socialmediastream-item__image-inner-wrapper" }, h("img", { key: 'c825fc5d0c2fc32ae8310e09b115a5d66c38f52b', src: this._item.image, alt: this._item.account.title })))), h("div", { key: '325bbbec6db81cd162c202e1db3d081a0a9bc90a', class: "stzh-socialmediastream-item__content" }, h("div", { key: 'bb430c5d0d6da2b71ed5683c4ec95dff3a9afddb', class: "stzh-socialmediastream-item__content-head" }, h("stzh-text", { key: '7aa2374ae540a323a58a3e2981c77ea9f4d1953b', size: "nano", class: "stzh-socialmediastream-item__content-title" }, h("strong", { key: 'd6f8340db17ae3b8c5bb5eb694db94aac767b791' }, this._item.account.title), h("br", { key: 'b6f7af663bcda2f17bec69e016c0ef8568c19e88' }), this.dateAdapter.format(this.getParsedDate(this._item.date), "dateInput")), h("stzh-icon", { key: 'c3aad8d18ca03df7ce5944d5f70e54826415cfbf', name: this.getIconName(this._item) })), h("div", { key: '326a2cc358d734650d8f0b868b4cceff2f6de79a', class: "stzh-socialmediastream-item__content-body", innerHTML: this._item.text }), h("div", { key: '4b15cf37d4255fd2a5b2a0b65ac29b8376936f24', class: "stzh-socialmediastream-item__content-footer 1q23" }, this._item.actions &&
             this._item.actions.map(action => (h("a", { href: action.url, title: action.title, class: "stzh-socialmediastream-item__action", target: "_blank" }, h("stzh-icon", { name: this.getActionIconName(action.variant) }), action.count))))))));
     }
     static get is() { return "stzh-socialmediastream-item"; }

package/dist/collection/components/stzh-sortable/stzh-sortable.js

@@ -323,7 +323,7 @@ export class StzhSortable {
             "stzh-sortable": true,
             "stzh-sortable--disabled": this.disabled,
         };
-        return (h(Host, { key: '070d1c60a725357990f0f00a347fb3eb2064c77f' }, h("div", { key: '279fc104c35941bdd118aa1a89256d44c60fa582', class: classes }, !this.disabled && (h("div", { key: '0a23fc3f116f6b22b69e3c04ba63d3bbf029fcf6', id: `${this.sortableId}-description`, class: "stzh-sortable__description" }, this.localization.description)), h("div", { key: '3cfe6856d9594854f58517143bf223f537d53082', ref: el => (this.ariaLiveElement = el), "aria-live": "assertive", class: "stzh-sortable__aria-live" }), h("div", { key: 'be91474f7e42c5d212722fb5c6f021765f0a65c5', ref: el => (this.containerElement = el), class: "stzh-sortable__container" }, h("slot", { key: '7e6a289218b4cdbbe01ac4a464e2b99624fd245d' })))));
+        return (h(Host, { key: '67ffd0187f08c6b7d6061c9b4f452ced46fb2ff3' }, h("div", { key: 'bc675ebe02a5992304118b63570962d802e1a2ae', class: classes }, !this.disabled && (h("div", { key: '2186234ed2173ad739fbb1b6bd8a259f51885ec5', id: `${this.sortableId}-description`, class: "stzh-sortable__description" }, this.localization.description)), h("div", { key: 'ba6373028dd95117a3f1274b6f9ddfa1ddecb99e', ref: el => (this.ariaLiveElement = el), "aria-live": "assertive", class: "stzh-sortable__aria-live" }), h("div", { key: '9678063c30d08200a1df0934b6452edc3d306c67', ref: el => (this.containerElement = el), class: "stzh-sortable__container" }, h("slot", { key: '64f4e657de3dd8934d350eb9b0b8d434f62a3476' })))));
     }
     static get is() { return "stzh-sortable"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/stzh-space/stzh-space.js

@@ -16,12 +16,12 @@ export class StzhSpace {
         this.border = "none";
     }
     render() {
-        return (h(Host, { key: '13a3552622b44a79977cd535d5a6cc8f1290d7c4' }, h("div", { key: '9cf6cd96f698035b64932a17d94838e36f063be0', class: {
+        return (h(Host, { key: 'b313899448238cdd47e286781dcbad79fd1e81a6' }, h("div", { key: 'a6336b880038c3a9904dd38b13049793a5c87c0f', class: {
                 "stzh-space": true,
                 'stzh-space--is-around': this.around,
                 [`stzh-space--justify-${this.justify}`]: !!this.justify,
                 [`stzh-space--items-${this.items}`]: !!this.items
-            } }, h("slot", { key: '9727050938f74532064f5f5525e24488244ae95c' }))));
+            } }, h("slot", { key: 'e6e0cba2c9a0e89fd7aab9db5d67e45f724828d6' }))));
     }
     static get is() { return "stzh-space"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stzh-status/stzh-status.js

@@ -13,10 +13,10 @@ export class StzhStatus {
             "stzh-status": true,
             [`stzh-status--type-${this.type}`]: !!this.type
         };
-        return (h(Host, { key: '50b8ebcafac0353478ad710601c6b245a822bc02' }, h("div", { key: '536514ec1f4377b2876af7d01834cb7a9856b1cc', class: classes }, h("div", { key: 'ac90e1f13405a63cee6cb09b8f6e534523025e44', class: "stzh-status__text" }, !this.withLoadingbar &&
-            h("div", { key: 'e8e04657f149c56ee66b171f87b2a3aca1fae7db', class: "stzh-status__dot" }), this.label &&
-            h("div", { key: '49485cbee9d1d694695cdd30db362b2fd721252e', class: "stzh-status__label" }, this.label)), this.withLoadingbar &&
-            h("div", { key: '5c98a346049515ff1e50dab4917831f4c5d54fbe', class: "stzh-status__bar" }, h("div", { key: 'd8ba608e926684c7f07461b9a7493528776f2db7', class: "stzh-status__bar-inner", style: {
+        return (h(Host, { key: 'cf5368c8c348b78771d193de7c0b64aac920d495' }, h("div", { key: 'ca0e3f6db139c39447131b3a6c4e673c742a0891', class: classes }, h("div", { key: 'a060a40864cf6570c0b3db1e9b003333b12e472d', class: "stzh-status__text" }, !this.withLoadingbar &&
+            h("div", { key: '2abce5b919e30cbc59f573a31d16b830afc250f1', class: "stzh-status__dot" }), this.label &&
+            h("div", { key: 'f541a5149b55560e2c83609e52deabcab107eadd', class: "stzh-status__label" }, this.label)), this.withLoadingbar &&
+            h("div", { key: 'bd7c530d66b7c15725292e76fd1e9560758170d0', class: "stzh-status__bar" }, h("div", { key: 'e80665749ededad6767c4d76a626fbc0296bdda9', class: "stzh-status__bar-inner", style: {
                     width: `${this.percent}%`
                 } })))));
     }

package/dist/collection/components/stzh-stepper/stzh-stepper.component.js

@@ -159,9 +159,9 @@ export class StzhStepper {
             "stzh-stepper": true,
             [`stzh-stepper--index-${this.index}`]: !!this.index
         };
-        return (h(Host, { key: '5d764a14fd6483a5a1d3d6453ed081b18c19d43d', style: {
+        return (h(Host, { key: 'a1c376bd2d799a727a4d5cd3620a302e660f2f2b', style: {
                 '--steps': this.currentSteps ? this.currentSteps.toString() : null,
-            } }, h("div", { key: '77e6a0b85ae86b7e751f5afb6a3e17b95509cbcc', class: classes }, h("div", { key: '5fff3da6ada91f6d09e437b28d6d0986ffc261eb', class: "stzh-stepper__items", role: "list", "aria-label": this.localization.label }, this._data.map((step, index) => h("stzh-stepper-item", Object.assign({}, this.getItemAttributes(index), { icon: step.icon, disabled: step.disabled, label: step.label, "click-disabled": step.clickDisabled !== undefined ? step.clickDisabled : this.clickDisabled, onStzhClick: (e) => { this.handleStepClick(e); }, onStzhDottedClick: (e) => { this.handleStepClick(e); }, class: "stzh-stepper__item" }))), h("slot", { key: 'c564fd218eabdeaf7835143aac0ce1c03d04bc2c' })))));
+            } }, h("div", { key: '2ff860e2f0a86f73a8ebc6a211efd408fa2ddf82', class: classes }, h("div", { key: '11bf19b3ab6863a30fe48cba547d86ed3ca8fb13', class: "stzh-stepper__items", role: "list", "aria-label": this.localization.label }, this._data.map((step, index) => h("stzh-stepper-item", Object.assign({}, this.getItemAttributes(index), { icon: step.icon, disabled: step.disabled, label: step.label, "click-disabled": step.clickDisabled !== undefined ? step.clickDisabled : this.clickDisabled, onStzhClick: (e) => { this.handleStepClick(e); }, onStzhDottedClick: (e) => { this.handleStepClick(e); }, class: "stzh-stepper__item" }))), h("slot", { key: '3e18ebc7f0e0d07e6225f7e2ab8853d430dff7a4' })))));
     }
     static get is() { return "stzh-stepper"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/stzh-stepper-item/stzh-stepper-item.js

@@ -51,11 +51,11 @@ export class StzhStepperItem {
             "stzh-stepper-item--passed": this.passed,
             "stzh-stepper-item--passed-incomplete": this.passed && this.incomplete
         };
-        const dotted = (h("span", { key: '68f87db5d84c53adc85e250d6849e05a35637963' }, !this.clickDisabled ? (h("button", { class: "stzh-stepper-item__dotted", onClick: this.onDottedClick }, h("stzh-icon", { class: "stzh-stepper-item__dotted-icon", name: "more-horizontal" }))) : (h("div", { class: "stzh-stepper-item__dotted stzh-stepper-item__dotted__disabled" }, h("stzh-icon", { class: "stzh-stepper-item__dotted-icon", name: "more-horizontal" })))));
-        const content = (h("span", { key: '35b17422b511e52f4eb31157651b6a7fd77ddd70' }, h("span", { key: 'b2cdd6251bd67609fc42b1bbf55b9b90b1d5c01e', class: "stzh-stepper-item__number-block" }, this.icon
+        const dotted = (h("span", { key: 'bec4fc0fc7a2e4ff36077b0ea4fcbab4547124b6' }, !this.clickDisabled ? (h("button", { class: "stzh-stepper-item__dotted", onClick: this.onDottedClick }, h("stzh-icon", { class: "stzh-stepper-item__dotted-icon", name: "more-horizontal" }))) : (h("div", { class: "stzh-stepper-item__dotted stzh-stepper-item__dotted__disabled" }, h("stzh-icon", { class: "stzh-stepper-item__dotted-icon", name: "more-horizontal" })))));
+        const content = (h("span", { key: 'c55480eb153827d56915b21097b2bc175c3bedb5' }, h("span", { key: 'fb1e48fa298ae59bc5cf88a1bf2c156e165514a5', class: "stzh-stepper-item__number-block" }, this.icon
             ? h("stzh-icon", { class: "stzh-stepper-item__user-icon", name: this.icon })
-            : (h("span", null, h("span", { class: "stzh-stepper-item__number" }, this.step), this.passed && !this.incomplete && (h("stzh-icon", { class: "stzh-stepper-item__icon", name: "checkmark" }))))), h("span", { key: '87b4c82329d5a679ed6f16598313a0d4a9485c7a', ref: (el) => (this.text = el), class: "stzh-stepper-item__label-block" }, this.label ? this.label : h("slot", null))));
-        return (h(Host, { key: 'c2fef2f363d22e55ee6885c9a2d91f5864c4452b', role: "listitem" }, h("div", { key: '6c56cb2b34ffc7a2c396b430c16e39bb8aeb4e7e', class: classes }, this.last && this.dotted && dotted, this.clickDisabled ? (h("div", { class: "stzh-stepper-item__unclickable", "aria-pressed": this.current ? "true" : "false" }, content)) : (h("button", { ref: (el) => (this.button = el), class: "stzh-stepper-item__button", "aria-pressed": this.current ? "true" : "false", disabled: (this.dotted && this.first) || this.disabled, onClick: this.onClick }, h("span", { class: "stzh-stepper-item__number-block" }, this.icon
+            : (h("span", null, h("span", { class: "stzh-stepper-item__number" }, this.step), this.passed && !this.incomplete && (h("stzh-icon", { class: "stzh-stepper-item__icon", name: "checkmark" }))))), h("span", { key: 'b698342975678c9ec862d532c52697b4ef8b24c4', ref: (el) => (this.text = el), class: "stzh-stepper-item__label-block" }, this.label ? this.label : h("slot", null))));
+        return (h(Host, { key: '9b03bf33bfe90ca4a9be7454d60b2e1ab7c376cb', role: "listitem" }, h("div", { key: '2dd2ed128f32b65e41a9de6799a337c91cf03b6b', class: classes }, this.last && this.dotted && dotted, this.clickDisabled ? (h("div", { class: "stzh-stepper-item__unclickable", "aria-pressed": this.current ? "true" : "false" }, content)) : (h("button", { ref: (el) => (this.button = el), class: "stzh-stepper-item__button", "aria-pressed": this.current ? "true" : "false", disabled: (this.dotted && this.first) || this.disabled, onClick: this.onClick }, h("span", { class: "stzh-stepper-item__number-block" }, this.icon
             ?
                 h("stzh-icon", { class: "stzh-stepper-item__user-icon", name: this.icon })
             :