hr-design-system-handlebars 1.27.2 → 1.28.1

package/dist/views/components/base/image/icon.hbs

@@ -41,7 +41,7 @@ Erklärung / Hinweise / Best Practices für "Accessible SVG":
 --}}
 {{#if _icon}}
 <svg class="sb-icon {{~#if _addClass }} {{_addClass}}{{/if}} {{#if _webview}} -webview{{/if}} {{#>css}}{{/css}}" role="presentation" aria-hidden="{{defaultIfEmpty _ariaHidden true}}"
-{{# if brand}} data-brand="{{brand}}"{{/if}}
+{{#if brand}} data-brand="{{brand}}"{{/if}}
         {{~#if _iconTitle }} {{changeRandom~}}
             aria-labelledby="iconTitle--{{getRandom}}"
             {{~#if _iconDesc }} aria-describedby="iconDesc--{{getRandom}}"{{~/if~}}

package/dist/views/components/horizontal_scroll_container/horizontal_scroll_container.hbs

@@ -8,11 +8,11 @@
     >
     <template x-if="isScrollable && $screen('{{_viewport}}')">
         <div>
-            <button class="{{#if _onDarkBackground}}arrow-left-background-blue{{else}}arrow-left-background{{/if}} absolute z-10 left-0 flex items-center justify-start w-8 h-full disabled:hidden" @click="prev($refs.scrollContainer_{{getRandom}})" :disabled="!arrowLeftDisplay" tabindex="-1" aria-hidden="true" >
-                {{> components/base/image/icon _icon="arrow-left"  _iconmap="icons" _addClass=(if _onDarkBackground 'w-3.5 h-3.5 fill-current text-white' 'w-3.5 h-3.5 fill-current text-primary') }}
+            <button style="background-image: linear-gradient(90deg, {{_bgcolor}} 50%, transparent);" class="absolute left-0 z-10 flex items-center justify-start w-10 h-full text-{{_iconcolor}} disabled:hidden" @click="prev($refs.scrollContainer_{{getRandom}})" :disabled="!arrowLeftDisplay" tabindex="-1" aria-hidden="true" >
+                {{> components/base/image/icon _icon="arrow-left"  _iconmap="icons" _addClass="w-3.5 h-3.5 fill-current" }}
             </button> 
-            <button class="{{#if _onDarkBackground}}arrow-right-background-blue{{else}}arrow-right-background{{/if}} absolute z-10 right-0 flex items-center justify-end w-8 h-full group disabled:hidden" @click="next($refs.scrollContainer_{{getRandom}})" :disabled="!arrowRightDisplay" tabindex="-1" aria-hidden="true">
-                {{> components/base/image/icon _icon="arrow-right" _iconmap="icons" _addClass=(if _onDarkBackground 'w-3.5 h-3.5 fill-current text-white' 'w-3.5 h-3.5 fill-current text-primary') }}
+            <button style="background-image: linear-gradient(270deg, {{_bgcolor}} 50%, transparent);" class="bg-gradient-to-l from-[{{_bgcolor}}] absolute right-0 z-10 flex items-center justify-end w-10 h-full text-{{_iconcolor}} disabled:hidden group" @click="next($refs.scrollContainer_{{getRandom}})" :disabled="!arrowRightDisplay" tabindex="-1" aria-hidden="true">
+                {{> components/base/image/icon _icon="arrow-right" _iconmap="icons" _addClass="w-3.5 h-3.5 fill-current" }}
             </button>
         </div>
     </template>

package/dist/views/components/horizontal_scroll_container/horizontal_scroll_container_example.hbs

@@ -1,5 +1,5 @@
 <div class="w-full h-auto mb-10">
-{{#> components/horizontal_scroll_container/horizontal_scroll_container _viewport="xs" _onDarkBackground="true"}}
+{{#> components/horizontal_scroll_container/horizontal_scroll_container _viewport="xs" _onDarkBackground="true" _bgcolor="var(--color-navigation-bg)" _iconcolor="navigation-icons"}}
     
     <div class="flex h-auto p-4 pr-10 text-lg leading-6 text-white w-[1600px] bg-primary">
         <p class="whitespace-nowrap ">Guten Tag. Dieses Div kann mittels click auf die Pfeiltasten verschoben werden kann. Die Pfeile werden dynamisch angezeigt/ausgeblendet sobald der Rand des Inhalts erreicht ist.  </p>

package/dist/views/components/site_header/brand_navigation/brand_navigation.hbs

@@ -1,5 +1,5 @@
-<div class="sb-brand-navigation lg:container w-full md:px-1 lg:px-6 px-3.5 h-10 md:h-8">
-{{#> components/horizontal_scroll_container/horizontal_scroll_container _viewport="xs" }}
+<div class="sb-brand-navigation lg:container w-full md:px-1 lg:px-6 px-3.5 h-8">
+{{#> components/horizontal_scroll_container/horizontal_scroll_container _viewport="xs" _bgcolor="var(--color-brandnavigation-bg)" _iconcolor="primary" }}
     <nav class="flex w-full text-xs list-none text-grey-scorpion">
             <span id="brandNavHeading" class="hidden">Navigation der Marken des Hessischen Rundfunks</span>
             {{#with this.brandNavigationItems}}

package/dist/views/components/site_header/brand_navigation/brand_navigation_item.hbs

@@ -1,3 +1,3 @@
-<li class="sb-brand-navigation-item{{#if this.selected}} h-10 md:h-8 font-bold text-primary {{/if}} cursor-pointer inline-block lg:hover:underline active:font-bold active:text-primary">   
-   <a class="link-focus-inset leading-10 md:leading-8 flex-col px-3 {{#if this.selected }}pl-0 {{/if}}md:flex-row js-load w-max flex justify-center {{#if this.selected}} -currentBrand {{/if}}" aria-label="{{this.name}}" href="{{resourceUrl "index.html" _site=this.site}}"{{#if this.extern}} target="_blank" rel="noopener noreferrer"{{/if}} data-hr-click-tracking='{"settings": [{"type": "uxNavigation", "secondLevelId": "1", "clickLabel": "Brandnavigation::{{this.text}}-Link geklickt"}]}'>{{this.text}}</a>
+<li class="sb-brand-navigation-item h-8 {{#if this.selected}} h-10 md:h-8 font-bold text-brandnav-pseudo {{/if}} cursor-pointer inline-block lg:hover:underline active:font-bold active:text-primary">   
+   <a class="link-focus-inset leading-[34px] items-center flex-col px-3 {{#if this.selected }}pl-0 {{/if}}md:flex-row js-load w-max flex justify-center {{#if this.selected}} -currentBrand {{/if}}" aria-label="{{this.name}}" href="{{resourceUrl "index.html" _site=this.site}}"{{#if this.extern}} target="_blank" rel="noopener noreferrer"{{/if}} data-hr-click-tracking='{"settings": [{"type": "uxNavigation", "secondLevelId": "1", "clickLabel": "Brandnavigation::{{this.text}}-Link geklickt"}]}'>{{this.text}}</a>
 </li>

package/dist/views/components/site_header/burger.hbs

@@ -1,7 +1,7 @@
 <div x-data="burger()" class="flex items-center justify-center h-full fill-current sb-burger">
     <nav>
         <button {{!-- :class="$store.burgeropen ? 'text-primary' : 'text-white'" --}}  
-            class="relative w-10 h-10 text-white tablet:w-18 tablet:h-12 focus:outline-none bg-brand"
+            class="relative w-10 h-10 text-navigation-text tablet:w-18 tablet:h-12 focus:outline-none bg-brand"
             @burger-close.window="burgerClose()"
             @click="$store.burgeropen = !$store.burgeropen" 
             @click.debounce="burgerClick()" 
@@ -10,7 +10,7 @@
             x-effect="$el.setAttribute('aria-expanded', $store.burgeropen);$el.setAttribute('aria-label', $store.burgeropen ? 'Navigation schließen' : 'Navigation öffnen')"
         >
             <span class="sr-only md:hidden">Open main menu</span>
-            <div class="absolute block w-6 transform -translate-x-1/2 -translate-y-1/2 left-1/2 top-1/2">
+            <div class="absolute block w-6 -mt-px transform -translate-x-1/2 -translate-y-1/2 left-1/2 top-1/2">
                 <span aria-hidden="true" class="absolute block w-full h-0.5 transition duration-500 ease-in-out transform bg-current " :class="$store.burgeropen ? 'rotate-45' : '-mt-2'"></span>
                 <span aria-hidden="true" class="absolute block w-full h-0.5 transition duration-500 ease-in-out transform bg-current" :class="{'opacity-0': $store.burgeropen } "></span>
                 <span aria-hidden="true" class="absolute block w-full h-0.5 transition duration-500 ease-in-out transform bg-current" :class="{'-rotate-45': $store.burgeropen, 'mt-2': ! $store.burgeropen }"></span>

package/dist/views/components/site_header/header.hbs

@@ -1,10 +1,10 @@
-<div class="sb-main-navigation" x-data="mainNavigationHandler()" x-init="{{#if _useSticky}}start(){{/if}}">
+<div class="sb-main-navigation" x-data="mainNavigationHandler()" x-init="{{#if this.useSticky}}start(){{/if}}">
     <header class="print:hidden relative z-10001 {{#if this.hasOpenSubNavigation}}lg:h-header-lg-big{{else}}lg:h-header-lg-small{{/if}} md:h-header-md h-header-sm">   
         <div x-data 
             id="headerWrapper"
             @resize.window="resetNav()" 
-            :class="shouldBrandNavBeHidden() ? '-mt-10 lg:-mt-8' : ''  "
-            class="{{#if _useSticky }}fixed top-0 left-0{{/if}} flex flex-wrap max-w-full transition-all duration-500 transform font-copy lg:justify-center lg:w-full ">
+            :class="shouldBrandNavBeHidden() ? '-mt-8 md:-mt-8' : ''  "
+            class="{{#if this.useSticky }}fixed top-0 left-0{{/if}} flex flex-wrap max-w-full transition-all duration-500 transform font-copy lg:justify-center lg:w-full ">
 
             
             <div id="anchorNavWrapper" 
@@ -13,26 +13,26 @@
             </div>
 
             <div id="brandNavWrapper" 
-                class="relative flex items-center justify-center order-1 w-full bg-white z-10000">
+                class="box-content relative flex items-center justify-center order-1 w-full bg-white border-b border-brandnavigation-border-color z-10000">
                 {{> components/site_header/brand_navigation/brand_navigation }} 
             </div>
 
             <div id="serviceNavWrapper" 
                 :class="shouldServiceNavBeHidden() ? '-mt-40' : ''"
                 
-                class="relative flex justify-center order-2 w-full transition-all duration-500 ease-in-out md:border-white lg:border-b bg-primary z-10002">   
+                class="relative flex justify-center order-2 w-full transition-all duration-500 ease-in-out border-b border-navigation-border-color bg-navigation-bg z-10002">   
                 <div id="serviceNavMainContainer" 
                     class="flex w-full h-10 lg:container md:h-12 lg:px-10 lg:h-16 z-10001">
 
                     <span id="serviceNavHeadline" class="hidden print:hidden">Service Navigation</span>
 
                     <div id="serviceLogoWrapper"  
-                        class="flex items-center order-1 w-full pl-4 pr-2 tablet:pl-5 lg:items-end lg:pb-3 bg-primary md:px-0 md:h-12 lg:h-16 md:w-1/2 md:max-w-1/2 lg:w-1/4 lg:max-w-1/4">
-                        {{> components/site_header/service_logo }}
+                        class="flex items-center order-1 w-full pl-4 pr-2 tablet:pl-5 bg-navigation-bg md:px-0 md:h-12 lg:h-16 md:w-1/2 md:max-w-1/2 lg:w-1/4 lg:max-w-1/4">
+                        {{> components/site_header/service_logo _useSticky=this.useSticky}}
                     </div>
                     
                     <div id="serviceItemsWrapper"                
-                        class="flex items-center justify-end flex-initial order-2 inline-block w-full max-w-full align-top bg-primary md:h-12 lg:h-16 lg:order-2 lg:w-3/4 lg:max-w-3/4 md:mt-0 md:w-1/2 md:max-w-1/2 md:order-2 md:border-0">
+                        class="flex items-center justify-end flex-initial order-2 inline-block w-full max-w-full align-top bg-navigation-bg md:h-12 lg:h-16 lg:order-2 lg:w-3/4 lg:max-w-3/4 md:mt-0 md:w-1/2 md:max-w-1/2 md:order-2 md:border-0">
                         {{> components/site_header/service_navigation/service_list }}
 
                         {{> components/site_header/navigation_search/quick_search_button }}
@@ -54,7 +54,7 @@
                 x-ref="sectionnavigation"
                 @toggle-sectionnav.window="toggleSectionNav"
                 :class="shouldSectionNavBeHidden() ? '-mt-40 md:-mt-40 lg:-mt-40' : ''"  
-                class="flex justify-center order-3 w-full overflow-hidden duration-500 transition-max-height lg:transition-margin-top lg:duration-500 tablet:absolute tablet:top-20 tablet:w-half-screen tablet:ml-half-screen max-h-0 lg:overflow-visible md:mt-0 lg:flex lg:max-h-full lg:h-auto bg-primary z-10000 print:hidden"
+                class="flex justify-center order-3 w-full overflow-hidden duration-500 transition-max-height lg:border-navigation-border-color [border-image-source:var(--border-navigation-border-image)] [border-image-slice:1] lg:border-b-navigation-border-width lg:transition-margin-top lg:duration-500 tablet:absolute tablet:top-20 tablet:w-half-screen tablet:ml-half-screen max-h-0 lg:overflow-visible md:mt-0 lg:flex lg:max-h-full lg:h-auto bg-navigation-bg z-10000 print:hidden"
             >   
                 {{> components/site_header/section_navigation/section_navigation }}
             </div>

package/dist/views/components/site_header/navigation_flyout/navigation_flyout_item.hbs

@@ -1,5 +1,5 @@
 <li :class="dropped ? 'h-auto' : 'h-10'"  
-    class="lg:border-0 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 text-primary justify-start hover:underline">
+    class="lg:border-0 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 first:border-t md:first:border-t-0 last:border-b last:border-navigation-border-color lg:last:border-0 text-primary justify-start hover:underline">
     {{#with this}}
         {{#> components/base/link _link=this.link _css=(inline-switch _fromNav '["RubrikNavigation","ServiceNavigation","SubNavInRubrikNav"]' '["link-focus-inset py-2 w-full","link-focus py-2 md:pl-0 lg:pl-0 lg:pr-0 break-words w-full","link-focus py-2 md:pl-0 lg:pl-0 lg:pr-0 break-words w-full"]') }}
             {{this.text}}      

package/dist/views/components/site_header/navigation_search/quick_search_button.hbs

@@ -1,16 +1,16 @@
 <div 
-    x-cloak class="flex items-center h-8 sb-quick-search-button md:h-full md:border-r md:border-l md:border-white lg:border-none" 
-    :class="$store.searchFieldOpen == true ? 'bg-white mt-2 rounded-t md:mt-0 md:rounded-none' : 'bg-primary'"
+    x-cloak class="flex items-center h-8 sb-quick-search-button md:h-full md:border-r md:border-l border-navigation-border-color lg:border-none" 
+    :class="$store.searchFieldOpen == true ? 'bg-white mt-2 rounded-t md:mt-0 md:rounded-none' : 'bg-navigation-bg'"
 >
     <button  
         @click="$store.searchFieldOpen = ! $store.searchFieldOpen; dropped = false; $store.serviceNavIsOpen = false; toggleScrolling(!$store.searchFieldOpen)"
         @click.debounce.100ms="$dispatch('burger-close'); $dispatch('search-mobile-click'); $dispatch('close-servicemenu');"
-        class="h-full text-white cursor-pointer md:px-4 lg:hidden"
+        class="h-full cursor-pointer text-navigation-text md:px-4 lg:hidden"
         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')"
     >
         <svg 
             x-show="$store.searchFieldOpen == false"
-            class="h-5 text-white fill-current w-9" 
+            class="h-5 fill-current text-navigation-text w-9" 
             xmlns="http://www.w3.org/2000/svg" 
             viewBox="0 0 20 20"
             role="presentation" 

package/dist/views/components/site_header/section_navigation/section_navigation.hbs

@@ -3,12 +3,12 @@
     class="w-full px-0 mt-10 sb-section-navigation md:mt-0 lg:px-10 lg:container " 
     x-effect="$el.setAttribute('aria-expanded',  $store.burgeropen || $screen('lg')); $el.setAttribute('aria-hidden', ! ($store.burgeropen || $screen('lg')))"
 >
-{{#> components/horizontal_scroll_container/horizontal_scroll_container _viewport="lg" _onDarkBackground="true"}}
+{{#> components/horizontal_scroll_container/horizontal_scroll_container _viewport="lg" _bgcolor="var(--color-navigation-bg)" _iconcolor="navigation-icons"}}
     <div class="flex w-full">
         <span id="sectionNavHeadline" class="hidden">Bereichsnavigation</span>
 
         {{#with this.sectionNavigationSSILinks}}
-            <ul class="flex flex-col items-center w-full text-left text-white list-none lg:flex-row lg:h-auto lg:mt-1">
+            <ul class="flex flex-col items-center w-full text-left list-none text-navigation-icons lg:flex-row lg:h-auto lg:mt-1">
                 {{#each this}}   
                     {{#if (isStorybook)}}  
                         {{> components/site_header/section_navigation/section_navigation_item }}   

package/dist/views/components/site_header/section_navigation/section_navigation_item.hbs

@@ -2,15 +2,15 @@
     <li x-data="dropdown"
         @click.outside="dropped = false" 
         @close-servicemenu.window="dropped = false" 
-        :class="dropped ? 'border-b-0 lg:bg-white lg:text-primary h-auto' : 'h-10 lg:hover:underline'" 
-        class="flex flex-wrap justify-start order-2 w-full text-white list-none border-b border-white sb-section-navigation-item first:lg:-ml-4 md:pl-0 lg:last:pr-8 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-primary lg:rounded-t">  
+        :class="dropped ? 'border-b-0 lg:bg-white lg:text-navigation-text h-auto' : 'h-10 lg:hover:underline'" 
+        class="flex flex-wrap justify-start order-2 w-full list-none border-b border-navigation-border-color text-navigation-text sb-section-navigation-item first:lg:-ml-4 md:pl-0 lg:last:pr-8 lg:first:pl-0 first:font-normal last:border-b-0 lg:border-0 lg:w-auto bg-navigation-bg lg:rounded-t">  
         
         {{#if this.isCluster ~}}
             {{!-- Gilt z.B. für REGIONEN:  --}}        
             <button id="button-{{nextRandom}}-1" 
                 @click.debounce.100ms="toggle(); correctFlyoutPos()" 
                 @resize.window="dropped=false; correctFlyoutPos()"
-                :class="dropped ? 'lg:underline font-bold lg:font-normal' : 'font-normal'"
+                :class="dropped ? 'lg:underline lg:text-primary font-bold lg:font-normal' : 'font-normal'"
                 class="{{#if this.selected}}-currentSection lg:justify-center !font-bold {{/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" 
                 x-effect="$el.setAttribute('aria-expanded', dropped);$el.setAttribute('tabindex',  $store.burgeropen || $screen('lg') ? '0' : '-1')"
                 aria-owns="flyout-{{getRandom}}" 

package/dist/views/components/site_header/service_logo.hbs

@@ -1,10 +1,29 @@
-<a class="relative flex items-center text-white fill-current sb-service-logo lg:items-end link-focus-white print:hidden" 
-    href="https://www.hessenschau.de/index.html" 
-    title="Startseite hessenschau . d e">
-    <span x-cloak class="absolute transition-opacity duration-500 ease-in-out" :class="`${percent}` < 50 ? 'opacity-0' : 'delay-200 opacity-100'" >
-        {{> components/base/image/icon _icon="brandlogo--compact-40x40px" _iconmap="logo" _addClass="logo-compact w-7 h-7 lg:w-10 lg:h-10 items-center "}}
-    </span>
-    <span class="transition-opacity duration-500 ease-in-out" :class="`${percent}` < 50 ? 'opacity-100' : 'opacity-0'">
-        {{> components/base/image/icon _icon="brandlogo--desk" _iconmap="logo" _addClass="logo-desk flex items-center fill-white w-40 h-5 md:h-7 md:w-40 lg:h-8 lg:w-52"}}
-    </span> 
-</a>
+<a class="relative flex items-center w-auto h-full text-white fill-current sb-service-logo link-focus-white print:hidden" 
+    href={{resourceUrl "index.html"}} 
+    title="{{loca "header_homepage_link_title"}}">
+
+        <div x-cloak 
+            {{#if _useSticky}}
+                class="absolute brand-logo-size md:brand-logo-size-md lg:brand-logo-size-lg flex transition-opacity duration-500 ease-in-out h-10 lg:h-[3.875rem] w-12 lg:w-[3.875rem]" 
+                :class="`${percent}` < 50 ? 'opacity-0' : 'opacity-100'"
+            {{else}}
+                class="relative flex h-10 brand-logo-size md:hidden"
+            {{/if}}     
+        >             
+            <img src="{{resourceUrl (replaceTokens "./brand/{0}/icons/logo/brandlogo--mobile.min.svg" (defaultIfEmpty this.brand "hessenschau") ) _brand=(if this.brand this.brand)}}" 
+                class="w-auto h-full logo-compact">
+        </div>      
+        
+        <div 
+            {{#if _useSticky}}
+                class="w-auto brand-logo-size md:brand-logo-size-md lg:brand-logo-size-lg transition-opacity duration-500 ease-in-out h-12 lg:h-[3.875rem]"
+                :class="`${percent}` < 50 ? 'delay-1000 opacity-100' : 'delay-200 opacity-0 hidden'"
+            {{else}}    
+                class="md:flex hidden justify-start w-auto brand-logo-size md:brand-logo-size-md lg:brand-logo-size-lg h-12 lg:h-[3.875rem]"
+            {{/if}}
+        >
+            <img src="{{resourceUrl (replaceTokens './brand/{0}/icons/logo/brandlogo--desk.min.svg' (defaultIfEmpty this.brand "hessenschau") ) _brand=(if this.brand this.brand)}}" 
+                class="w-auto h-full logo-desk">     
+        </div>
+          
+</a>

package/dist/views/components/site_header/service_navigation/service_list.hbs

@@ -3,7 +3,7 @@
     @click.outside="$store.serviceNavIsOpen = false; toggleScrolling(!$store.searchFieldOpen && !$store.burgeropen)"
     x-ref="serviceList"
     :class="shouldServiceIconsBeHidden() ? '-mt-40' : ''"
-    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-primary 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 "
+    class="absolute left-0 flex justify-center flex-initial w-full h-10 max-w-full align-top duration-500 ease-in-out border-b border-navigation-border-color sb-service-list transition-margin-top -z-1000 md:z-10000 md:h-12 top-[41px] bg-navigation-bg 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 "
 >
     {{#with this.serviceNavigationSSILinks}}
         <ul class="flex justify-around w-full h-full -itemCount-{{ count }} lg:w-auto lg:justify-end lg:pt-1">

package/dist/views/components/site_header/service_navigation/service_navigation_item.hbs

@@ -1,5 +1,5 @@
 {{#each this.navigationItems}}
-    <li class="sb-service-navigation-item -{{this.id}} 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" >
+    <li class="sb-service-navigation-item -{{this.id}} 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-navigation-icons border-navigation-border-color" >
         {{#if this.subNavigation}} 
             <button 
                 id="{{nextRandom}}" 
@@ -10,7 +10,7 @@
                 x-data="dropdown"
                 id="{{getRandom}}"
                 
-                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}}"
+                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 text-navigation-icons link-focus-inset-white {{#if this.selected}}-currentService{{/if}}"
 
                 :class="dropped ? 'bg-white fill-current text-primary lg:border-0 lg:underline' : ''" 
 
@@ -35,7 +35,7 @@
                 <span class="sr-only lg:hidden">{{this.text}}</span>
             </div>
 
-            <div :class="{'text-primary fill-current': dropped,'text-white fill-white': !dropped}" class="relative flex-row items-center justify-center hidden pt-px text-white lg:flex z-10002">
+            <div :class="{'text-primary fill-current': dropped,'text-navigation-icons fill-white': !dropped}" class="relative flex-row items-center justify-center hidden pt-px text-navigation-icons lg:flex z-10002">
                 <div class="flex" >
                     <span class="flex text-xs leading-4 whitespace-nowrap">
                         {{text}} 

package/gulpfile.js

@@ -121,7 +121,7 @@ function createSvgMapsForBrands() {
                     .pipe(
                         cheerio({
                             run: function ($, file) {
-                                $('svg > symbol').attr('preserveAspectRatio', 'xMidYMid meet')
+                                //$('svg > symbol').attr('preserveAspectRatio', 'xMidYMid meet')
                                 $('[fill]').map(function () {
                                     if (
                                         $(this).attr('fill') !== 'currentColor' &&
@@ -151,6 +151,77 @@ function createSvgMapsForBrands() {
     )
 }
 
+function saveLogoFilesToFolder() {
+    return mergeStream(
+        glob.sync(`${brandDirRoot}/*`).map(function (brandDir) {
+            return glob.sync(`${brandDir}/icons/*`).map(function(iconsDir) {
+                    let icon = path.basename(iconsDir)
+                    return src(`${iconsDir}/svgmap/*.svg`)
+                    .pipe(
+                        svgMin({
+                        full: true,
+                        plugins: [
+                            {
+                                name: 'preset-default',
+                                params: {
+                                    overrides: {
+                                        removeViewBox: false,
+                                        cleanupAttrs: false,
+                                        collapseGroups: false,
+                                        cleanupIDs: false,
+                                        convertPathData: {
+                                            straightCurves: false,
+                                        },
+                                        convertTransform: {
+                                            shortScale: false,
+                                            floatPrecision: 2,
+                                        },
+                                    },
+                                },
+                            },
+                        ],
+                    })) 
+                    .pipe(
+                        cheerio({
+                            run: function ($, file) {
+                                $('svg').attr('preserveAspectRatio', 'xMinYMid meet')
+                                /* $('[fill]').map(function () {
+                                    if (
+                                        $(this).attr('fill') !== 'currentColor' &&
+                                        iconFoldersToCleanUp.includes(icon)
+                                    ) {
+                                        $(this).removeAttr('fill')
+                                    }
+                                }) */
+                                $('[preserve--fill]').map(function () {
+                                    let value = $(this).attr('preserve--fill')
+                                    $(this).removeAttr('preserve--fill')
+                                    $(this).attr('fill', value)
+                                })
+                                $('[preserve--style]').map(function () {
+                                    let value = $(this).attr('preserve--style')
+                                    $(this).removeAttr('preserve--style')
+                                    $(this).attr('style', value)
+                                })
+                            },
+                            parserOptions: { xmlMode: true },
+                        })
+                    )
+                    .pipe(
+                        rename( function (path) {
+                            return {
+                                dirname: path.dirname,
+                                basename: path.basename + '.min',
+                                extname: path.extname,
+                            }
+                            })
+                    )                  
+                    .pipe(dest(iconsDir))
+            })    
+        })    
+    )
+}
+
 const svgSrcFileCache = new FileCache(`${options.paths.build.gulp}/cache/.svgSrcFileCache`)
 function minimizeSvgSrcFiles() {
     return mergeStream(
@@ -297,7 +368,7 @@ function watchFiles() {
     watch(`${options.paths.assets.views}/**/*.hbs`, convertPartialsToJs)
     watch(
         [`${options.paths.assets.brand}/**/*.svg`, `!${options.paths.assets.brand}/**/*.min.svg`],
-        createSvgMapsForBrands
+        //createSvgMapsForBrands
     )
     watch(
         [
@@ -366,18 +437,18 @@ function mergeLocatags() {
 exports.default = series(
     parallel(
         createSvgMaps,
-        createSvgMapsForBrands,
         minimizeSvgSrcFiles,
         parseJson,
         convertPartialsToJs,
         mergeLocatags,
         series(createModernizr, addCustomModernizrTests)
-    ),
+    ),saveLogoFilesToFolder,
     watchFiles
 )
-exports.optimizeSvgs = parallel(createSvgMaps, createSvgMapsForBrands, minimizeSvgSrcFiles)
+exports.optimizeSvgs = parallel(createSvgMaps, minimizeSvgSrcFiles)
 exports.parseJson = series(parseJson, watchForChanges)
 exports.createModernizrConfig = series(createModernizr, addCustomModernizrTests)
 exports.mergeLocatags = mergeLocatags
 exports.convertPartialsToJs = convertPartialsToJs
 exports.preparePartialsForDelivery = preparePartialsForDelivery
+exports.saveLogoFilesToFolder = saveLogoFilesToFolder

package/package.json

@@ -6,7 +6,7 @@
     "license": "MIT",
     "main": "dist/index.js",
     "repository": "https://github.com/szuelch/hr-design-system-handlebars",
-    "version": "1.27.2",
+    "version": "1.28.1",
     "scripts": {
         "test": "echo \"Error: no test specified\" && exit 1",
         "storybook": "storybook dev -p 6006 public",
@@ -23,6 +23,7 @@
         "optimize-svgs": "gulp optimizeSvgs",
         "parseJson": "gulp parseJson",
         "partialsToJs": "gulp convertPartialsToJs",
+        "saveLogoFilesToFolder": "gulp saveLogoFilesToFolder",
         "preparePartialsForDelivery": "gulp preparePartialsForDelivery",
         "create-modernizr-config": "gulp createModernizrConfig",
         "merge-locatags": "gulp mergeLocatags"

package/src/assets/brand/hessenschau/icons/logo/brandlogo--desk.min.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -10 208 46" preserveAspectRatio="xMinYMid meet"><g><path d="M66.9 15.7c3.5.3 5.5 2 5.5 5.2 0 3.9-3.3 5.9-7.7 5.9-3 0-5.6-.5-7.8-2.7l2.5-2.5c1.5 1.5 3.6 2 5.3 2 2.3 0 4.1-.8 4.1-2.6 0-1.2-.7-2-2.5-2.2l-2.9-.3c-3.5-.3-5.5-1.9-5.5-5.2 0-3.6 3.1-5.7 7-5.7 2.8 0 5.2.6 6.9 2.1l-2.3 2.4c-1.2-1-2.8-1.3-4.6-1.3-2.2 0-3.4 1-3.4 2.4 0 1.1.6 2 2.6 2.1l2.8.4m-18.3 0-2.9-.3c-2-.2-2.6-1.1-2.6-2.1 0-1.4 1.2-2.4 3.4-2.4 1.8 0 3.4.4 4.6 1.3l2.3-2.4c-1.7-1.5-4.1-2.1-6.9-2.1-3.9 0-7 2-7 5.7 0 3.3 2 4.9 5.5 5.2l2.9.3c1.8.2 2.5 1 2.5 2.2 0 1.8-1.8 2.6-4.1 2.6-1.9 0-3.8-.4-5.3-2l-2.5 2.5c2.2 2.1 4.8 2.7 7.8 2.7 4.4 0 7.7-2 7.7-5.9.1-3.4-1.9-5-5.4-5.3m-16.7.2c0-1.2-.2-1.7-.5-2.6-.6-1.4-1.9-2.3-3.6-2.3s-3.1 1-3.7 2.3c-.4.9-.4 1.4-.4 2.6h8.2Zm-4.2-8.1c5 0 7.9 3.6 7.9 9v1.7h-12c0 3.2 1.7 5.2 4.7 5.2 2.1 0 3.2-.6 4.5-1.9l2.4 2.2c-1.9 1.9-3.7 2.9-6.9 2.9-4.6 0-8.4-2.5-8.4-9.5-.1-6.1 3-9.6 7.8-9.6m115.1 3.3c1.5 0 2.4.4 3.6 1.8l2.6-2.5c-1.8-1.9-3.6-2.6-6.1-2.6-4.2 0-8.3 2.6-8.3 9.5s4.1 9.5 8.3 9.5c2.6 0 4.4-.8 6.1-2.7l-2.6-2.5c-1.2 1.2-2.1 1.8-3.6 1.8s-2.7-.6-3.5-1.7c-.8-1.1-1.1-2.4-1.1-4.5s.3-3.5 1.1-4.5c.8-.9 2-1.6 3.5-1.6m-54.9 4.8c0-1.2-.2-1.7-.5-2.6-.6-1.4-1.9-2.3-3.6-2.3s-3.1 1-3.7 2.3c-.4.9-.4 1.4-.4 2.6h8.2Zm-4.2-8.1c5 0 7.9 3.6 7.9 9v1.7h-12c0 3.2 1.7 5.2 4.7 5.2 2.1 0 3.2-.6 4.5-1.9l2.4 2.2c-1.9 1.9-3.7 2.9-6.9 2.9-4.6 0-8.4-2.5-8.4-9.5 0-6.1 3.1-9.6 7.8-9.6m100.1 10.6h-4.4c-2.2 0-3.4 1-3.4 2.7s1.1 2.7 3.4 2.7c1.4 0 2.5-.1 3.5-1.1.5-.5.8-1.4.8-2.8l.1-1.5Zm-3.9-10.6c5.1 0 7.6 2.1 7.6 6.4v12.4h-3.6v-1.7c-1.3 1.3-2.7 1.9-5 1.9s-3.8-.5-5-1.7c-1-1-1.5-2.4-1.5-4 0-3.1 2.1-5.3 6.4-5.3h4.9v-1.3c0-2.3-1.2-3.5-4.1-3.5-2 0-3 .4-4.1 1.8l-2.5-2.3c2-2 3.8-2.7 6.9-2.7m-54.6 7.9-2.9-.3c-2-.2-2.6-1.1-2.6-2.1 0-1.4 1.2-2.4 3.4-2.4 1.8 0 3.4.4 4.6 1.3l2.3-2.4c-1.7-1.5-4.1-2.1-6.9-2.1-3.9 0-7 2-7 5.7 0 3.3 2 4.9 5.5 5.2l2.9.3c1.8.2 2.5 1 2.5 2.2 0 1.8-1.8 2.6-4.1 2.6-1.9 0-3.8-.4-5.3-2l-2.5 2.5c2.2 2.1 4.8 2.7 7.8 2.7 4.4 0 7.7-2 7.7-5.9.1-3.4-1.9-5-5.4-5.3M0 .3v26.4h4v-15s1.6-.4 3.8-.4c3.1 0 3 1.7 3 3v12.4H15v-14c-.2-2.7-2.1-4.8-6-4.8-2.4 0-5.1.5-5.1.5V0L0 .3Zm153.1 0v26.4h4v-15s1.6-.4 3.8-.4c3.1 0 3 1.7 3 3v12.4h4.2v-14c-.2-2.7-2.1-4.8-6-4.8-2.4 0-5.1.5-5.1.5V0l-3.9.3ZM204.3 8v11.3c0 2.8-1 4.1-3.8 4.2-2.6 0-3.8-1.3-3.8-4.2V8H193v11.9c0 2-.5 6.9 7.6 6.9s7.6-4.9 7.6-6.9V8h-3.9ZM100 26.6V15.3c0-2.8 1-4.1 3.8-4.2 2.6 0 3.8 1.3 3.8 4.2v11.3h3.7V14.8c0-2 .5-6.9-7.6-6.9s-7.6 4.9-7.6 6.9v11.9l3.9-.1Z" style="fill:#fff"/></g></svg>

package/src/assets/brand/hessenschau/icons/logo/brandlogo--mobile.min.svg

@@ -0,0 +1 @@
+<svg id="Ebene_1" data-name="Ebene 1" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMid meet" viewBox="0 0 38.71 38.18" x="0" y="0" style="enable-background:new 0 0 38.71 38.18" xml:space="preserve"><defs><style>.cls-1{fill:#fff}</style></defs><path class="cls-1" d="M28.61 21.19 26.49 21c-1.43-.14-1.85-.76-1.85-1.56 0-1 .82-1.76 2.44-1.76a5 5 0 0 1 3.31 1l1.69-1.75a7.23 7.23 0 0 0-5-1.54c-2.8 0-5.05 1.51-5.05 4.18 0 2.4 1.45 3.56 4 3.77l2.14.19c1.3.11 1.8.7 1.8 1.62C30 26.44 28.67 27 27 27a5.15 5.15 0 0 1-3.86-1.43l-1.78 1.8a7.28 7.28 0 0 0 5.64 2c3.21 0 5.59-1.48 5.59-4.34 0-2.42-1.48-3.64-4-3.85M10.87 9.68v6.16a19.92 19.92 0 0 1 3.64-.38c2.83 0 4.25 1.55 4.35 3.53 0 .51 0 .79 0 1.33v8.9h-3v-9.07c0-1 .07-2.25-2.19-2.24a11.68 11.68 0 0 0-2.74.32v11H8V9.87Z" transform="translate(-.6 -.94)"/><path class="cls-1" d="M29.79 39.12H.6V10.46C.6 1.05 10 .94 10.12.94h29.19V29.6c0 9.41-9.42 9.52-9.52 9.52M2.53 37.19h27.26c.31 0 7.59-.12 7.59-7.59V2.88H10.12c-.31 0-7.59.12-7.59 7.58Z" transform="translate(-.6 -.94)"/></svg>

package/src/assets/brand/hessenschau/icons/logo/svgmap/brandlogo--desk.svg

@@ -1,31 +1,13 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 24.3.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 234 30" preserveAspectRatio="xMinYMin meet" width="184" height="40" style="enable-background:new 0 0 184 40" xml:space="preserve">
-<style type="text/css">
-	.st0{fill:#FFFFFF;}
-</style>
-<path class="st0" d="M75.3,17.6c3.9,0.3,6.2,2.2,6.2,5.9c0,4.4-3.7,6.6-8.7,6.6c-3.4,0-6.3-0.6-8.8-3l2.8-2.8c1.7,1.7,4,2.2,6,2.2
-	c2.6,0,4.6-0.9,4.6-2.9c0-1.4-0.8-2.3-2.8-2.5l-3.3-0.3c-3.9-0.3-6.2-2.1-6.2-5.8c0-4.1,3.5-6.4,7.9-6.4c3.1,0,5.8,0.7,7.8,2.4
-	l-2.6,2.7c-1.3-1.1-3.2-1.5-5.2-1.5c-2.5,0-3.8,1.1-3.8,2.7c0,1.2,0.7,2.2,2.9,2.4L75.3,17.6 M54.7,17.6l-3.3-0.3
-	c-2.2-0.2-2.9-1.2-2.9-2.4c0-1.6,1.3-2.7,3.8-2.7c2,0,3.8,0.4,5.2,1.5l2.6-2.7c-1.9-1.7-4.6-2.4-7.8-2.4c-4.4,0-7.9,2.3-7.9,6.4
-	c0,3.7,2.3,5.5,6.2,5.8l3.3,0.3c2,0.2,2.8,1.1,2.8,2.5c0,2-2,2.9-4.6,2.9c-2.1,0-4.3-0.5-6-2.2l-2.8,2.8c2.5,2.4,5.4,3,8.8,3
-	c5,0,8.7-2.3,8.7-6.6C60.9,19.8,58.6,18,54.7,17.6 M35.9,17.8c0-1.3-0.2-1.9-0.6-2.9c-0.7-1.6-2.1-2.6-4.1-2.6s-3.5,1.1-4.2,2.6
-	c-0.4,1-0.5,1.6-0.5,2.9H35.9z M31.2,8.7c5.6,0,8.9,4.1,8.9,10.1v1.9H26.5c0,3.6,1.9,5.9,5.3,5.9c2.4,0,3.6-0.7,5.1-2.1l2.7,2.5
-	c-2.1,2.1-4.2,3.3-7.8,3.3c-5.2,0-9.4-2.8-9.4-10.7C22.3,12.7,25.8,8.7,31.2,8.7 M160.6,12.5c1.7,0,2.7,0.5,4,2l2.9-2.8
-	c-2-2.1-4-2.9-6.9-2.9c-4.7,0-9.3,2.9-9.3,10.7s4.6,10.7,9.3,10.7c2.9,0,4.9-0.9,6.9-3l-2.9-2.8c-1.3,1.4-2.4,2-4,2
-	c-1.6,0-3-0.7-3.9-1.9c-0.9-1.2-1.2-2.7-1.2-5.1c0-2.4,0.3-3.9,1.2-5.1C157.6,13.2,159,12.5,160.6,12.5 M98.9,17.8
-	c0-1.3-0.2-1.9-0.6-2.9c-0.7-1.6-2.1-2.6-4.1-2.6c-2,0-3.5,1.1-4.2,2.6c-0.4,1-0.5,1.6-0.5,2.9H98.9z M94.2,8.7
-	c5.6,0,8.9,4.1,8.9,10.1v1.9H89.5c0,3.6,1.9,5.9,5.3,5.9c2.4,0,3.6-0.7,5.1-2.1l2.7,2.5c-2.1,2.1-4.2,3.3-7.8,3.3
-	c-5.2,0-9.4-2.8-9.4-10.7C85.4,12.7,88.9,8.7,94.2,8.7 M206.8,20.7h-4.9c-2.5,0-3.8,1.1-3.8,3c0,1.9,1.2,3,3.8,3
-	c1.6,0,2.8-0.1,3.9-1.2c0.6-0.6,0.9-1.6,0.9-3.1V20.7z M202.4,8.7c5.7,0,8.6,2.4,8.6,7.2v14h-4.1V28c-1.5,1.5-3,2.1-5.6,2.1
-	c-2.6,0-4.3-0.6-5.6-1.9c-1.1-1.1-1.7-2.7-1.7-4.5c0-3.5,2.4-6,7.2-6h5.5v-1.5c0-2.6-1.3-3.9-4.6-3.9c-2.3,0-3.4,0.5-4.6,2l-2.8-2.6
-	C196.9,9.5,198.9,8.7,202.4,8.7 M141,17.6l-3.3-0.3c-2.2-0.2-2.9-1.2-2.9-2.4c0-1.6,1.3-2.7,3.8-2.7c2,0,3.8,0.4,5.2,1.5l2.6-2.7
-	c-1.9-1.7-4.6-2.4-7.8-2.4c-4.4,0-7.9,2.3-7.9,6.4c0,3.7,2.3,5.5,6.2,5.8l3.3,0.3c2,0.2,2.8,1.1,2.8,2.5c0,2-2,2.9-4.6,2.9
-	c-2.1,0-4.3-0.5-6-2.2l-2.8,2.8c2.5,2.4,5.4,3,8.8,3c5,0,8.7-2.3,8.7-6.6C147.2,19.8,144.9,18,141,17.6 M0,0.3v29.7h4.5V13.1
-	c0,0,1.8-0.5,4.3-0.5c3.5,0,3.4,1.9,3.4,3.4v13.9h4.7V16.3c0-0.8,0-1.3,0-2c-0.2-3-2.4-5.4-6.8-5.4c-2.7,0-5.7,0.6-5.7,0.6V0L0,0.3z
-	 M172.2,0.3v29.7h4.5V13.1c0,0,1.8-0.5,4.3-0.5c3.5,0,3.4,1.9,3.4,3.4v13.9h4.7V16.3c0-0.8,0-1.3,0-2c-0.2-3-2.4-5.4-6.8-5.4
-	c-2.7,0-5.7,0.6-5.7,0.6V0L172.2,0.3z M229.8,9v12.7c0,3.2-1.1,4.6-4.3,4.7c-2.9,0-4.3-1.5-4.3-4.7V9H217v13.4
-	c0,2.3-0.6,7.8,8.5,7.8c9.1,0,8.5-5.5,8.5-7.8V9H229.8z M112.5,29.9V17.2c0-3.2,1.1-4.6,4.3-4.7c2.9,0,4.3,1.5,4.3,4.7v12.7h4.2
-	V16.6c0-2.3,0.6-7.8-8.5-7.8s-8.5,5.5-8.5,7.8v13.4H112.5z"/>
-</svg>
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg"  x="0px" y="0px" viewBox="0 -10 208 46">
+  <defs>
+    <style>
+      .cls-1 {
+        fill: #fff;
+      }
+    </style>
+  </defs>
+  <g>
+    <path class="cls-1" d="m66.9,15.7c3.5.3,5.5,2,5.5,5.2,0,3.9-3.3,5.9-7.7,5.9-3,0-5.6-.5-7.8-2.7l2.5-2.5c1.5,1.5,3.6,2,5.3,2,2.3,0,4.1-.8,4.1-2.6,0-1.2-.7-2-2.5-2.2l-2.9-.3c-3.5-.3-5.5-1.9-5.5-5.2,0-3.6,3.1-5.7,7-5.7,2.8,0,5.2.6,6.9,2.1l-2.3,2.4c-1.2-1-2.8-1.3-4.6-1.3-2.2,0-3.4,1-3.4,2.4,0,1.1.6,2,2.6,2.1l2.8.4m-18.3,0l-2.9-.3c-2-.2-2.6-1.1-2.6-2.1,0-1.4,1.2-2.4,3.4-2.4,1.8,0,3.4.4,4.6,1.3l2.3-2.4c-1.7-1.5-4.1-2.1-6.9-2.1-3.9,0-7,2-7,5.7,0,3.3,2,4.9,5.5,5.2l2.9.3c1.8.2,2.5,1,2.5,2.2,0,1.8-1.8,2.6-4.1,2.6-1.9,0-3.8-.4-5.3-2l-2.5,2.5c2.2,2.1,4.8,2.7,7.8,2.7,4.4,0,7.7-2,7.7-5.9.1-3.4-1.9-5-5.4-5.3m-16.7.2c0-1.2-.2-1.7-.5-2.6-.6-1.4-1.9-2.3-3.6-2.3s-3.1,1-3.7,2.3c-.4.9-.4,1.4-.4,2.6h8.2Zm-4.2-8.1c5,0,7.9,3.6,7.9,9v1.7h-12c0,3.2,1.7,5.2,4.7,5.2,2.1,0,3.2-.6,4.5-1.9l2.4,2.2c-1.9,1.9-3.7,2.9-6.9,2.9-4.6,0-8.4-2.5-8.4-9.5-.1-6.1,3-9.6,7.8-9.6m115.1,3.3c1.5,0,2.4.4,3.6,1.8l2.6-2.5c-1.8-1.9-3.6-2.6-6.1-2.6-4.2,0-8.3,2.6-8.3,9.5s4.1,9.5,8.3,9.5c2.6,0,4.4-.8,6.1-2.7l-2.6-2.5c-1.2,1.2-2.1,1.8-3.6,1.8s-2.7-.6-3.5-1.7c-.8-1.1-1.1-2.4-1.1-4.5s.3-3.5,1.1-4.5c.8-.9,2-1.6,3.5-1.6m-54.9,4.8c0-1.2-.2-1.7-.5-2.6-.6-1.4-1.9-2.3-3.6-2.3s-3.1,1-3.7,2.3c-.4.9-.4,1.4-.4,2.6h8.2Zm-4.2-8.1c5,0,7.9,3.6,7.9,9v1.7h-12c0,3.2,1.7,5.2,4.7,5.2,2.1,0,3.2-.6,4.5-1.9l2.4,2.2c-1.9,1.9-3.7,2.9-6.9,2.9-4.6,0-8.4-2.5-8.4-9.5,0-6.1,3.1-9.6,7.8-9.6m100.1,10.6h-4.4c-2.2,0-3.4,1-3.4,2.7s1.1,2.7,3.4,2.7c1.4,0,2.5-.1,3.5-1.1.5-.5.8-1.4.8-2.8l.1-1.5h0Zm-3.9-10.6c5.1,0,7.6,2.1,7.6,6.4v12.4h-3.6v-1.7c-1.3,1.3-2.7,1.9-5,1.9s-3.8-.5-5-1.7c-1-1-1.5-2.4-1.5-4,0-3.1,2.1-5.3,6.4-5.3h4.9v-1.3c0-2.3-1.2-3.5-4.1-3.5-2,0-3,.4-4.1,1.8l-2.5-2.3c2-2,3.8-2.7,6.9-2.7m-54.6,7.9l-2.9-.3c-2-.2-2.6-1.1-2.6-2.1,0-1.4,1.2-2.4,3.4-2.4,1.8,0,3.4.4,4.6,1.3l2.3-2.4c-1.7-1.5-4.1-2.1-6.9-2.1-3.9,0-7,2-7,5.7,0,3.3,2,4.9,5.5,5.2l2.9.3c1.8.2,2.5,1,2.5,2.2,0,1.8-1.8,2.6-4.1,2.6-1.9,0-3.8-.4-5.3-2l-2.5,2.5c2.2,2.1,4.8,2.7,7.8,2.7,4.4,0,7.7-2,7.7-5.9.1-3.4-1.9-5-5.4-5.3M0,.3v26.4h4v-15s1.6-.4,3.8-.4c3.1,0,3,1.7,3,3v12.4h4.2v-14c-.2-2.7-2.1-4.8-6-4.8-2.4,0-5.1.5-5.1.5V0L0,.3ZM153.1.3v26.4h4v-15s1.6-.4,3.8-.4c3.1,0,3,1.7,3,3v12.4h4.2v-14c-.2-2.7-2.1-4.8-6-4.8-2.4,0-5.1.5-5.1.5V0l-3.9.3Zm51.2,7.7v11.3c0,2.8-1,4.1-3.8,4.2-2.6,0-3.8-1.3-3.8-4.2V8h-3.7v11.9c0,2-.5,6.9,7.6,6.9s7.6-4.9,7.6-6.9V8h-3.9Zm-104.3,18.6v-11.3c0-2.8,1-4.1,3.8-4.2,2.6,0,3.8,1.3,3.8,4.2v11.3h3.7v-11.8c0-2,.5-6.9-7.6-6.9s-7.6,4.9-7.6,6.9v11.9l3.9-.1h0Z"/>
+  </g>
+</svg>

package/src/assets/brand/hessenschau/icons/logo/svgmap/brandlogo--mobile.svg

@@ -1,41 +1,5 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 24.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 160 19" width="160" height="19" enable-background="new 0 0 160 19" xml:space="preserve">
-<path fill="#FFFFFF" d="M46.182,11.02c2.349,0.197,3.735,1.311,3.735,3.537c0,2.622-2.226,3.982-5.22,3.982
-	c-2.053,0-3.784-0.346-5.267-1.805l1.656-1.656c1.015,1.038,2.375,1.31,3.611,1.31c1.534,0,2.746-0.545,2.746-1.733
-	c0-0.84-0.469-1.385-1.682-1.483l-2.003-0.173c-2.35-0.197-3.71-1.262-3.71-3.462c0-2.449,2.103-3.834,4.725-3.834
-	c1.879,0,3.487,0.395,4.65,1.41L47.839,8.72c-0.792-0.668-1.905-0.916-3.092-0.916c-1.509,0-2.276,0.668-2.276,1.607
-	c0,0.743,0.396,1.311,1.732,1.435L46.182,11.02 M33.84,11.02l-1.979-0.173c-1.335-0.124-1.732-0.692-1.732-1.435
-	c0-0.939,0.767-1.607,2.276-1.607c1.187,0,2.3,0.247,3.091,0.916l1.583-1.607c-1.162-1.015-2.77-1.41-4.65-1.41
-	c-2.621,0-4.724,1.385-4.724,3.834c0,2.201,1.36,3.265,3.71,3.462l2.003,0.173c1.212,0.099,1.681,0.643,1.681,1.483
-	c0,1.187-1.211,1.733-2.745,1.733c-1.237,0-2.598-0.273-3.612-1.31l-1.657,1.656c1.485,1.459,3.216,1.805,5.269,1.805
-	c2.992,0,5.219-1.36,5.219-3.982C37.574,12.331,36.189,11.217,33.84,11.02 M22.585,11.094c-0.024-0.767-0.099-1.138-0.346-1.707
-	c-0.396-0.939-1.287-1.582-2.474-1.582c-1.187,0-2.102,0.643-2.498,1.582c-0.247,0.569-0.297,0.94-0.322,1.707H22.585z
-	 M19.766,5.702c3.364,0,5.318,2.473,5.318,6.035v1.113h-8.138c0,2.151,1.138,3.512,3.191,3.512c1.41,0,2.152-0.396,3.043-1.285
-	l1.607,1.509c-1.287,1.285-2.498,1.953-4.699,1.953c-3.142,0-5.64-1.656-5.64-6.431C14.447,8.051,16.55,5.702,19.766,5.702
-	 M97.282,7.953c0.989,0,1.607,0.321,2.399,1.187l1.732-1.682c-1.188-1.262-2.4-1.756-4.131-1.756c-2.819,0-5.59,1.707-5.59,6.406
-	c0,4.699,2.77,6.431,5.59,6.431c1.731,0,2.943-0.519,4.131-1.781l-1.732-1.656c-0.792,0.865-1.41,1.187-2.399,1.187
-	c-0.964,0-1.781-0.395-2.325-1.113c-0.544-0.693-0.742-1.607-0.742-3.067c0-1.459,0.197-2.35,0.742-3.042
-	C95.501,8.349,96.318,7.953,97.282,7.953 M60.354,11.094c-0.025-0.767-0.099-1.138-0.347-1.707
-	c-0.396-0.939-1.286-1.582-2.473-1.582c-1.187,0-2.102,0.643-2.498,1.582c-0.247,0.569-0.297,0.94-0.321,1.707H60.354z
-	 M57.535,5.702c3.364,0,5.318,2.473,5.318,6.035v1.113h-8.137c0,2.151,1.138,3.512,3.19,3.512c1.41,0,2.152-0.396,3.043-1.285
-	l1.607,1.509c-1.286,1.285-2.498,1.953-4.699,1.953c-3.141,0-5.64-1.656-5.64-6.431C52.217,8.051,54.319,5.702,57.535,5.702
-	 M124.96,12.85h-2.944c-1.484,0-2.251,0.667-2.251,1.805c0,1.138,0.717,1.781,2.3,1.781c0.964,0,1.682-0.074,2.35-0.716
-	c0.37-0.372,0.544-0.966,0.544-1.856V12.85z M122.313,5.702c3.438,0,5.169,1.459,5.169,4.304v8.386h-2.473v-1.138
-	c-0.915,0.913-1.781,1.285-3.339,1.285c-1.559,0-2.598-0.372-3.365-1.138c-0.643-0.667-0.989-1.633-0.989-2.696
-	c0-2.102,1.459-3.611,4.328-3.611h3.315v-0.89c0-1.583-0.793-2.35-2.746-2.35c-1.385,0-2.053,0.321-2.745,1.212l-1.658-1.558
-	C118.999,6.122,120.235,5.702,122.313,5.702 M85.534,11.02l-1.979-0.173c-1.336-0.124-1.731-0.692-1.731-1.435
-	c0-0.939,0.767-1.607,2.275-1.607c1.187,0,2.301,0.247,3.092,0.916l1.583-1.607c-1.162-1.015-2.77-1.41-4.65-1.41
-	c-2.622,0-4.725,1.385-4.725,3.834c0,2.201,1.361,3.265,3.711,3.462l2.003,0.173c1.213,0.099,1.682,0.643,1.682,1.483
-	c0,1.187-1.212,1.733-2.745,1.733c-1.237,0-2.597-0.273-3.612-1.31l-1.657,1.656c1.484,1.459,3.216,1.805,5.269,1.805
-	c2.993,0,5.219-1.36,5.219-3.982C89.269,12.331,87.883,11.217,85.534,11.02 M1.091,0.631V18.39h2.723V8.302
-	c0,0,1.061-0.283,2.562-0.289c2.108-0.009,2.048,1.133,2.048,2.055v8.322h2.791v-8.166c0-0.498,0.004-0.754-0.019-1.217
-	c-0.093-1.821-1.419-3.218-4.064-3.243C5.54,5.748,3.729,6.117,3.729,6.117V0.461L1.091,0.631z M104.256,0.631V18.39h2.724V8.302
-	c0,0,1.059-0.283,2.561-0.289c2.108-0.009,2.048,1.133,2.048,2.055v8.322h2.791v-8.166c0-0.498,0.006-0.754-0.018-1.217
-	c-0.094-1.821-1.419-3.218-4.064-3.243c-1.592-0.017-3.403,0.353-3.403,0.353V0.461L104.256,0.631z M138.716,5.843v7.631
-	c0,1.91-0.683,2.738-2.56,2.791c-1.734-0.026-2.56-0.881-2.56-2.791V5.843h-2.523v8.003c0,1.407-0.375,4.692,5.083,4.692
-	c5.457,0,5.083-3.285,5.083-4.692V5.843H138.716z M68.473,18.39v-7.634c0-1.911,0.684-2.74,2.562-2.791
-	c1.733,0.025,2.56,0.88,2.56,2.791v7.634h2.524v-8.007c0-1.407,0.375-4.693-5.085-4.693c-5.46,0-5.085,3.286-5.085,4.693v8.007
-	H68.473z"/>
-</svg>
+<svg id="Ebene_1" data-name="Ebene 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMinYMid meet" viewBox="0 0 38.71 38.18" x="0px" y="0px"
+style="enable-background:new 0 0 38.71 38.18;" xml:space="preserve">
+<defs><style>.cls-1{fill:#fff;}</style></defs>
+<path class="cls-1" d="M28.61,21.19,26.49,21c-1.43-.14-1.85-.76-1.85-1.56,0-1,.82-1.76,2.44-1.76a5,5,0,0,1,3.31,1l1.69-1.75a7.23,7.23,0,0,0-5-1.54c-2.8,0-5.05,1.51-5.05,4.18,0,2.4,1.45,3.56,4,3.77l2.14.19c1.3.11,1.8.7,1.8,1.62C30,26.44,28.67,27,27,27a5.15,5.15,0,0,1-3.86-1.43l-1.78,1.8a7.28,7.28,0,0,0,5.64,2c3.21,0,5.59-1.48,5.59-4.34,0-2.42-1.48-3.64-4-3.85" transform="translate(-0.6 -0.94)"/><path class="cls-1" d="M10.87,9.68v6.16a19.92,19.92,0,0,1,3.64-.38c2.83,0,4.25,1.55,4.35,3.53,0,.51,0,.79,0,1.33v8.9h-3V20.15c0-1,.07-2.25-2.19-2.24a11.68,11.68,0,0,0-2.74.32v11H8V9.87Z" transform="translate(-0.6 -0.94)"/><path class="cls-1" d="M29.79,39.12H.6V10.46C.6,1.05,10,.94,10.12.94H39.31V29.6c0,9.41-9.42,9.52-9.52,9.52M2.53,37.19H29.79c.31,0,7.59-.12,7.59-7.59V2.88H10.12c-.31,0-7.59.12-7.59,7.58Z" transform="translate(-0.6 -0.94)"/>
+</svg>

package/src/assets/brand/hr/icons/logo/brandlogo--desk.min.svg

@@ -0,0 +1 @@
+<svg id="Ebene_2" data-name="Ebene 2" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMid meet" viewBox="0 0 55 42"><defs><style>.cls-1{fill:#fff}</style></defs><g id="Ebene_1-2" data-name="Ebene 1"><g id="g850"><path id="path844" class="cls-1" d="M27.9 42.1c-9.3.2-20.6-1.5-27.9-4.7v-2.8c7.7 3.2 18 4.9 27.3 4.7 10.1-.2 20.4-1.8 27.7-4.7v2.8c-8.1 3-17.2 4.5-27.1 4.7"/><path id="path846" class="cls-1" d="M4.7 0v10.5s3.4-.6 6.1-.6c4.7 0 7.1 2.6 7.3 5.9v15.9h-4.7V17.8c0-1.8 0-4-3.8-4-2.8 0-4.7.6-4.7.6v17.2H0V.2L4.7 0Z"/><path id="path848" class="cls-1" d="M35.6 9.7s-4.6.2-7.1.8c-3.2.6-5.1 2.6-5.3 5.3v15.9h5.1v-14c0-1.2 0-2 1-2.8s3-1 4.2-1c.8 0 2.4-.2 2.4-.2v-4s-.3 0-.3 0Z"/></g></g></svg>

package/src/assets/brand/hr/icons/logo/brandlogo--mobile.min.svg

@@ -0,0 +1 @@
+<svg version="1.1" id="hr" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 55 42.1" preserveAspectRatio="xMinYMid meet" xml:space="preserve"><g style="fill:#fff"><path d="M27.9 42.1c-9.3.2-20.6-1.5-27.9-4.7v-2.8c7.7 3.2 18 4.9 27.3 4.7 10.1-.2 20.4-1.8 27.7-4.7v2.8c-8.1 3-17.2 4.5-27.1 4.7M4.7 0v10.5s3.4-.6 6.1-.6c4.7 0 7.1 2.6 7.3 5.9 0 .8 0 1.4 0 2.2v13.7h-4.7V17.8c0-1.8 0-4-3.8-4-2.8 0-4.7.6-4.7.6v17.2H0V.2L4.7 0zM35.6 9.7s-4.6.2-7.1.8c-3.2.6-5.1 2.6-5.3 5.3 0 .6 0 1 0 2.2v13.7h5.1v-14c0-1.2 0-2 1-2.8s3-1 4.2-1c.8 0 2.4-.2 2.4-.2v-4s-.3 0-.3 0z"/></g></svg>

package/src/assets/brand/hr/icons/logo/svgmap/brandlogo--desk.svg

@@ -1,13 +1,17 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 19.2.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="hr" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 55 42.1" enable-background="new 0 0 55 42.1" xml:space="preserve">
-<g>
-	<path d="M27.9,42.1C18.6,42.3,7.3,40.6,0,37.4v-2.8c7.7,3.2,18,4.9,27.3,4.7c10.1-0.2,20.4-1.8,27.7-4.7v2.8
-		C46.9,40.4,37.8,41.9,27.9,42.1"/>
-	<path d="M4.7,0v10.5c0,0,3.4-0.6,6.1-0.6c4.7,0,7.1,2.6,7.3,5.9c0,0.8,0,1.4,0,2.2v13.7h-4.7V17.8c0-1.8,0-4-3.8-4
-		c-2.8,0-4.7,0.6-4.7,0.6v17.2H0V0.2L4.7,0z"/>
-	<path d="M35.6,9.7c0,0-4.6,0.2-7.1,0.8c-3.2,0.6-5.1,2.6-5.3,5.3c0,0.6,0,1,0,2.2v13.7h5.1v-14c0-1.2,0-2,1-2.8s3-1,4.2-1
-		c0.8,0,2.4-0.2,2.4-0.2v-4C35.9,9.7,35.6,9.7,35.6,9.7z"/>
-</g>
-</svg>
+<?xml version="1.0" encoding="UTF-8"?>
+<svg id="Ebene_2" data-name="Ebene 2" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMin meet" viewBox="0 0 55 42">
+  <defs>
+    <style>
+      .cls-1 {
+        fill: #fff;
+      }
+    </style>
+  </defs>
+  <g id="Ebene_1-2" data-name="Ebene 1">
+    <g id="g850">
+      <path id="path844" class="cls-1" d="m27.9,42.1c-9.3.2-20.6-1.5-27.9-4.7v-2.8c7.7,3.2,18,4.9,27.3,4.7,10.1-.2,20.4-1.8,27.7-4.7v2.8c-8.1,3-17.2,4.5-27.1,4.7"/>
+      <path id="path846" class="cls-1" d="m4.7,0v10.5s3.4-.6,6.1-.6c4.7,0,7.1,2.6,7.3,5.9v15.9h-4.7v-13.9c0-1.8,0-4-3.8-4-2.8,0-4.7.6-4.7.6v17.2H0V.2l4.7-.2Z"/>
+      <path id="path848" class="cls-1" d="m35.6,9.7s-4.6.2-7.1.8c-3.2.6-5.1,2.6-5.3,5.3v15.9h5.1v-14c0-1.2,0-2,1-2.8s3-1,4.2-1c.8,0,2.4-.2,2.4-.2v-4s-.3,0-.3,0Z"/>
+    </g>
+  </g>
+</svg>

package/src/assets/brand/hr/icons/logo/svgmap/brandlogo--mobile.svg

@@ -1,8 +1,9 @@
 <?xml version="1.0" encoding="utf-8"?>
 <!-- Generator: Adobe Illustrator 19.2.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
 <svg version="1.1" id="hr" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 55 42.1" enable-background="new 0 0 55 42.1" xml:space="preserve">
-<g>
+	 viewBox="0 0 55 42.1" enable-background="new 0 0 55 42.1" preserveAspectRatio="xMinYMid meet" xml:space="preserve">
+	 <defs><style>.cls-1{fill:#fff;}</style></defs>
+<g class="cls-1">
 	<path d="M27.9,42.1C18.6,42.3,7.3,40.6,0,37.4v-2.8c7.7,3.2,18,4.9,27.3,4.7c10.1-0.2,20.4-1.8,27.7-4.7v2.8
 		C46.9,40.4,37.8,41.9,27.9,42.1"/>
 	<path d="M4.7,0v10.5c0,0,3.4-0.6,6.1-0.6c4.7,0,7.1,2.6,7.3,5.9c0,0.8,0,1.4,0,2.2v13.7h-4.7V17.8c0-1.8,0-4-3.8-4