hr-design-system-handlebars 0.77.0 → 0.77.1

package/CHANGELOG.md

@@ -1,3 +1,15 @@
+# v0.77.1 (Fri Nov 04 2022)
+
+#### 🐛 Bug Fix
+
+- another try to make it work in delivery [#370](https://github.com/mumprod/hr-design-system-handlebars/pull/370) ([@StefanVesper](https://github.com/StefanVesper))
+
+#### Authors: 1
+
+- SonicSoulSurfer ([@StefanVesper](https://github.com/StefanVesper))
+
+---
+
 # v0.77.0 (Thu Nov 03 2022)
 
 #### 🚀 Enhancement

package/build/handlebars/partials/handlebar-partials.js

@@ -7,9 +7,9 @@ module.exports['components/button/button.hbs'] = '<button \n    {{~#if _aria}} a
 module.exports['components/button/button_pseudo.hbs'] = '{{#decorator \'components/base/link\'}}\n    <span\n        class=\'px-4 py-2.5 border\n            {{inline-switch\n                _color\n                \'["white","grey","blue"]\'\n                \'["text-white border-white","text-grey-scorpion border-grey-scorpion","text-white bg-blue-congress","text-toplineColor border-toplineColor"]\'\n            }}\n            font-heading hover:bg-white hover:text-toplineColor hover:border-toplineColor\'\n    >\n        {{_linkTitle}}\n    </span>\n{{/decorator}}'
 module.exports['components/button/button_round.hbs'] = '{{> components/button/button \n    _aria=_aria\n    _isButton=_isButton\n    _title=_title\n    _name=_name\n    _label=_label\n    _value=_value\n    _showIcon="true"\n    _icon=_icon\n    _iconmap=_iconmap\n    _addIconClass="w-10 h-10 inline"\n    _addClass="fill-white hover:text-white"\n    _addClass2=_addClass\n    _webview=_webview\n    _x-show=_x-show\n    _alpineClick=_alpineClick\n    _srOnly=_srOnly\n}}'
 module.exports['components/button/button_transparent.hbs'] = '{{> components/button/button \n    _aria=_aria\n    _isButton=_isButton\n    _title=_title\n    _name=_name\n    _label=_label\n    _value=_value\n    _showIcon="true"\n    _icon=_icon\n    _iconmap=_iconmap\n    _addIconClass=_addIconClass\n    _addClass="bg-transparent hover:bg-slate-300 text-blue-700 font-semibold py-3.5 px-3.5 "\n    _addClass2=_addClass\n    _webview=_webview\n    _x-show=_x-show\n    _alpineClick=_alpineClick\n}}'
-module.exports['components/content_nav/content_nav.hbs'] = '{{#with this.contentNav}} \n    {{#if this.isListOrFlow}}\n        <nav class="w-full c-content-nav">\n            {{> components/content_nav/content_nav_container \n                _teasersize=../_teasersize \n                _maindivclass="flex flex-wrap mt-2 md:mt-0" \n                _inputcontainerclass="flex bg-grey-light w-full h-10 mx-2 md:mx-0 border-blue-congress align-center"\n            }}    \n        </nav>\n    {{else}}  \n        {{#decorator \'components/content_nav/content_nav_dropdown\'\n                     _componentClass="c-content-nav h-10  w-full"\n                     _teasersize=../_teasersize\n                     _iconOpen="arrow-down"\n                     _iconClose="arrow-up"\n                     _buttonText=(defaultIfEmpty this.selectedItem.title ../../title)\n                     _hiddenNavigationLabel="Unternavigation"\n        }} \n            {{> components/content_nav/content_nav_container \n                _teasersize=_teasersize \n                _maindivclass="flex flex-col w-full mt-0" \n                _inputcontainerclass="flex bg-grey-light w-full h-10 mx-0 border-blue-congress align-center "\n            }}\n        {{/decorator}}\n    {{/if}}\n{{/with}} '
+module.exports['components/content_nav/content_nav.hbs'] = '{{#with this.contentNav}} \n    {{#if this.isListOrFlow}}\n        <nav class="w-full c-content-nav">\n            {{> components/content_nav/content_nav_container \n                _teasersize=../_teasersize \n                _maindivclass="flex flex-wrap mt-2 md:mt-0" \n                _inputcontainerclass="flex bg-grey-light w-full h-10 mx-2 md:mx-0 border-blue-congress align-center"\n            }}    \n        </nav>\n    {{else}}  \n        {{#decorator \'components/content_nav/content_nav_dropdown\'\n                     _componentClass="c-content-nav h-10 md:h-auto w-full"\n                     _teasersize=../_teasersize\n                     _iconOpen="arrow-down"\n                     _iconClose="arrow-up"\n                     _buttonText=(defaultIfEmpty this.selectedItem.title ../../title)\n                     _hiddenNavigationLabel="Unternavigation"\n        }} \n            {{> components/content_nav/content_nav_container \n                _teasersize=_teasersize \n                _maindivclass="flex flex-col w-full mt-0" \n                _inputcontainerclass="flex bg-grey-light w-full h-10 mx-0 border-blue-congress align-center "\n            }}\n        {{/decorator}}\n    {{/if}}\n{{/with}} '
 module.exports['components/content_nav/content_nav_container.hbs'] = '<div class="{{_maindivclass}} {{#if this.isAutosuggest}} autoSuggest js-load{{/if}}"\n    @click.outside ="contentNavDropdownIsOpen = false; console.log(\'clicked outside\')"\n    {{#if this.isAutosuggest}}\n        data-hr-auto-suggest=\'{"filterGroupsSelector":".c-content-nav__group", "filterElementSelector":".c-content-nav__item", "filterTextSelector":".js-title", "inputElementSelector":".js-autosuggest-input", "matchedClass":"", "unmatchedClass":"hidden"}\'\n    {{/if}}\n>\n    {{#if this.isAutosuggest}}\n        <div class="{{_inputcontainerclass}} c-content-nav__autosuggest ">\n            <input x-ref="autosuggestInput" \n                class="w-full h-8 pl-2 bg-gray-200 text-grey-dark placeholder:text-grey-dark focus:outline-none js-autosuggest-input"\n                type="text"\n                placeholder="Eintrag filtern"/>\n        </div>\n    {{/if}}\n\n    {{> components/content_nav/content_nav_list _teasersize=_teasersize }}\n    \n</div>'
-module.exports['components/content_nav/content_nav_dropdown.hbs'] = '<nav  \n    class="w-full px-2 md:px-0  {{_componentClass}} " \n    id="dropdown--{{nextRandom}}"\n    tabindex="0"\n    role="navigation"\n    aria-labelledby="dropdown__label--{{getRandom}}">\n\n    <span id="dropdown__label--{{getRandom}}" class="hidden">{{defaultIfEmpty _hiddenNavigationLabel "Unternavigation"}}</span>\n\n    <div x-show="shouldDropdownBeShown({{_teasersize}},{{this.isDropdown}},{{this.isMixed}})" \n        :class="contentNavDropdownIsOpen ? \'shadow-[1px_4px_5px_0px_rgba(50,50,93,0.10)]\' : \'\'"\n        class="relative flex w-full h-10 mb-2 overflow-hidden bg-white border z-1002 border-blue-congress whitespace-nowrap text-blue-congress fill-congress"\n    >\n        <span class="self-center w-full p-2 text-base">{{_buttonText}}</span>\n        <div class="flex self-center w-auto h-full px-3 py-1 border-l border-blue-congress">\n            <span @click="contentNavDropdownIsOpen = !contentNavDropdownIsOpen;  " \n                :class="contentNavDropdownIsOpen ? \'hidden\' : \'\'"  \n                class="flex self-center"\n            >\n                {{~> components/base/image/icon _icon=(defaultIfEmpty _iconOpen "arrow-down") _addClass="h-4 w-4" _iconmap="icons"~}}    \n            </span>\n            <span @click="contentNavDropdownIsOpen = !contentNavDropdownIsOpen; $dispatch(\'resetinput\');  " \n                :class="contentNavDropdownIsOpen ? \'\' : \'hidden\'" \n                class="flex self-center"\n            >\n                {{~> components/base/image/icon _icon=(defaultIfEmpty _iconClose "arrow-up") _addClass="h-4 w-4" _iconmap="icons"~}}\n            </span>\n        </div>\n    </div>    \n    <div x-show="shouldContentBeShown({{_teasersize}},{{this.isDropdown}},{{this.isMixed}})" \n        aria-haspopup="true"\n        :class="contentNavDropdownIsOpen ? \'z-9999 w-auto \' : \' z-1003\'" \n        class="p-0 m-0 md:left-0 md:h-auto md:overflow-visible">\n       {{~decorator_body~}}\n    </div>\n    \n</nav>'
+module.exports['components/content_nav/content_nav_dropdown.hbs'] = '<nav  \n    class="w-full px-2 md:px-0  {{_componentClass}} " \n    id="dropdown--{{nextRandom}}"\n    tabindex="0"\n    role="navigation"\n    aria-labelledby="dropdown__label--{{getRandom}}">\n\n    <span id="dropdown__label--{{getRandom}}" class="hidden">{{defaultIfEmpty _hiddenNavigationLabel "Unternavigation"}}</span>\n\n    <div x-show="shouldDropdownBeShown({{_teasersize}},{{this.isDropdown}},{{this.isMixed}})" \n        :class="contentNavDropdownIsOpen ? \'shadow-[1px_4px_5px_0px_rgba(50,50,93,0.10)]\' : \'\'"\n        class="relative flex w-full h-10 mb-2 overflow-hidden bg-white border z-1002 border-blue-congress whitespace-nowrap text-blue-congress fill-congress"\n    >\n        <span class="self-center w-full p-2 text-base">{{_buttonText}}</span>\n        <div class="flex self-center w-auto h-full px-3 py-1 border-l border-blue-congress">\n            <span @click="contentNavDropdownIsOpen = !contentNavDropdownIsOpen;  " \n                :class="contentNavDropdownIsOpen ? \'hidden\' : \'\'"  \n                class="flex self-center"\n            >\n                {{~> components/base/image/icon _icon=(defaultIfEmpty _iconOpen "arrow-down") _addClass="h-4 w-4" _iconmap="icons"~}}    \n            </span>\n            <span @click="contentNavDropdownIsOpen = !contentNavDropdownIsOpen; $dispatch(\'resetinput\');  " \n                :class="contentNavDropdownIsOpen ? \'\' : \'hidden\'" \n                class="flex self-center"\n            >\n                {{~> components/base/image/icon _icon=(defaultIfEmpty _iconClose "arrow-up") _addClass="h-4 w-4" _iconmap="icons"~}}\n            </span>\n        </div>\n    </div>    \n    <div x-show="shouldContentBeShown({{_teasersize}},{{this.isDropdown}},{{this.isMixed}})" \n        aria-haspopup="true"\n        :class="contentNavDropdownIsOpen ? \'z-9999 w-auto md:w-min md:absolute\' : \' z-1003\'" \n        class="md:h-auto md:overflow-visible">\n       {{~decorator_body~}}\n    </div>\n    \n</nav>'
 module.exports['components/content_nav/content_nav_item.hbs'] = '<li x-init="chooseListItemStyles({{_teasersize}},{{_islist}},{{_ismixed}},{{_isdropdown}},{{_isflow}})" \nclass="h-10 md:mx-0 overflow-hidden text-base font-copy list-none border-blue-congress fill-congress text-blue-congress bg-white hover:bg-blue-congress hover:fill-white hover:text-white hover:underline {{#if this.isSelected}} font-bold -current{{/if}} c-content-nav__item">\n     {{#decorator \'components/base/link\' \n        _doNavigationTracking="true" \n        _clickLabelType="Contentnavigation" \n        _clickLabelPrefix1=this.title \n        _css="flex items-center py-2 px-2 h-10 whitespace-nowrap overflow-hidden" \n        _isSelected=this.isSelected\n        _selectedCssClass="is-selected"\n    }}\n        \n        <span class="block text-base grow font-copy js-title truncate ... ">{{this.title}}</span>\n\n        {{#if this.link.hasIcon}}\n            {{> components/base/image/icon _icon=this.link.iconName _addClass="ml-2 h-4 w-4" _iconmap="icons"}}\n        {{/if}}\n\n        <span>\n            {{>components/base/image/icon _icon="arrow-right" _addClass="h-4 w-4 ml-2" }} \n        </span>\n\n    {{/decorator}} \n</li>\n\n\n'
 module.exports['components/content_nav/content_nav_list.hbs'] = '<ul class="flex flex-wrap {{#if this.isList}}  {{else}} {{/if}} z-1003 md:!px-0 last:border-b-0 {{#if this.isDropdown }}  {{/if}}" \n    :class="( ({{this.isMixed}} && {{_teasersize}} < 50 ) || ( {{this.isMixed}} && window.innerWidth < 768 ) || {{this.isDropdown}} ) && contentNavDropdownIsOpen == true ? \'!shadow-[1px_8px_9px_0px_rgba(50,50,93,0.10)] mt-0 w-full  mr-2 md:mr-0 \' : \'\'"\n    > \n    \n    {{~#each this.contentNavEntries~}}\n          \n        {{~#if this.isGroup~}}\n        \n            {{#if ../isDropdown}}               \n                <li class="w-full h-auto overflow-hidden text-base list-none border-b border-gray-400 bg-blue-accented text-blue-congress md:mx-0 font-copy fill-congress c-content-nav__group">\n                    <div class="flex items-center h-10 p-2 c-content-nav__group-title">{{this.title}}</div>\n                    <ul class="c-content-nav__group-list !px-0 mt-0">\n                        {{~#each this.navigationGroup~}}\n                            {{> components/content_nav/content_nav_item \n                                _teasersize=../../_teasersize \n                                _isdropdown=../../isDropdown \n                                _ismixed=../../isMixed \n                                _islist=../../isList \n                                _isflow=../../isFlow}}\n                        {{~/each~}}\n                    </ul>\n                </li> \n            {{/if}}\n        {{else}}           \n            {{> components/content_nav/content_nav_item  \n                _teasersize=../_teasersize \n                _isdropdown=../isDropdown \n                _ismixed=../isMixed \n                _islist=../isList \n                _isflow=../isFlow}}\n        {{~/if~}}\n    {{~/each~}}\n</ul>\n'
 module.exports['components/event/instant_dates.hbs'] = '{{#if this.moreThenOneEvent}}\n    {{#with this.firstInstant}}\n        <span class=\'text-2xl font-headingSerif font-bold\'>{{this.startDate.day}}</span>\n        <span class=\'text-sm font-headingSerif\'>{{this.startDate.monthNameShort}}</span>\n    {{/with}}\n    {{#if this.moreThenTwoEvents}}\n        <span class=\'text-sm font-headingSerif\'>|</span>\n    {{else}}\n        <span class=\'text-sm font-headingSerif\'>+</span>\n    {{/if}}\n    {{#with this.lastInstant}}\n        <span class=\'text-2xl font-headingSerif font-bold\'>{{this.startDate.day}}</span>\n        <span class=\'text-sm font-headingSerif\'>{{this.startDate.monthNameShort}}</span>\n    {{/with}}\n{{else}}\n    {{#with this.firstInstant}}\n        <span class=\'text-sm font-headingSerif\'>{{this.startDate.weekdayNameShort}}</span>\n        <span class=\'text-2xl font-headingSerif font-bold\'>{{this.startDate.day}}</span>\n        <span class=\'text-sm font-headingSerif\'>{{this.startDate.monthNameShort}}</span>\n    {{/with}}\n{{/if}}'
@@ -41,10 +41,10 @@ module.exports['components/site_header/brand_navigation/brand_navigation_item.hb
 module.exports['components/site_header/navigation_flyout/navigation_flyout.hbs'] = '{{#with this.subNavigation}}\n    <div {{#unless ../this.selected}}x-cloak{{/unless}}\n        x-data="flyoutHandler" \n        x-ref="{{getRandom}}"\n        id="flyout-{{getRandom}}" \n        @resize.window.debounce="setFlyoutAnimationStyle();"\n        {{#if this.showAsFlyout}} x-show="dropped"  {{else}} {{#if ../this.selected}} x-show="$screen(\'lg\') ? true : dropped" {{else}} x-show="dropped" {{/if}} {{/if}}\n        {{#if ../_isSectionNav}} x-init="sectionNavFlyoutWatcher()"  :class ="shouldFlyoutBeHidden() ? \'hidden\' : \'\'" {{/if}}  \n        \n        class="sb-navigation-flyout bg-white md:filter md:drop-shadow-md lg:absolute  \n                {{#if ../_isSectionNav}} relative md:top-auto md:left-auto lg:mt-10 w-full transition-all duration-500 ease-in-out\n                    {{#unless this.showAsFlyout}}\n                        {{#if ../this.selected}}\n                            isSelectedAndOpen  lg:ml-0 z-10000 lg:border-b lg:border-blue-congress lg:filter-none lg:left-0 flex justify-center\n                        {{else}} z-10002 lg:left-auto lg:w-auto {{/if}}\n                    {{else}} z-10002 lg:left-auto lg:w-auto {{/unless}}\n                {{else}} z-10002 lg:rounded-b absolute w-full top-10 left-0 md:w-80 lg:w-92 md:top-12 lg:px-4 md:mt-0 md:left-0 lg:top-15 lg:left-0 lg:pl-6 divide-y divide-gray-200 tablet:w-half-screen tablet:ml-half-screen tablet:right-0 tablet:left-auto {{/if}}\n                {{#if this.showAsFlyout}} lg:rounded-b lg:pl-4{{/if}}" \n\n        aria-labelledby="flyout-{{getRandom}}-1" \n        {{#if this.showAsFlyout}}\n            x-effect="$el.setAttribute(\'aria-expanded\', dropped); $el.setAttribute(\'aria-hidden\', !dropped)"\n        {{else}}\n            {{#if ../this.selected}} \n                x-effect="$el.setAttribute(\'aria-expanded\', $screen(\'lg\') || dropped); $el.setAttribute(\'aria-hidden\', !($screen(\'lg\') || dropped))"\n            {{else}}  \n                x-effect="$el.setAttribute(\'aria-expanded\', dropped); $el.setAttribute(\'aria-hidden\', !dropped)"\n            {{/if}} \n        {{/if}}    \n    >\n        {{#unless ../this.isCluster ~}}\n            {{#unless ../_isSectionNav}}\n                <div class="w-full">\n                    <div class="flex pt-4 pb-2 pl-4 text-base font-bold bg-white lg:pl-0 md:pt-4 lg:pt-1 lg:pb-0 justify-left text-blue-congress ">              \n                        <a href="{{resourceUrl ../this.url}}" class="-isHeaderLink lg:leading-10 link-focus-inset js-load" data-hr-click-tracking=\'{"settings": [{"type": "uxAction", "secondLevelId": "1", "clickLabel": "{{../_navigationType}}::{{../_parent}}::{{../this.flyoutStartLinkText}}-Link geklickt"}]}\' >\n                            {{../this.flyoutStartLinkText}}\n                        </a>      \n                    </div>          \n                </div>\n            {{/unless}}\n        {{/unless}}\n        \n        <div class="{{#if this.showAsFlyout}}lg:flex lg:flex-row -columnCount--{{this.columnCount}} lg:divide-x lg:divide-gray-200 {{else}} {{#if ../this.selected}} w-full lg:px-10 lg:container {{/if}}{{/if}}">\n            {{#if this.showAsFlyout}}\n                {{#each this.columns}}\n                    {{> components/site_header/navigation_flyout/navigation_flyout_column count=../this.columnCount navtype=../../_navigationType _parent=../../_parent _flyout=true~}}\n                {{/each}}\n            {{else}}\n                {{#with this.items}}\n                    {{> components/site_header/navigation_flyout/navigation_flyout_column selected=../../this.selected navtype=../../_navigationType _parent=../../_parent _flyout=false ~}}\n                {{/with}}\n            {{/if}}\n        </div>\n</div>\n{{/with}}'
 module.exports['components/site_header/navigation_flyout/navigation_flyout_column.hbs'] = '<ul class="{{inline-switch count \'["1","2"]\' \'["md:w-1/1", "md:w-1/1 lg:w-1/2"]\'}} {{inline-switch navtype \'["ServiceNavigation","RubrikNavigation"]\' \'["border-b border-gray-200 md:border-0","border-0"]\'}} lg:even:pl-4 lg:odd:pr-4 {{#if selected}} lg:container lg:flex lg:h-9 {{/if}} ">\n    {{~#each this ~}} \n        {{~#if this.title~}}\n            {{> components/site_header/navigation_flyout/navigation_flyout_item _parentselected=../selected _fromNav=../navtype _flyout=../_flyout _parent=../_parent ~}}\n        {{~/if~}}       \n    {{~/each~}}\n    \n</ul>'
 module.exports['components/site_header/navigation_flyout/navigation_flyout_item.hbs'] = '<li :class="dropped ? \'h-auto\' : \'h-10\'"  \n    class="sb-navigation-flyout-item pl-4 {{#if _flyout}}lg:px-0 {{else}}lg:px-2 lg:first-of-type:pl-0 {{/if}}{{#if _parentselected}}lg:whitespace-nowrap{{/if}} flex h-auto text-base leading-6 border-b border-gray-200 lg:last:border-0 lg:border-0 text-blue-congress justify-start hover:underline">\n    {{#decorator \'components/base/link\' _css=(inline-switch _fromNav \'["RubrikNavigation","ServiceNavigation"]\' \'["link-focus-inset py-2 w-full","link-focus py-2 md:pl-0 lg:pl-0 lg:pr-0 break-words w-full"]\') _doNavigationTracking="true" _clickLabelType=_fromNav _clickLabelPrefix1=_parent clickLabelPrefix2=this.link.content.text }}\n        {{this.text}}      \n        {{~#if this.link.hasIcon}}{{> components/base/image/icon _icon=this.link.iconName _addClass="w-4 h-4 fill-current ml-2 inline-flex" _iconmap="icons" }} {{/if}}\n    {{/decorator}}  \n</li>'
-module.exports['components/site_header/navigation_search/quick_search_button.hbs'] = '<div \n    x-cloak class="sb-quick-search-button flex items-center h-8 md:h-full md:border-r md:border-l md:border-white lg:border-none" \n    :class="$store.searchFieldOpen == true ? \'bg-white mt-2 rounded-t md:mt-0 md:rounded-none\' : \'bg-blue-congress\'"\n>\n    <button  \n        @click="$store.searchFieldOpen = ! $store.searchFieldOpen; dropped = false; $store.serviceNavIsOpen = false; toggleScrolling(!$store.searchFieldOpen)"\n        @click.debounce.100ms="$dispatch(\'burger-close\'); $dispatch(\'search-mobile-click\'); $dispatch(\'close-servicemenu\');"\n        class="h-full text-white cursor-pointer md:px-4 lg:hidden"\n        x-effect="$el.setAttribute(\'id\', \'flyout-\' + $store.searchID.current + \'-1\');$el.setAttribute(\'aria-owns\', \'flyout-\' + $store.searchID.current + \'-2\');$el.setAttribute(\'aria-controls\', \'flyout-\' + $store.searchID.current + \'-2\');$el.setAttribute(\'aria-expanded\', $store.searchFieldOpen == true);$el.setAttribute(\'aria-label\', $store.searchFieldOpen == true ? \'Suche schließen\' : \'Suche öffnen\')"\n    >\n        <svg \n            x-show="$store.searchFieldOpen == false"\n            class="h-5 text-white fill-current w-9" \n            xmlns="http://www.w3.org/2000/svg" \n            viewBox="0 0 20 20"\n            role="presentation" \n            x-effect="$el.setAttribute(\'aria-hidden\', $store.searchFieldOpen == true)"\n        >\n            <path d="M12.9 14.32a8 8 0 1 1 1.41-1.41l5.35 5.33-1.42 1.42-5.33-5.34zM8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12z"></path>\n        </svg>\n        <svg \n            x-show="$store.searchFieldOpen == true"\n            class="h-6 fill-current w-9 text-blue-congress" \n            xmlns="http://www.w3.org/2000/svg" \n            viewBox="0 0 20 20"\n            x-effect="$el.setAttribute(\'aria-hidden\', $store.searchFieldOpen == false)"\n        >\n            <path d="M15.898,4.045c-0.271-0.272-0.713-0.272-0.986,0l-4.71,4.711L5.493,4.045c-0.272-0.272-0.714-0.272-0.986,0s-0.272,0.714,0,0.986l4.709,4.711l-4.71,4.711c-0.272,0.271-0.272,0.713,0,0.986c0.136,0.136,0.314,0.203,0.492,0.203c0.179,0,0.357-0.067,0.493-0.203l4.711-4.711l4.71,4.711c0.137,0.136,0.314,0.203,0.494,0.203c0.178,0,0.355-0.067,0.492-0.203c0.273-0.273,0.273-0.715,0-0.986l-4.711-4.711l4.711-4.711C16.172,4.759,16.172,4.317,15.898,4.045z"></path>\n        </svg>\n    </button>\n</div>'
-module.exports['components/site_header/navigation_search/quick_search_form.hbs'] = '<form \n    x-data="searchSuggest()"\n    role="search" \n    action="{{resourceUrl "suche/index.nocache"}}" \n    method="get" \n    class="flex w-full sb-quick-search-form md:justify-end lg:h-10"\n>\n    <div \n        class="relative w-full lg:rounded-l" \n        id="search-content"\n        @click.away="active=false; cursorIndex=-1"\n        @keydown.arrow-down="moveDownList()"\n        @keydown.arrow-up="moveUpList()"\n    >   \n        <label for="searchInput--{{nextRandom}}" class="hidden">suchfeld</label>\n        <input \n            @input.debounce="getSuggestionsForInput();cursorIndex=-1"\n            @click="active=true" \n            name="query" \n            x-model="query"\n            placeholder=\'{{loca "search_input_placeholder" }}\' \n            class="w-full px-2 py-2 text-base leading-4 placeholder-opacity-100 border rounded-l rounded-r-none shadow-inner appearance-none lg:border-0 lg:border-none border-blue-congress lg:h-10 placeholder-text-xs placeholder-blue-congress text-blue-congress focus:outline-none"\n            type="text"\n            id="searchInput--{{getRandom}}"\n            autocomplete="off"\n            role="combobox" \n            aria-haspopup="listbox" \n            aria-autocomplete="list" \n            x-effect="$el.setAttribute(\'aria-expanded\', (query.length > 1 && active && suggestions.length > 0))"\n            aria-owns="suggestionlist--{{getRandom}}"\n            aria-controls="suggestionlist--{{getRandom}}"\n        > \n        <div \n            class="relative" \n            x-show="query.length > 1 && active && suggestions.length"\n            x-cloak\n            x-transition:leave="transition ease-in duration-100"\n            x-transition:leave-start="opacity-100"\n            x-transition:leave-end="opacity-0"\n        >\n            <ul \n                role="listbox" \n                id="suggestionlist--{{getRandom}}" \n                aria-label="Suche öffnen"\n                x-effect="$el.setAttribute(\'aria-expanded\', query.length > 1 && active && suggestions.length > 0);$el.setAttribute(\'aria-hidden\', !(query.length > 1 && active && suggestions.length > 0))"\n                class="absolute w-full mt-0.5 bg-white border rounded divide-y shadow-xl top-100"\n                x-ref="list"\n            >\n                \n                <template x-for="(suggestion, index) in suggestions" :key="index">\n                    <li class="first-of-type:border-none">\n                        <a  \n                            x-bind:active="false"\n                            x-bind:href="\'{{resourceUrl "suche/index.nocache"}}?query=\' + suggestion"\n                            x-bind:class="{\'py-1.5 px-2 link-focus-inset text-base flex w-full rounded hover:bg-blue-congress hover:text-white\': true, \'bg-blue-congress text-white\':index==cursorIndex }"\n                        >\n                            <span x-text="suggestion"></span>\n                        </a>\n                    </li>\n                </template>\n                \n            </ul>\n        </div>  \n    </div>\n    <button \n        aria-label=\'{{loca "search_input_aria_submit" }}\' \n        type="submit" \n        class="pl-3 pr-2 rounded-r cursor-pointer link-focus-inset bg-blue-congress lg:bg-white text-blue-congress z-10002"\n    >\n        <svg class="w-6 h-6 text-white fill-current bg-blue-congress lg:fill-current lg:text-blue-congress lg:bg-white" \n             xmlns="http://www.w3.org/2000/svg" \n             viewBox="0 0 20 20"\n             aria-hidden="true"\n        >\n            <path d="M12.9 14.32a8 8 0 1 1 1.41-1.41l5.35 5.33-1.42 1.42-5.33-5.34zM8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12z"></path>\n        </svg>\n    </button>\n</form>\n\n<script type="text/javascript">\n\n    function searchSuggest() {\n\n        return {\n            active:true,\n            cursorIndex: -1,\n            query: "",\n            suggestions: [],\n\n            getSuggestionsForInput() {\n\n                suggestionDataUrl = \'{{resourceUrl "suche/index~suggest.jsp"}}\' + \'?suggestions=\' + this.query;\n\n                fetch(suggestionDataUrl)\n\n                    .then((res) =>{  return res.text()})\n\n                    .then((data) => {\n                        data = JSON.parse(data.replace(/&quot;/g, \'"\'))\n                        data.solrSuggestions = this.filterStartwith(data.solrSuggestions, this.query)\n                        this.suggestions= this.filterSortbylength(data.solrSuggestions)\n                    });\n\n            },\n\n            filterStartwith(data, query) {\n               return data.filter(Suggestion => Suggestion.toLowerCase().startsWith(query.toLowerCase().trim()))\n            },\n\n            filterSortbylength(data) {\n               return data.sort((a, b) => a.length - b.length)\n            },\n\n            moveDownList() {\n                    if (this.suggestions.length > 0 && this.cursorIndex < this.suggestions.length - 1) \n                    {\n                        this.cursorIndex++;\n                        this.query = this.suggestions[this.cursorIndex];\n                    }\n            },\n\n            moveUpList() {\n                    if (this.suggestions.length > 0 && this.cursorIndex > 0) \n                    {\n                        this.cursorIndex--;\n                        this.query = this.suggestions[this.cursorIndex];\n                    }\n            },\n\n        };\n\n    }\n\n</script>'
 module.exports['components/site_header/section_navigation/section_navigation.hbs'] = '<div \n    id="sectionNav"\n    class="w-full px-0 mt-10 sb-section-navigation md:mt-0 lg:px-10 lg:container bg-blue-congress" \n    x-effect="$el.setAttribute(\'aria-expanded\',  $store.burgeropen || $screen(\'lg\')); $el.setAttribute(\'aria-hidden\', ! ($store.burgeropen || $screen(\'lg\')))"\n>\n    <div class="flex content-start mb-0">\n        <div class="flex w-full">\n            <span id="sectionNavHeadline" class="hidden">Bereichsnavigation</span>\n            {{#with this.sectionNavigationSSILinks}}\n                <ul class="flex flex-col items-center w-full text-left text-white list-none lg:flex-row lg:h-auto lg:mt-1">\n                    {{#each this}}   \n                        {{#if (isStorybook)}}  \n                            {{> components/site_header/section_navigation/section_navigation_item }}   \n                        {{else}}\n                            {{{this}}}\n                        {{/if}}\n                    {{/each}} \n                </ul>\n            {{/with}}\n        </div>\n    </div>\n</div> '
 module.exports['components/site_header/section_navigation/section_navigation_item.hbs'] = '{{#each this.navigationItems}}\n    <li x-data="dropdown"\n        @click.outside="dropped = false" \n        @close-servicemenu.window="dropped = false" \n        :class="dropped ? \'border-b-0 lg:bg-white lg:text-blue-congress h-auto\' : \'h-10 lg:hover:underline\'" \n        class="flex flex-wrap justify-start w-full text-white list-none border-b border-white sb-section-navigation-item first:lg:-ml-4 md:pl-0 lg:first:pl-0 first:border-t lg:first:border-t-0 first:font-normal last:border-b-0 lg:border-0 lg:w-auto bg-blue-congress lg:rounded-t">   \n        {{#if this.isCluster ~}}\n{{!-- Gilt z.B. für REGIONEN:  --}}        \n            <button id="button-{{nextRandom}}-1" \n                @click.debounce.100ms="toggle()" \n                :class="dropped ? \'first:font-bold lg:first:font-normal lg:underline\' : \'first:font-normal\'"\n                class="{{#if this.selected}}-currentSection lg:justify-center {{/if}}link-focus-inset-white js-load pl-4 lg:pl-4 lg:pr-4 flex flex-auto w-full justify-between lg:flex-initial h-10 lg:w-full items-center leading-4 {{#if this.selected}} font-bold{{/if}}" \n                x-effect="$el.setAttribute(\'aria-expanded\', dropped);$el.setAttribute(\'tabindex\',  $store.burgeropen || $screen(\'lg\') ? \'0\' : \'-1\')"\n                aria-owns="flyout-{{getRandom}}" \n                aria-controls="flyout-{{getRandom}}" \n                data-hr-click-tracking=\'{"settings": [{"type": "uxAction", "secondLevelId": "1", "clickLabel": "Rubriknavigation::{{this.text}}-Toggle-Link geklickt"}]}\'>\n\n        {{~else ~}}\n\n            {{#if this.subNavigation}}\n{{!-- Gilt z.B. für POLITIK:  --}}\n                <a href="{{resourceUrl this.url}}" \n                    id="flyout-{{nextRandom}}-1"\n                    \n                    :class="dropped ? \'font-bold\' : \'\'"\n                    class="{{#if this.selected}}-currentSection lg:justify-center {{/if}}link-focus-inset-white js-load pl-4 pr-8 lg:pl-4 lg:pr-4 flex flex-auto h-10 items-center leading-4 lg:w-full lg:justify-center{{#if this.selected}} font-bold{{/if}}"\n                    {{#if this.labelText}} aria-label="{{this.labelText}}"{{/if}} \n                    aria-haspopup="true" \n                    x-effect="$el.setAttribute(\'aria-expanded\', dropped || $screen(\'lg\'));$el.setAttribute(\'tabindex\',  $store.burgeropen || $screen(\'lg\') ? \'0\' : \'-1\')"\n                    aria-owns="flyout-{{getRandom}}"\n                    aria-controls="flyout-{{getRandom}}"\n                    data-hr-click-tracking=\'{"settings": [{"type": "uxAction", "secondLevelId": "1", "clickLabel": "Rubriknavigation::{{this.text}}-Link geklickt"}]}\'>           \n            {{~else ~}} \n{{!-- Gilt für START/GESELLSCHAFT/WIRTSCHAFT usw:  --}}\n                <a href="{{resourceUrl this.url}}" \n                    class="{{#if this.selected}}-currentSection lg:justify-center {{/if}} link-focus-inset-white js-load flex justify-start pl-4 pr-4 h-10 lg:justify-center items-center w-full{{#if this.selected}} font-bold{{/if}}" \n                    {{#if this.labelText}} aria-label="{{this.labelText}}"{{/if}} \n                    data-hr-click-tracking=\'{"settings": [{"type": "uxAction", "secondLevelId": "1", "clickLabel": "Rubriknavigation::{{this.text}}-Link geklickt"}]}\'\n                    x-effect="$el.setAttribute(\'tabindex\',  $store.burgeropen || $screen(\'lg\') ? \'0\' : \'-1\')"\n                >\n            {{~/if}}\n\n        {{~/if }}\n\n        {{#if this.subNavigation}}\n\n            {{~this.text~}}\n            \n            {{#if this.subNavigation.showAsFlyout ~}}\n                \n                    <div class="flex items-center justify-center w-10 h-10 leading-4 lg:w-auto lg:border-0 lg:pl-1">\n                        <div class="flex items-center justify-center" :class="dropped ? \'transform rotate-180\':\'\'">\n                            {{> components/base/image/icon _icon="arrow-down" _iconmap="icons" _addClass="w-3 h-2 fill-current"}}\n                        </div>\n                    </div>\n               \n            {{/if}}\n\n        {{else}}\n\n            {{~this.text~}}\n\n        {{~/if}}\n\n        {{#if this.isCluster}}\n\n            </button>\n\n        {{else}}\n\n            </a>\n\n            {{#if this.subNavigation}}\n\n                <button \n                    @click.debounce.100ms="toggle()" \n                    id="button-{{getRandom}}-1" \n                    class="flex items-center justify-center w-10 h-10 leading-4 border-l border-white js-load lg:hidden" \n                    aria-haspopup="true"  \n                    x-effect="$el.setAttribute(\'aria-expanded\', dropped);$el.setAttribute(\'tabindex\',  $store.burgeropen ? \'0\' : \'-1\')"\n                    aria-owns="flyout-{{getRandom}}" \n                    aria-controls="flyout-{{getRandom}}" \n                    aria-labelledby="flyout-{{getRandom}}-1" \n                    data-hr-click-tracking=\'{"settings": [{"type": "uxAction", "secondLevelId": "1", "clickLabel": "Rubriknavigation::{{this.text}}-Toggle-Link geklickt"}]}\'>\n\n                    <span class="hidden">{{~this.text~}}</span>\n                    \n                    <div class="flex items-center justify-center lg:ml-2 lg:relative lg:right-0" :class="dropped ? \'transform rotate-180 \':\'\'">\n                        {{> components/base/image/icon _icon="arrow-down" _iconmap="icons" _addClass="w-4 h-2 fill-current"}}\n                    </div>\n                </button>\n\n            {{/if}}\n\n        {{/if}}\n        \n        {{> components/site_header/navigation_flyout/navigation_flyout _isSectionNav=true _navigationType="RubrikNavigation" _parent=this.text }}\n\n    </li>\n{{/each}}'
+module.exports['components/site_header/navigation_search/quick_search_button.hbs'] = '<div \n    x-cloak class="sb-quick-search-button flex items-center h-8 md:h-full md:border-r md:border-l md:border-white lg:border-none" \n    :class="$store.searchFieldOpen == true ? \'bg-white mt-2 rounded-t md:mt-0 md:rounded-none\' : \'bg-blue-congress\'"\n>\n    <button  \n        @click="$store.searchFieldOpen = ! $store.searchFieldOpen; dropped = false; $store.serviceNavIsOpen = false; toggleScrolling(!$store.searchFieldOpen)"\n        @click.debounce.100ms="$dispatch(\'burger-close\'); $dispatch(\'search-mobile-click\'); $dispatch(\'close-servicemenu\');"\n        class="h-full text-white cursor-pointer md:px-4 lg:hidden"\n        x-effect="$el.setAttribute(\'id\', \'flyout-\' + $store.searchID.current + \'-1\');$el.setAttribute(\'aria-owns\', \'flyout-\' + $store.searchID.current + \'-2\');$el.setAttribute(\'aria-controls\', \'flyout-\' + $store.searchID.current + \'-2\');$el.setAttribute(\'aria-expanded\', $store.searchFieldOpen == true);$el.setAttribute(\'aria-label\', $store.searchFieldOpen == true ? \'Suche schließen\' : \'Suche öffnen\')"\n    >\n        <svg \n            x-show="$store.searchFieldOpen == false"\n            class="h-5 text-white fill-current w-9" \n            xmlns="http://www.w3.org/2000/svg" \n            viewBox="0 0 20 20"\n            role="presentation" \n            x-effect="$el.setAttribute(\'aria-hidden\', $store.searchFieldOpen == true)"\n        >\n            <path d="M12.9 14.32a8 8 0 1 1 1.41-1.41l5.35 5.33-1.42 1.42-5.33-5.34zM8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12z"></path>\n        </svg>\n        <svg \n            x-show="$store.searchFieldOpen == true"\n            class="h-6 fill-current w-9 text-blue-congress" \n            xmlns="http://www.w3.org/2000/svg" \n            viewBox="0 0 20 20"\n            x-effect="$el.setAttribute(\'aria-hidden\', $store.searchFieldOpen == false)"\n        >\n            <path d="M15.898,4.045c-0.271-0.272-0.713-0.272-0.986,0l-4.71,4.711L5.493,4.045c-0.272-0.272-0.714-0.272-0.986,0s-0.272,0.714,0,0.986l4.709,4.711l-4.71,4.711c-0.272,0.271-0.272,0.713,0,0.986c0.136,0.136,0.314,0.203,0.492,0.203c0.179,0,0.357-0.067,0.493-0.203l4.711-4.711l4.71,4.711c0.137,0.136,0.314,0.203,0.494,0.203c0.178,0,0.355-0.067,0.492-0.203c0.273-0.273,0.273-0.715,0-0.986l-4.711-4.711l4.711-4.711C16.172,4.759,16.172,4.317,15.898,4.045z"></path>\n        </svg>\n    </button>\n</div>'
+module.exports['components/site_header/navigation_search/quick_search_form.hbs'] = '<form \n    x-data="searchSuggest()"\n    role="search" \n    action="{{resourceUrl "suche/index.nocache"}}" \n    method="get" \n    class="flex w-full sb-quick-search-form md:justify-end lg:h-10"\n>\n    <div \n        class="relative w-full lg:rounded-l" \n        id="search-content"\n        @click.away="active=false; cursorIndex=-1"\n        @keydown.arrow-down="moveDownList()"\n        @keydown.arrow-up="moveUpList()"\n    >   \n        <label for="searchInput--{{nextRandom}}" class="hidden">suchfeld</label>\n        <input \n            @input.debounce="getSuggestionsForInput();cursorIndex=-1"\n            @click="active=true" \n            name="query" \n            x-model="query"\n            placeholder=\'{{loca "search_input_placeholder" }}\' \n            class="w-full px-2 py-2 text-base leading-4 placeholder-opacity-100 border rounded-l rounded-r-none shadow-inner appearance-none lg:border-0 lg:border-none border-blue-congress lg:h-10 placeholder-text-xs placeholder-blue-congress text-blue-congress focus:outline-none"\n            type="text"\n            id="searchInput--{{getRandom}}"\n            autocomplete="off"\n            role="combobox" \n            aria-haspopup="listbox" \n            aria-autocomplete="list" \n            x-effect="$el.setAttribute(\'aria-expanded\', (query.length > 1 && active && suggestions.length > 0))"\n            aria-owns="suggestionlist--{{getRandom}}"\n            aria-controls="suggestionlist--{{getRandom}}"\n        > \n        <div \n            class="relative" \n            x-show="query.length > 1 && active && suggestions.length"\n            x-cloak\n            x-transition:leave="transition ease-in duration-100"\n            x-transition:leave-start="opacity-100"\n            x-transition:leave-end="opacity-0"\n        >\n            <ul \n                role="listbox" \n                id="suggestionlist--{{getRandom}}" \n                aria-label="Suche öffnen"\n                x-effect="$el.setAttribute(\'aria-expanded\', query.length > 1 && active && suggestions.length > 0);$el.setAttribute(\'aria-hidden\', !(query.length > 1 && active && suggestions.length > 0))"\n                class="absolute w-full mt-0.5 bg-white border rounded divide-y shadow-xl top-100"\n                x-ref="list"\n            >\n                \n                <template x-for="(suggestion, index) in suggestions" :key="index">\n                    <li class="first-of-type:border-none">\n                        <a  \n                            x-bind:active="false"\n                            x-bind:href="\'{{resourceUrl "suche/index.nocache"}}?query=\' + suggestion"\n                            x-bind:class="{\'py-1.5 px-2 link-focus-inset text-base flex w-full rounded hover:bg-blue-congress hover:text-white\': true, \'bg-blue-congress text-white\':index==cursorIndex }"\n                        >\n                            <span x-text="suggestion"></span>\n                        </a>\n                    </li>\n                </template>\n                \n            </ul>\n        </div>  \n    </div>\n    <button \n        aria-label=\'{{loca "search_input_aria_submit" }}\' \n        type="submit" \n        class="pl-3 pr-2 rounded-r cursor-pointer link-focus-inset bg-blue-congress lg:bg-white text-blue-congress z-10002"\n    >\n        <svg class="w-6 h-6 text-white fill-current bg-blue-congress lg:fill-current lg:text-blue-congress lg:bg-white" \n             xmlns="http://www.w3.org/2000/svg" \n             viewBox="0 0 20 20"\n             aria-hidden="true"\n        >\n            <path d="M12.9 14.32a8 8 0 1 1 1.41-1.41l5.35 5.33-1.42 1.42-5.33-5.34zM8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12z"></path>\n        </svg>\n    </button>\n</form>\n\n<script type="text/javascript">\n\n    function searchSuggest() {\n\n        return {\n            active:true,\n            cursorIndex: -1,\n            query: "",\n            suggestions: [],\n\n            getSuggestionsForInput() {\n\n                suggestionDataUrl = \'{{resourceUrl "suche/index~suggest.jsp"}}\' + \'?suggestions=\' + this.query;\n\n                fetch(suggestionDataUrl)\n\n                    .then((res) =>{  return res.text()})\n\n                    .then((data) => {\n                        data = JSON.parse(data.replace(/&quot;/g, \'"\'))\n                        data.solrSuggestions = this.filterStartwith(data.solrSuggestions, this.query)\n                        this.suggestions= this.filterSortbylength(data.solrSuggestions)\n                    });\n\n            },\n\n            filterStartwith(data, query) {\n               return data.filter(Suggestion => Suggestion.toLowerCase().startsWith(query.toLowerCase().trim()))\n            },\n\n            filterSortbylength(data) {\n               return data.sort((a, b) => a.length - b.length)\n            },\n\n            moveDownList() {\n                    if (this.suggestions.length > 0 && this.cursorIndex < this.suggestions.length - 1) \n                    {\n                        this.cursorIndex++;\n                        this.query = this.suggestions[this.cursorIndex];\n                    }\n            },\n\n            moveUpList() {\n                    if (this.suggestions.length > 0 && this.cursorIndex > 0) \n                    {\n                        this.cursorIndex--;\n                        this.query = this.suggestions[this.cursorIndex];\n                    }\n            },\n\n        };\n\n    }\n\n</script>'
 module.exports['components/site_header/service_navigation/service_list.hbs'] = '<div \n    id="serviceList"\n    @click.outside="$store.serviceNavIsOpen = false; toggleScrolling(!$store.searchFieldOpen && !$store.burgeropen)"\n    x-ref="serviceList"\n    :class="shouldServiceIconsBeHidden() ? \'-mt-40\' : \'\'"\n    class="absolute left-0 flex justify-center flex-initial w-full h-10 max-w-full align-top duration-500 ease-in-out border-t border-white sb-service-list transition-margin-top -z-1000 md:z-10000 md:h-12 top-10 bg-blue-congress md:border-0 md:top-auto md:w-auto md:left-auto md:static md:justify-end md:flex md:flex-auto lg:h-16 lg:pl-0 lg:pr-4 lg:w-3/4 "\n>\n    {{#with this.serviceNavigationSSILinks}}\n        <ul class="flex justify-around w-full h-full -itemCount-{{ count }} lg:w-auto lg:justify-end lg:pt-1">\n            {{#each this}}        \n                {{> components/base/loadSSI _templatePath=\'components/site_header/service_navigation/service_navigation_item\' }}               \n            {{/each}} \n        </ul>\n    {{/with}}\n</div>'
 module.exports['components/site_header/service_navigation/service_navigation_item.hbs'] = '{{#each this.navigationItems}}\n    <li class="sb-service-navigation-item {{inline-switch this.id \'["weather","warnung","traffic","video-podcast"]\' \'["-weather", "-warnung", "-traffic", "-video-podcast"]\' }} flex flex-col h-10 lg:h-15 md:h-full w-full tablet:first:border-l border-r last:border-r-0 lg:border-r-0 text-white" >\n        {{#if this.subNavigation}} \n            <button \n                id="{{nextRandom}}" \n                @click.debounce.100ms="toggleServiceNav()" \n                @click.outside="dropped = false;"\n                @close-servicemenu.window="dropped = false; $store.serviceNavIsOpen = false"\n\n                x-data="dropdown"\n                id="{{getRandom}}"\n                \n                class="js-load flex flex-col items-center justify-center h-full px-4 text-left lg:justify-start lg:px-3 lg:pt-1 lg:hover:underline lg:relative lg:rounded-t lg:border-0 lg:left-0 link-focus-inset-white {{#if this.selected}}-currentService{{/if}}"\n\n                :class="dropped ? \'bg-white fill-current text-blue-congress lg:border-0 lg:underline\' : \'\'" \n\n                aria-owns="flyout-{{getRandom}}" \n                aria-controls="flyout-{{getRandom}}"\n                x-effect="$el.setAttribute(\'aria-expanded\', dropped);$el.setAttribute(\'aria-label\', dropped ? \'{{this.text}}-Menü schließen\' : \'{{this.text}}-Menü öffnen\')"\n                data-hr-click-tracking=\'{"settings": [{"type": "uxAction", "secondLevelId": "1", "clickLabel": "Servicenavigation::{{this.text}}-Link geklickt"}]}\'\n            >\n              \n        {{else}}\n\n            {{#if this.extern}}\n                <a href="{{this.url}}" target="_blank" x-init="dropped = false" class="flex flex-col items-center justify-center h-full px-4 lg:justify-start lg:px-3 lg:rounded-t link-focus-inset-white js-load" id="flyout-{{nextRandom}}-1" data-hr-click-tracking=\'{"settings": [{"type": "uxAction", "secondLevelId": "1", "clickLabel": "Servicenavigation::{{this.text}}-Link geklickt"}]}\'>\n            {{else}}\n                <a href="{{resourceUrl this.url}}" x-init="dropped = false" class="flex flex-col items-center justify-center h-full px-4 lg:justify-start lg:px-3 lg:pt-1 lg:rounded-t link-focus-inset-white js-load" id="flyout-{{nextRandom}}-1" data-hr-click-tracking=\'{"settings": [{"type": "uxAction", "secondLevelId": "1", "clickLabel": "Servicenavigation::{{this.text}}-Link geklickt"}]}\'>\n            {{/if}}\n\n        {{/if}}\n\n            <div class="w-7 md:w-8 h-7 md:h-8" >\n                {{> components/base/image/icon _icon=this.icon _iconmap="icons" _addClass="w-full h-full"}}\n                <span class="sr-only lg:hidden">{{this.text}}</span>\n            </div>\n\n            <div :class="dropped ? \'text-blue-congress fill-current\' : \'text-white fill-white\'" class="relative flex-row items-center justify-center hidden pt-px text-white lg:flex z-10002">\n                <div class="flex" >\n                    <span class="flex text-xs leading-4 whitespace-nowrap">\n                        {{text}} \n                    </span>\n                    {{#if this.subNavigation}} \n                        <div class="flex lg:pl-1">\n                            <div class="flex items-center justify-center" :class="dropped ? \'transform rotate-180\':\'\' ">\n                                {{> components/base/image/icon _icon="arrow-down" _iconmap="icons" _addClass="w-3 h-2 fill-current"}}\n                            </div>\n                        </div>\n                    {{/if}}   \n                </div>\n            </div>  \n        {{#if this.subNavigation}}       \n            {{> components/site_header/navigation_flyout/navigation_flyout _isSectionNav=false  _navigationType="ServiceNavigation" _parent=this.text }}\n            </button>\n        {{else}}       \n            </a>\n        {{/if}}   \n    </li>\n{{/each}}'
 module.exports['components/teaser/cluster/teaser_cluster.hbs'] = '<article class="mx-5 md:mx-0  col-span-12 grid bg-[#dce8f0] rounded-tl-3xl rounded-br-3xl {{~inline-switch this.teaserSize \'["25","33","50"]\' \'[" md:col-span-3"," md:col-span-4"," md:col-span-6",""]\'}} ">\n    <div class="">\n            <h2 class="flex items-center px-5 py-6 font-bold font-headingSerif text-blue-congress">\n                {{#if this.teaserLogo}}\n                    <span>\n                        {{> components/base/image/icon _icon=this.teaserLogo _iconmap="logo" _addClass=(inline-switch this.teaserLogo \'["hessenschau_de"]\' \'["fill-[#005293] w-10 md:w-12 h-10 md:h-12","fill-[#005293] w-40 lg:w-52 h-8 md:h-12"]\')}}\n                    </span>\n                {{/if}}\n                {{#if this.title}}\n                    <span class="text-lg md:text-2xl border-blue-congress {{#if this.teaserLogo}} pl-3 ml-3 border-l-2 border-solid {{/if}}">{{this.title}}</span>\n                {{/if}}\n            </h2>\n            {{> components/teaser/cluster/teaser_cluster_list _ordered=this.isOrdered}} \n    </div>\n    {{~#with this.headlineListOverview}}\n        {{~#if this.link~}}\n            <div class="flex mx-5 py-11 {{~inline-switch ../this.teaserSize \'["100"]\' \'[" justify-center md:justify-end"," justify-center"]\'}}">\n                {{~> components/button/button_pseudo  _color="blue" _linkTitle=this.title~}}\n            </div>\n        {{~/if~}}\n    {{/with~}}\n</article>\n\n'

package/dist/assets/index.css

@@ -701,9 +701,6 @@ video {
 .\!m-0 {
   margin: 0px !important;
 }
-.m-0 {
-  margin: 0px;
-}
 .m-5 {
   margin: 1.25rem;
 }
@@ -1586,9 +1583,6 @@ video {
 .p-2 {
   padding: 0.5rem;
 }
-.p-0 {
-  padding: 0px;
-}
 .p-8 {
   padding: 2rem;
 }
@@ -2188,7 +2182,7 @@ video {
           transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
 }
 .counter-reset {
-  counter-reset: cnt1667493921763;
+  counter-reset: cnt1667558373394;
 }
 .line-clamp-4 {
   overflow: hidden;
@@ -2577,7 +2571,7 @@ video {
   --tw-ring-color: rgba(255, 255, 255, 0.5);
 }
 .-ordered {
-  counter-increment: cnt1667493921763 1;
+  counter-increment: cnt1667558373394 1;
 }
 .-ordered::before {
   position: absolute;
@@ -2593,7 +2587,7 @@ video {
   letter-spacing: .0125em;
   --tw-text-opacity: 1;
   color: rgba(0, 0, 0, var(--tw-text-opacity));
-  content: counter(cnt1667493921763);
+  content: counter(cnt1667558373394);
 }
 .\[-T\:\+Z\] {
   --t: +Z;
@@ -3225,10 +3219,6 @@ video {
     position: absolute;
   }
 
-  .md\:left-0 {
-    left: 0px;
-  }
-
   .md\:top-auto {
     top: auto;
   }
@@ -3241,6 +3231,10 @@ video {
     top: 3rem;
   }
 
+  .md\:left-0 {
+    left: 0px;
+  }
+
   .md\:z-10000 {
     z-index: 10000;
   }
@@ -3368,6 +3362,12 @@ video {
     height: 10.5rem;
   }
 
+  .md\:w-min {
+    width: -webkit-min-content;
+    width: -moz-min-content;
+    width: min-content;
+  }
+
   .md\:w-1\/2 {
     width: 50%;
   }

package/dist/views/components/content_nav/content_nav.hbs

@@ -9,7 +9,7 @@
         </nav>
     {{else}}  
         {{#decorator 'components/content_nav/content_nav_dropdown'
-                     _componentClass="c-content-nav h-10  w-full"
+                     _componentClass="c-content-nav h-10 md:h-auto w-full"
                      _teasersize=../_teasersize
                      _iconOpen="arrow-down"
                      _iconClose="arrow-up"

package/dist/views/components/content_nav/content_nav_dropdown.hbs

@@ -29,8 +29,8 @@
     </div>    
     <div x-show="shouldContentBeShown({{_teasersize}},{{this.isDropdown}},{{this.isMixed}})" 
         aria-haspopup="true"
-        :class="contentNavDropdownIsOpen ? 'z-9999 w-auto ' : ' z-1003'" 
-        class="p-0 m-0 md:left-0 md:h-auto md:overflow-visible">
+        :class="contentNavDropdownIsOpen ? 'z-9999 w-auto md:w-min md:absolute' : ' z-1003'" 
+        class="md:h-auto md:overflow-visible">
        {{~decorator_body~}}
     </div>
     

package/package.json

@@ -6,7 +6,7 @@
     "license": "MIT",
     "main": "dist/index.js",
     "repository": "https://github.com/szuelch/hr-design-system-handlebars",
-    "version": "0.77.0",
+    "version": "0.77.1",
     "scripts": {
         "test": "echo \"Error: no test specified\" && exit 1",
         "storybook": "start-storybook -p 6006 public",

package/src/stories/views/components/content_nav/content_nav.hbs

@@ -9,7 +9,7 @@
         </nav>
     {{else}}  
         {{#decorator 'components/content_nav/content_nav_dropdown'
-                     _componentClass="c-content-nav h-10  w-full"
+                     _componentClass="c-content-nav h-10 md:h-auto w-full"
                      _teasersize=../_teasersize
                      _iconOpen="arrow-down"
                      _iconClose="arrow-up"

package/src/stories/views/components/content_nav/content_nav_dropdown.hbs

@@ -29,8 +29,8 @@
     </div>    
     <div x-show="shouldContentBeShown({{_teasersize}},{{this.isDropdown}},{{this.isMixed}})" 
         aria-haspopup="true"
-        :class="contentNavDropdownIsOpen ? 'z-9999 w-auto ' : ' z-1003'" 
-        class="p-0 m-0 md:left-0 md:h-auto md:overflow-visible">
+        :class="contentNavDropdownIsOpen ? 'z-9999 w-auto md:w-min md:absolute' : ' z-1003'" 
+        class="md:h-auto md:overflow-visible">
        {{~decorator_body~}}
     </div>