hr-design-system-handlebars 0.69.3 → 0.69.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +12 -0
- package/build/handlebars/partials/handlebar-partials.js +2 -2
- package/dist/assets/index.css +3 -3
- package/package.json +1 -1
- package/src/stories/views/components/teaser/teaser_alternativ.stories.mdx +1 -1
- package/src/stories/views/components/teaser/teaser_alternativ_av.stories.mdx +1 -1
- package/src/stories/views/components/teaser/teaser_standard.stories.mdx +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,15 @@
|
|
|
1
|
+
# v0.69.4 (Tue Oct 25 2022)
|
|
2
|
+
|
|
3
|
+
#### 🐛 Bug Fix
|
|
4
|
+
|
|
5
|
+
- changed all teaser viewports to 360 and 1024 [#351](https://github.com/mumprod/hr-design-system-handlebars/pull/351) ([@vascoeduardo](https://github.com/vascoeduardo))
|
|
6
|
+
|
|
7
|
+
#### Authors: 1
|
|
8
|
+
|
|
9
|
+
- Vasco ([@vascoeduardo](https://github.com/vascoeduardo))
|
|
10
|
+
|
|
11
|
+
---
|
|
12
|
+
|
|
1
13
|
# v0.69.3 (Tue Oct 25 2022)
|
|
2
14
|
|
|
3
15
|
#### 🐛 Bug Fix
|
|
@@ -13,15 +13,15 @@ module.exports['components/content_nav/content_nav_dropdown.hbs'] = '<nav \n
|
|
|
13
13
|
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'
|
|
14
14
|
module.exports['components/content_nav/content_nav_list.hbs'] = '<ul :class="( ({{this.isMixed}} && {{_teasersize}} < 50 ) || ( {{this.isMixed}} && window.innerWidth < 768 ) || {{this.isDropdown}} ) && $store.contentNavDropdownIsOpen == true ? \'!shadow-[1px_8px_9px_0px_rgba(50,50,93,0.10)] !px-0 mt-0\' : \'\'"\n class="flex flex-wrap w-full px-2 z-10000 md:!px-0 last:border-b-0"> \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'
|
|
15
15
|
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}}'
|
|
16
|
-
module.exports['components/label/label.hbs'] = '<span\n class=\'sb-label rounded px-1.5 pt-px inline-block tracking-wide text-white text-base leading-5.5 font-heading\n {{inline-switch\n _type\n \'["media","event","breakingnews","comment","analysis","der-tag-in-hessen","glosse","fragen-und-antworten","infografik","interaktiv","program","download","pm","liveticker","ticker","livestream","live","livechat","buliticker","social-tv","blog","podcast"]\'\n \'["bg-labelMedia","bg-labelEvent","bg-labelBreakingnews","bg-labelComment","bg-labelComment","bg-labelComment","bg-labelComment","bg-labelComment","bg-labelInfografik","bg-labelInfografik","bg-labelProgram","bg-labelDownload","bg-labelPm","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelMedia"]\'\n }}\'\n>\n {{_text}}\n</span>\n{{~#with this.byline~}}\n <span class=\'ml-2 text-xs text-grey-scorpion font-headingSerif\'>\n {{~#if this.bylineSsi~}}\n {{{this.bylineSsi}}}\n {{~else~}}\n {{this.bylineText}}\n {{~/if~}}\n </span>\n{{~/with~}}'
|
|
17
16
|
module.exports['components/grid/grid.hbs'] = '\n<div class="grid grid-page">\n <div class="grid grid-cols-12 py-6 bg-white sm:px-8 col-full sm:col-main gap-x-6 gap-y-6">\n {{#>components/grid/grid_group _size="100"}}\n <h2 class="text-4xl headline--barrier col-span-full">Gruppen 100%</h2>\n {{#>components/grid/grid_item _size="12"}}\n <a href="#">\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 12/12 = 100% \n </div>\n </a>\n {{/components/grid/grid_item}} \n {{/components/grid/grid_group}} \n {{#>components/grid/grid_group _backgroundColor="1"}} \n <h2 class="text-4xl headline--barrier col-span-full">Gruppen 100% mit blauen Hintergrung bis Rand</h2>\n {{#>components/grid/grid_item _size="6"}}\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 6/12 = 50% \n </div>\n {{/components/grid/grid_item}} \n {{#>components/grid/grid_item _size="6"}}\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 6/12 = 50% \n </div>\n {{/components/grid/grid_item}} \n {{/components/grid/grid_group}} \n\n {{#>components/grid/grid_group _size="100"}}\n\n <h2 class="text-4xl headline--barrier col-span-full">Gruppen 100%</h2>\n {{#>components/grid/grid_item _size="6"}}\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 6/12 = 50% \n </div>\n {{/components/grid/grid_item}} \n {{#>components/grid/grid_item _size="6"}}\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 6/12 = 50% \n </div>\n {{/components/grid/grid_item}} \n\n {{#>components/grid/grid_item _size="4"}}\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 4/12 = 33% \n </div>\n {{/components/grid/grid_item}} \n {{#>components/grid/grid_item _size="4"}}\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 4/12 = 33% \n </div> \n {{/components/grid/grid_item}} \n {{#>components/grid/grid_item _size="4"}}\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 4/12 = 33% \n </div> \n {{/components/grid/grid_item}}\n {{/components/grid/grid_group}}\n {{#>components/grid/grid_group_tabbed }}\n <h2 class="text-4xl headline--barrier col-span-full">Gruppen 100% Tabbed</h2>\n {{#>components/grid/grid_item _size="3"}}\n <div class="flex items-center justify-center text-4xl text-white bg-gray-500 aspect-video">\n 3/12 = 25% \n </div> \n {{/components/grid/grid_item}}\n \n {{#>components/grid/grid_item _size="3"}}\n <div class="flex items-center justify-center text-4xl text-white bg-gray-500 aspect-video">\n 3/12 = 25% \n </div> \n {{/components/grid/grid_item}}\n\n {{#>components/grid/grid_item _size="3"}}\n <div class="flex items-center justify-center text-4xl text-white bg-gray-500 aspect-video">\n 3/12 = 25% \n </div> \n {{/components/grid/grid_item}}\n\n {{#>components/grid/grid_item _size="3"}}\n <div class="flex items-center justify-center text-4xl text-white bg-gray-500 aspect-video">\n 3/12 = 25% \n </div> \n {{/components/grid/grid_item}} \n \n {{/components/grid/grid_group_tabbed}} \n {{#>components/grid/grid_group}} \n <h2 class="text-4xl headline--barrier col-span-full">Gruppen 100%</h2>\n {{#>components/grid/grid_item _size="4"}}\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 4/12 = 33% \n </div>\n {{/components/grid/grid_item}} \n {{#>components/grid/grid_item _size="4"}}\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 4/12 = 33% \n </div> \n {{/components/grid/grid_item}} \n {{#>components/grid/grid_item _size="4"}}\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 4/12 = 33% \n </div> \n {{/components/grid/grid_item}} \n {{/components/grid/grid_group}} \n {{#>components/grid/grid_group _size="50"}}\n <h2 class="text-4xl headline--barrier col-span-full">Gruppen 50%</h2>\n {{#>components/grid/grid_item _size="12"}}\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 6/12 = 50% \n </div>\n {{/components/grid/grid_item}} \n {{#>components/grid/grid_item _size="12"}}\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 6/12 = 50% \n </div> \n {{/components/grid/grid_item}} \n {{/components/grid/grid_group}} \n {{#>components/grid/grid_group _size="50"}}\n <h2 class="text-4xl headline--barrier col-span-full">Gruppen 50%</h2>\n {{#>components/grid/grid_item _size="6"}}\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 6/12 = 50% \n </div>\n {{/components/grid/grid_item}} \n {{#>components/grid/grid_item _size="6"}}\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 6/12 = 50% \n </div> \n {{/components/grid/grid_item}} \n {{/components/grid/grid_group}} \n {{#>components/grid/grid_group _size="66"}}\n <h2 class="text-4xl headline--barrier col-span-full">Gruppen 66%</h2>\n {{#>components/grid/grid_item _size="12"}}\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 8/12 = 66% \n </div>\n {{/components/grid/grid_item}} \n {{#>components/grid/grid_item _size="12"}}\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 8/12 = 66% \n </div> \n {{/components/grid/grid_item}} \n {{/components/grid/grid_group}} \n {{#>components/grid/grid_group _size="33"}}\n <h2 class="text-4xl headline--barrier col-span-full">Gruppen 33%</h2>\n {{#>components/grid/grid_item _size="12"}}\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 4/12 = 33% \n </div>\n {{/components/grid/grid_item}} \n {{#>components/grid/grid_item _size="12"}}\n <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">\n 4/12 = 33% \n </div> \n {{/components/grid/grid_item}} \n {{/components/grid/grid_group}} \n </div>\n</div>\n'
|
|
18
17
|
module.exports['components/grid/grid_group.hbs'] = '{{~#if _backgroundColor}}\n {{#>components/grid/grid_group_highlight _backgroundColor=this.backgroundColor }} \n {{> @partial-block }}\n {{/components/grid/grid_group_highlight }}\n{{else}}\n {{#>components/grid/grid_group_standard _size=this.teaserSize }} \n {{> @partial-block }}\n {{/components/grid/grid_group_standard }}\n{{/if}}'
|
|
19
18
|
module.exports['components/grid/grid_group_highlight.hbs'] = '</div>\n<div class="grid col-full grid-page {{inline-switch _backgroundColor \'["1","2"]\' \'[" bg-grey-alto"," bg-orange-bridesmaid"]\'}}">\n <section class="grid grid-cols-12 py-6 sm:px-8 col-full sm:col-main gap-x-6 gap-y-9">\n <div class="grid content-start grid-cols-12 col-span-12 gap-x-6 gap-y-6">\n {{> @partial-block }}\n </div>\n </section>\n</div>\n<div class="grid grid-cols-12 py-6 bg-white sm:px-8 col-full sm:col-main gap-x-6 gap-y-6">'
|
|
20
19
|
module.exports['components/grid/grid_group_standard.hbs'] = '<section class="grid grid-cols-12 items-start bg-white content-start gap-x-6 gap-y-6 col-span-12 {{inline-switch _size \'["100","66","50","33","25"]\' \'["","md:col-span-8","md:col-span-6","md:col-span-4","md:col-span-3"]\'}}">\n {{> @partial-block }}\n</section>'
|
|
21
20
|
module.exports['components/grid/grid_group_tabbed.hbs'] = '</div>\n<section class="grid grid-cols-12 px-8 py-8 mx-4 bg-blue-400 sm:mx-0 rounded-tl-3xl rounded-br-3xl col-full sm:col-main gap-x-6 gap-y-6">\n {{> @partial-block }}\n</section>\n<div class="grid grid-cols-12 py-6 bg-white sm:px-8 col-full sm:col-main gap-x-6 gap-y-6">'
|
|
22
21
|
module.exports['components/grid/grid_item.hbs'] = '<article class="col-span-12 {{inline-switch _size \'["12","8","6","4","3"]\' \'["","md:col-span-8","md:col-span-6","md:col-span-4","md:col-span-3"]\'}}" >\n {{> @partial-block }} \n</article>'
|
|
23
|
-
module.exports['components/
|
|
22
|
+
module.exports['components/label/label.hbs'] = '<span\n class=\'sb-label rounded px-1.5 pt-px inline-block tracking-wide text-white text-base leading-5.5 font-heading\n {{inline-switch\n _type\n \'["media","event","breakingnews","comment","analysis","der-tag-in-hessen","glosse","fragen-und-antworten","infografik","interaktiv","program","download","pm","liveticker","ticker","livestream","live","livechat","buliticker","social-tv","blog","podcast"]\'\n \'["bg-labelMedia","bg-labelEvent","bg-labelBreakingnews","bg-labelComment","bg-labelComment","bg-labelComment","bg-labelComment","bg-labelComment","bg-labelInfografik","bg-labelInfografik","bg-labelProgram","bg-labelDownload","bg-labelPm","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelMedia"]\'\n }}\'\n>\n {{_text}}\n</span>\n{{~#with this.byline~}}\n <span class=\'ml-2 text-xs text-grey-scorpion font-headingSerif\'>\n {{~#if this.bylineSsi~}}\n {{{this.bylineSsi}}}\n {{~else~}}\n {{this.bylineText}}\n {{~/if~}}\n </span>\n{{~/with~}}'
|
|
24
23
|
module.exports['components/mediaplayer/media_player.hbs'] = '<div x-show="avStart" id="{{this.ardPlayerConfig.playerId}}" class="ar-16-9 h-auto js-load {{if _cypressHook _cypressHook \'js-media-element\'}} js-video-livestream" data-hr-mediaplayer-loader=\'{{json this.ardPlayerJsonConfig}}\'>\n {{#unless _hideGeotag}}\n {{~#with _geotag}}\n <span class="js-geotag c-teaser__geotag" aria-hidden="true">{{this.[0].title~}}</span>\n {{/with~}}\n {{/unless}}\n</div>\n{{#if _isTeaser}}\n <div class="relative {{_aspectRatio}}" x-show="!avStart" > \n {{#with _teaser}}\n {{~#if ../_isCopyText~}}\n {{~> components/base/image/responsive_image this.teaserImage _type=(if this.teaserType this.teaserType \'story\') _variant=(if this.content.imageVariant this.content.imageVariant \'100-copytext\') _addClassImg="ar__content" _noDelay=../_noDelay ~}} \n {{else}} \n {{#decorator \'components/base/link\' _cssClasses="c-teaser__mediaLink" _isAriaHidden=true\n _doTracking=(if this.doTracking \'true\') _clickLabelPrefix1=this.realTeasersize\n _clickLabelPrefix2="mediaLink" }} \n {{~> components/base/image/responsive_image this.teaserImage _type=(if this.teaserType this.teaserType \'story\') _variant=(if this.content.imageVariant this.content.imageVariant \'100-copytext\') _addClassImg="js-mediaplayer__area ar__content mediaPlayerLoader__mediaplayerArea" _noDelay=../_noDelay ~}} \n {{/decorator }}\n {{/if}}\n {{/with}}\n {{> components/button/button_round _isButton="true" _addClass=(if _isLivestream \'absolute bottom-0 right-0 my-5 mx-5 text-orange-spicyCarrot hover:fill-orange-spicyCarrot js-mediaplayer__button\' \'absolute bottom-0 right-0 my-5 mx-5 text-blue-jellyBean hover:fill-blue-jellyBean js-mediaplayer__button\') _showIcon=true _icon=_mediaButtonIcon _label=_mediaButtonLabel _srOnly="true" _alpineClick="avStart = !avStart; $dispatch(\'player_start\')"}} \n {{~#if this.isPodcast~}}\n <a href="{{this.podcastDownloadUrl}}" class="absolute top-0 right-0 m-5 js-load"{{#with\n this.trackingData}}\n data-hr-click-tracking=\'{"settings": [{"type": "download", "clickLabel": "{{this.pageName}}", "secondLevelId": "{{this.secondLevelId}}"}, {"type": "uxAction", "clickLabel": "medienDownload::podcast::{{_type}}", "secondLevelId": "{{this.secondLevelId}}" }]}\'{{/with}}>\n {{> components/base/image/icon _icon=\'download-button\' _addClass="w-10 h-10"}}\n </a>\n {{~/if~}}\n </div>\n{{/if}}'
|
|
24
|
+
module.exports['components/page/page.hbs'] = '<!DOCTYPE html>\n<html \n class="no-js no-js-burgerMenu preload noMicroInteraction"\n data-theme="hessenschau" \n lang="de"\n>\n <head>\n\n <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>\n <meta http-equiv="X-UA-Compatible" content="IE=Edge"/>\n <title>hessenschau.de | Nachrichten aus Hessen</title>\n <meta name="application-name" content="hessenschau.de" />\n <meta name="copyright" content="Hessischer Rundfunk, Frankfurt, Germany" />\n <meta name="author" content="hessenschau.de, Frankfurt, Germany" />\n <meta name="publisher" content="hessenschau.de" />\n <meta name="language" content="Deutsch" />\n\n </head>\n\n <body itemscope itemtype="http://schema.org/WebPage">\n <div class="js-pageSwap">\n \n {{> components/site_header/header }} \n \n <main \n onclick="void(0)" \n role="main" \n id="content"\n class="flex items-center justify-center"\n >\n <div class="grid grid-page">\n <div class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-8 sm:col-main">\n {{> components/teaser/teaser_standard }}\n </div>\n <div class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-8 sm:col-main">\n {{> components/teaser/teaser_standard teaserSize="50"}}\n {{> components/teaser/teaser_standard teaserSize="50"}}\n </div>\n <div class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-8 sm:col-main">\n {{> components/teaser/teaser_standard teaserSize="33"}}\n {{> components/teaser/teaser_standard teaserSize="33"}}\n {{> components/teaser/teaser_standard teaserSize="33"}}\n </div>\n <div class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-8 sm:col-main">\n {{> components/teaser/teaser_standard teaserSize="50"}}\n {{> components/teaser/teaser_standard teaserSize="50"}}\n </div> \n <div class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-8 sm:col-main">\n {{> components/teaser/teaser_standard teaserSize="33"}}\n {{> components/teaser/teaser_standard teaserSize="33"}}\n {{> components/teaser/teaser_standard teaserSize="33"}}\n </div>\n <div class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-8 sm:col-main">\n {{> components/teaser/teaser_standard teaserSize="50"}}\n {{> components/teaser/teaser_standard teaserSize="50"}}\n </div>\n \n </div>\n </main>\n\n </div>\n </body>\n</html>\n'
|
|
25
25
|
module.exports['components/site_header/burger.hbs'] = '<div x-data="burger()" class="flex items-center justify-center h-full fill-current sb-burger">\n <nav>\n <button {{!-- :class="$store.burgeropen ? \'text-blue-congress\' : \'text-white\'" --}} \n class="relative w-10 h-10 text-white tablet:w-18 tablet:h-12 focus:outline-none bg-brand"\n @burger-close.window="burgerClose()"\n @click="$store.burgeropen = !$store.burgeropen" \n @click.debounce="burgerClick()" \n aria-owns="sectionNav" \n aria-controls="sectionNav"\n x-effect="$el.setAttribute(\'aria-expanded\', $store.burgeropen);$el.setAttribute(\'aria-label\', $store.burgeropen ? \'Navigation schließen\' : \'Navigation öffnen\')"\n >\n <span class="sr-only md:hidden">Open main menu</span>\n <div class="absolute block w-6 transform -translate-x-1/2 -translate-y-1/2 left-1/2 top-1/2">\n <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>\n <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>\n <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>\n </div>\n </button>\n </nav>\n</div>\n\n<script>\n var burger = () => {\n return {\n burgerClose(){ \n this.$store.burgeropen = false\n this.$dispatch(\'toggle-sectionnav\', false); \n },\n burgerClick(){ \n this.$store.serviceNavIsOpen = false\n this.$dispatch(\'toggle-sectionnav\', this.$store.burgeropen); \n // Todo: not doing anything! can be removed?\n // this.percent > 50 ? this.removeYtranslate() : null;\n this.toggleScrolling(!this.$store.burgeropen) \n },\n removeYtranslate(){\n // Todo: not doing anything! can be removed?\n //this.$refs.serviceList.classList.remove(\'-mt-40\'); \n //this.$refs.sectionnavigation.classList.remove(\'-mt-40\')\n }\n }\n }\n</script>\n'
|
|
26
26
|
module.exports['components/site_header/header.hbs'] = '<div class="sb-main-navigation" x-data="mainNavigationHandler()" x-init="init()">\n <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"> \n <div x-data \n id="headerWrapper"\n @resize.window="resetNav()" \n :class="shouldBrandNavBeHidden() ? \'-mt-10 lg:-mt-8\' : \'\' "\n class="fixed top-0 left-0 flex flex-wrap max-w-full transition-all duration-500 transform font-copy lg:justify-center lg:w-full ">\n \n <div id="anchorNavWrapper" \n class="hidden">\n {{> components/site_header/anchor_navigation/anchor_navigation }}\n </div>\n\n <div id="brandNavWrapper" \n class="relative flex items-center justify-center order-1 w-full bg-white z-10000">\n {{> components/site_header/brand_navigation/brand_navigation }} \n </div>\n\n <div id="serviceNavWrapper" \n :class="shouldServiceNavBeHidden() ? \'-mt-40\' : \'\'"\n \n class="relative flex justify-center order-2 w-full transition-all duration-500 ease-in-out md:border-white lg:border-b bg-blue-congress z-10002"> \n <div id="serviceNavMainContainer" \n class="flex w-full h-10 lg:container md:h-12 lg:px-10 lg:h-16 z-10001">\n\n <span id="serviceNavHeadline" class="hidden print:hidden">Service Navigation</span>\n\n <div id="serviceLogoWrapper" \n class="flex items-center order-1 w-full pl-4 pr-2 tablet:pl-5 lg:items-end lg:pb-3 bg-blue-congress 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">\n {{> components/site_header/service_logo }}\n </div>\n \n <div id="serviceItemsWrapper" \n class="flex items-center justify-end flex-initial order-2 inline-block w-full max-w-full align-top bg-blue-congress 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">\n {{> components/site_header/service_navigation/service_list }}\n\n {{> components/site_header/navigation_search/quick_search_button }}\n\n <div class="hidden lg:flex">\n {{> components/site_header/navigation_search/quick_search_form }}\n </div>\n \n <div id="burgerWrapper" \n class="flex justify-end flex-none order-2 lg:order-4 md:order-4 lg:hidden"> \n {{> components/site_header/burger }} \n </div>\n \n </div>\n </div>\n </div>\n\n <div id="sectionNavWrapper" \n x-ref="sectionnavigation"\n @toggle-sectionnav.window="toggleSectionNav"\n :class="shouldSectionNavBeHidden() ? \'-mt-40 md:-mt-40 lg:-mt-40\' : \'\'" \n 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-22 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-blue-congress z-10000 print:hidden"\n >\n {{> components/site_header/section_navigation/section_navigation }}\n </div>\n \n <div x-cloak :class="shouldServiceNavBeHidden() ? \'hidden -mt-40\' : \'\'"\n x-effect="$el.setAttribute(\'id\', \'flyout-\' + $store.searchID.current + \'-2\');$el.setAttribute(\'aria-expanded\', $store.searchFieldOpen);$el.setAttribute(\'aria-hidden\', !$store.searchFieldOpen);$el.setAttribute(\'aria-labelledby\', \'flyout-\' + $store.searchID.current + \'-1\')" \n x-show="$store.searchFieldOpen"\n class="sb-quick-search-flyout flex tablet:w-half-screen tablet:ml-half-screen justify-end order-4 w-full max-w-full p-2 px-5 py-3.5 bg-white drop-shadow-md md:mt-0 z-10002 lg:hidden print:hidden"\n @search-close.window="$store.searchFieldOpen = false"\n @click.outside="$store.searchFieldOpen = false; $dispatch(\'search-mobile-click-outside\'); dropped = false; toggleScrolling(!$store.serviceNavIsOpensearchFieldOpen && !$store.burgeropen)"\n x-transition:enter="transition ease-out duration-200" \n x-transition:enter-start="opacity-0 transform scale-y-90" \n x-transition:enter-end="opacity-100 transform scale-y-100" \n x-transition:leave="transition ease-in duration-100" \n x-transition:leave-start="opacity-100 transform scale-y-100" \n x-transition:leave-end="opacity-0 transform scale-y-90">\n\n {{> components/site_header/navigation_search/quick_search_form }}\n\n </div>\n \n </div> \n </header>\n <div class="justify-center hidden w-full scale-50 brand-logo_print print:flex">\n <img loading="lazy" \n alt="{{loca "header_homepage_link_title"}}" \n src="{{resourceUrl "assets/base/icons/rsslogo/brandlogo--rss.jpg" _brand=(if this.brand this.brand)}}" \n />\n </div>\n <div x-ref="myOverlay">\n <div x-cloak x-data="overlayHandler()" @click.debounce="overlayWasClicked()" x-show="shouldOverlayBeShown()" class="fixed top-0 left-0 w-screen h-screen bg-gray-800 z-10000 lg:hidden opacity-70"></div>\n </div>\n</div>\n'
|
|
27
27
|
module.exports['components/site_header/service_logo.hbs'] = '<a class="relative flex items-center text-white fill-current sb-service-logo lg:items-end link-focus-white print:hidden" \n href="https://www.hessenschau.de/index.html" \n title="Startseite hessenschau . d e">\n <span x-cloak class="absolute transition-opacity duration-500 ease-in-out" :class="`${percent}` < 50 ? \'opacity-0\' : \'delay-200 opacity-100\'" >\n {{> 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 "}}\n </span>\n <span class="transition-opacity duration-500 ease-in-out" :class="`${percent}` < 50 ? \'opacity-100\' : \'opacity-0\'">\n {{> 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"}}\n </span> \n</a>\n'
|
package/dist/assets/index.css
CHANGED
|
@@ -2072,7 +2072,7 @@ video {
|
|
|
2072
2072
|
transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
|
|
2073
2073
|
}
|
|
2074
2074
|
.counter-reset {
|
|
2075
|
-
counter-reset:
|
|
2075
|
+
counter-reset: cnt1666712158885;
|
|
2076
2076
|
}
|
|
2077
2077
|
.line-clamp-4 {
|
|
2078
2078
|
overflow: hidden;
|
|
@@ -2461,7 +2461,7 @@ video {
|
|
|
2461
2461
|
--tw-ring-color: rgba(255, 255, 255, 0.5);
|
|
2462
2462
|
}
|
|
2463
2463
|
.-ordered {
|
|
2464
|
-
counter-increment:
|
|
2464
|
+
counter-increment: cnt1666712158885 1;
|
|
2465
2465
|
}
|
|
2466
2466
|
.-ordered::before {
|
|
2467
2467
|
position: absolute;
|
|
@@ -2478,7 +2478,7 @@ video {
|
|
|
2478
2478
|
letter-spacing: .0125em;
|
|
2479
2479
|
--tw-text-opacity: 1;
|
|
2480
2480
|
color: rgba(0, 0, 0, var(--tw-text-opacity));
|
|
2481
|
-
content: counter(
|
|
2481
|
+
content: counter(cnt1666712158885);
|
|
2482
2482
|
}
|
|
2483
2483
|
.\[-T\:\+Z\] {
|
|
2484
2484
|
--t: +Z;
|
package/package.json
CHANGED
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"main": "dist/index.js",
|
|
8
8
|
"repository": "https://github.com/szuelch/hr-design-system-handlebars",
|
|
9
|
-
"version": "0.69.
|
|
9
|
+
"version": "0.69.4",
|
|
10
10
|
"scripts": {
|
|
11
11
|
"test": "echo \"Error: no test specified\" && exit 1",
|
|
12
12
|
"storybook": "start-storybook -p 6006 public",
|