hr-design-system-handlebars 1.106.0 → 1.107.1
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 +24 -0
- package/dist/assets/index.css +13 -3
- package/dist/assets/js/components/event/filtererDs.feature.js +11 -11
- package/dist/assets/js/components/event/nativeScrollDs.feature.js +6 -6
- package/dist/views/components/button/utilities/button_variation_classes.hbs +4 -4
- package/dist/views/components/content_nav/content_nav.hbs +2 -2
- package/dist/views/components/content_nav/content_nav_container.hbs +1 -1
- package/dist/views/components/content_nav/content_nav_dropdown.hbs +1 -1
- package/dist/views/components/content_nav/content_nav_list.hbs +3 -3
- package/dist/views/components/event/calendar/event_calendar_footer.hbs +1 -1
- package/dist/views/components/event/calendar/event_calendar_nav.hbs +6 -6
- package/dist/views/components/event/calendar/event_calendar_nav_item.hbs +2 -2
- package/dist/views/components/event/event_details.hbs +2 -2
- package/dist/views_static/components/button/utilities/button_variation_classes.hbs +4 -4
- package/dist/views_static/components/content_nav/content_nav.hbs +2 -2
- package/dist/views_static/components/content_nav/content_nav_container.hbs +1 -1
- package/dist/views_static/components/content_nav/content_nav_dropdown.hbs +1 -1
- package/dist/views_static/components/content_nav/content_nav_list.hbs +3 -3
- package/dist/views_static/components/event/calendar/event_calendar_footer.hbs +1 -1
- package/dist/views_static/components/event/calendar/event_calendar_nav.hbs +6 -6
- package/dist/views_static/components/event/calendar/event_calendar_nav_item.hbs +2 -2
- package/dist/views_static/components/event/event_details.hbs +2 -2
- package/package.json +1 -1
- package/src/stories/views/components/button/utilities/button_variation_classes.hbs +4 -4
- package/src/stories/views/components/content_nav/content_nav.hbs +2 -2
- package/src/stories/views/components/content_nav/content_nav_container.hbs +1 -1
- package/src/stories/views/components/content_nav/content_nav_dropdown.hbs +1 -1
- package/src/stories/views/components/content_nav/content_nav_list.hbs +3 -3
- package/src/stories/views/components/event/calendar/event_calendar_footer.hbs +1 -1
- package/src/stories/views/components/event/calendar/event_calendar_nav.hbs +6 -6
- package/src/stories/views/components/event/calendar/event_calendar_nav_item.hbs +2 -2
- package/src/stories/views/components/event/event_details.hbs +2 -2
- package/src/stories/views/components/event/filtererDs.feature.js +11 -11
- package/src/stories/views/components/event/nativeScrollDs.feature.js +6 -6
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,27 @@
|
|
|
1
|
+
# v1.107.1 (Wed Oct 09 2024)
|
|
2
|
+
|
|
3
|
+
#### 🐛 Bug Fix
|
|
4
|
+
|
|
5
|
+
- remove unnecessary css (content-nav) [#1098](https://github.com/mumprod/hr-design-system-handlebars/pull/1098) ([@hanswurstsalat](https://github.com/hanswurstsalat))
|
|
6
|
+
|
|
7
|
+
#### Authors: 1
|
|
8
|
+
|
|
9
|
+
- Geraldo ([@hanswurstsalat](https://github.com/hanswurstsalat))
|
|
10
|
+
|
|
11
|
+
---
|
|
12
|
+
|
|
13
|
+
# v1.107.0 (Wed Oct 09 2024)
|
|
14
|
+
|
|
15
|
+
#### 🚀 Enhancement
|
|
16
|
+
|
|
17
|
+
- Feature/dpe 2883 [#1097](https://github.com/mumprod/hr-design-system-handlebars/pull/1097) ([@szuelch](https://github.com/szuelch))
|
|
18
|
+
|
|
19
|
+
#### Authors: 1
|
|
20
|
+
|
|
21
|
+
- [@szuelch](https://github.com/szuelch)
|
|
22
|
+
|
|
23
|
+
---
|
|
24
|
+
|
|
1
25
|
# v1.106.0 (Wed Oct 09 2024)
|
|
2
26
|
|
|
3
27
|
#### 🚀 Enhancement
|
package/dist/assets/index.css
CHANGED
|
@@ -1832,6 +1832,9 @@ article.indexTextDS .indexTextHighlighted .link {
|
|
|
1832
1832
|
.min-w-0 {
|
|
1833
1833
|
min-width: 0px;
|
|
1834
1834
|
}
|
|
1835
|
+
.min-w-1 {
|
|
1836
|
+
min-width: 0.25rem;
|
|
1837
|
+
}
|
|
1835
1838
|
.min-w-10 {
|
|
1836
1839
|
min-width: 2.5rem;
|
|
1837
1840
|
}
|
|
@@ -3336,6 +3339,9 @@ article.indexTextDS .indexTextHighlighted .link {
|
|
|
3336
3339
|
.decoration-2 {
|
|
3337
3340
|
text-decoration-thickness: 2px;
|
|
3338
3341
|
}
|
|
3342
|
+
.underline-offset-2 {
|
|
3343
|
+
text-underline-offset: 2px;
|
|
3344
|
+
}
|
|
3339
3345
|
.placeholder-search-footer-text::-webkit-input-placeholder {
|
|
3340
3346
|
color: #000000;
|
|
3341
3347
|
color: var(--color-search-footer-text);
|
|
@@ -3507,7 +3513,7 @@ article.indexTextDS .indexTextHighlighted .link {
|
|
|
3507
3513
|
border-bottom-color: var(--color-secondary-ds);
|
|
3508
3514
|
}
|
|
3509
3515
|
.counter-reset {
|
|
3510
|
-
counter-reset:
|
|
3516
|
+
counter-reset: cnt1728487371440;
|
|
3511
3517
|
}
|
|
3512
3518
|
.placeholder-text-xs::-webkit-input-placeholder {
|
|
3513
3519
|
font-size: 0.75rem;
|
|
@@ -3911,7 +3917,7 @@ article.indexTextDS .indexTextHighlighted .link {
|
|
|
3911
3917
|
--tw-ring-color: rgba(255, 255, 255, 0.5);
|
|
3912
3918
|
}
|
|
3913
3919
|
.-ordered {
|
|
3914
|
-
counter-increment:
|
|
3920
|
+
counter-increment: cnt1728487371440 1;
|
|
3915
3921
|
}
|
|
3916
3922
|
.-ordered::before {
|
|
3917
3923
|
position: absolute;
|
|
@@ -3927,7 +3933,7 @@ article.indexTextDS .indexTextHighlighted .link {
|
|
|
3927
3933
|
letter-spacing: .0125em;
|
|
3928
3934
|
--tw-text-opacity: 1;
|
|
3929
3935
|
color: rgba(0, 0, 0, var(--tw-text-opacity));
|
|
3930
|
-
content: counter(
|
|
3936
|
+
content: counter(cnt1728487371440);
|
|
3931
3937
|
}
|
|
3932
3938
|
/*! ****************************/
|
|
3933
3939
|
/*! DataPolicy stuff */
|
|
@@ -5971,6 +5977,10 @@ input[type='radio']:checked::after {
|
|
|
5971
5977
|
.active\:bg-button--dark:active {
|
|
5972
5978
|
background-color: var(--color-button--dark);
|
|
5973
5979
|
}
|
|
5980
|
+
.active\:bg-button-inverted:active {
|
|
5981
|
+
background-color: #ffffff;
|
|
5982
|
+
background-color: var(--color-button-inverted);
|
|
5983
|
+
}
|
|
5974
5984
|
.active\:bg-button-inverted--dark:active {
|
|
5975
5985
|
background-color: var(--color-button-inverted--dark);
|
|
5976
5986
|
}
|
|
@@ -23,11 +23,11 @@ const Filterer = (context) => {
|
|
|
23
23
|
errorDomNodes = hr$(`.${errorClass}`),
|
|
24
24
|
contentTargetDomNode = hr$(contentTargetClass, rootElement)[0]
|
|
25
25
|
let targetDomNodes = hr$(`.${targetClass}`, rootElement),
|
|
26
|
-
|
|
26
|
+
currentMonth = document.getElementsByClassName('js-currentMonth')[0];
|
|
27
27
|
|
|
28
|
-
const init = function () {
|
|
29
|
-
|
|
30
|
-
|
|
28
|
+
const init = function () {
|
|
29
|
+
currentMonth.classList.add('text-white');
|
|
30
|
+
currentMonth.classList.add('bg-black');
|
|
31
31
|
|
|
32
32
|
|
|
33
33
|
for (let i = 0; i < triggerDomNodes.length; i++) {
|
|
@@ -73,15 +73,15 @@ const Filterer = (context) => {
|
|
|
73
73
|
|
|
74
74
|
const doSetSelectedFilter = function (e, forceReset) {
|
|
75
75
|
clearSelected()
|
|
76
|
-
|
|
77
|
-
|
|
76
|
+
|
|
77
|
+
|
|
78
78
|
let monthWrapper = e.currentTarget.closest('.js-ns-month');
|
|
79
|
-
let monthName = monthWrapper.querySelector('.js-monthName');
|
|
80
|
-
|
|
79
|
+
let monthName = monthWrapper.querySelector('.js-monthName');
|
|
80
|
+
|
|
81
81
|
if (!forceReset) {
|
|
82
|
-
e.currentTarget.classList.add(navItemSelectedCssTrigger)
|
|
82
|
+
e.currentTarget.classList.add(navItemSelectedCssTrigger)
|
|
83
83
|
if (monthWrapper) {
|
|
84
|
-
|
|
84
|
+
|
|
85
85
|
if (monthName) {
|
|
86
86
|
monthName.classList.remove('text-gray-scorpion')
|
|
87
87
|
monthName.classList.remove('bg-white')
|
|
@@ -106,7 +106,7 @@ const Filterer = (context) => {
|
|
|
106
106
|
currentMonth.classList.add('text-gray-scorpion');
|
|
107
107
|
currentMonth.classList.add('bg-white');
|
|
108
108
|
|
|
109
|
-
|
|
109
|
+
|
|
110
110
|
triggerDomNodes.forEach(function (triggerDomNode) {
|
|
111
111
|
|
|
112
112
|
// hacky die würde bald verändert
|
|
@@ -18,7 +18,7 @@ const NativeScroll = function (context) {
|
|
|
18
18
|
}
|
|
19
19
|
const doScroll = function (e) {
|
|
20
20
|
let step = scrollbar.clientWidth - oneScrollbarItem.clientWidth * 1.5,
|
|
21
|
-
direction = e.currentTarget.classList.contains('-left') ? -1 : 1,
|
|
21
|
+
direction = e.currentTarget.classList.contains('js-left') ? -1 : 1,
|
|
22
22
|
distance = direction * step
|
|
23
23
|
console.log(
|
|
24
24
|
'🚀 ~ file: nativeScroll.feature.js ~ line 22 ~ doScroll ~ direction',
|
|
@@ -90,14 +90,14 @@ const NativeScroll = function (context) {
|
|
|
90
90
|
: (time - 1) * (2 * time - 2) * (2 * time - 2) + 1
|
|
91
91
|
}
|
|
92
92
|
|
|
93
|
-
if (hr$('.js-ns-scroll
|
|
94
|
-
scrollbar = hr$('.js-ns-scroll
|
|
93
|
+
if (hr$('.js-ns-scroll.js-horizontal', rootElement).length > 0) {
|
|
94
|
+
scrollbar = hr$('.js-ns-scroll.js-horizontal', rootElement)[0]
|
|
95
95
|
buttons = hr$('.js-ns-button', rootElement)
|
|
96
96
|
oneScrollbarItem = hr$('.js-ns-item', rootElement)[0]
|
|
97
97
|
hasNativeSmoothScroll = isNativeSmoothScrollEnabledOn(scrollbar)
|
|
98
|
-
let initiallySelectedMonth = hr$('.js-ns-month
|
|
98
|
+
let initiallySelectedMonth = hr$('.js-ns-month.js-selected', rootElement)[0]
|
|
99
99
|
if (!initiallySelectedMonth) {
|
|
100
|
-
initiallySelectedMonth = hr$('.js-ns-month
|
|
100
|
+
initiallySelectedMonth = hr$('.js-ns-month.js-currentMonth', rootElement)[0]
|
|
101
101
|
}
|
|
102
102
|
|
|
103
103
|
if (initiallySelectedMonth) {
|
|
@@ -114,7 +114,7 @@ const NativeScroll = function (context) {
|
|
|
114
114
|
}
|
|
115
115
|
} else {
|
|
116
116
|
console.log(
|
|
117
|
-
'Kein NativeScroll Element gefunden:' + rootElement + ' .js-ns-scroll
|
|
117
|
+
'Kein NativeScroll Element gefunden:' + rootElement + ' .js-ns-scroll.js-horizontal'
|
|
118
118
|
)
|
|
119
119
|
}
|
|
120
120
|
}
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
{{inline-switch
|
|
3
3
|
_variant
|
|
4
4
|
'["primary","secondary","tertiary"]'
|
|
5
|
-
'[" primary border text-button--dark bg-button-inverted border-button-inverted hover:bg-button-inverted--dark hover:border-button-inverted--dark active:bg-button-inverted--dark ","
|
|
5
|
+
'[" primary border text-button--dark bg-button-inverted border-button-inverted hover:bg-button-inverted--dark hover:border-button-inverted--dark active:bg-button-inverted--dark "," border text-button-inverted border-button-inverted hover:bg-button-inverted--dark hover:text-button--dark active:text-button active:bg-button-inverted--dark "," bg-transparent border-transparent text-button-inverted hover:bg-button-inverted--dark hover:text-button--dark hover:border-button-inverted--dark active:text-button active:bg-button-inverted--dark ","border text-button--dark bg-button-inverted border-button-inverted hover:bg-button-inverted--dark hover:border-button-inverted--dark active:bg-button-inverted--dark "]'
|
|
6
6
|
~}}
|
|
7
|
-
|
|
7
|
+
{{else if _disabled~}}
|
|
8
8
|
|
|
9
9
|
{{inline-switch
|
|
10
10
|
_variant
|
|
@@ -23,8 +23,8 @@
|
|
|
23
23
|
{{~inline-switch
|
|
24
24
|
_variant
|
|
25
25
|
'["primary","secondary","tertiary","icon-button"]'
|
|
26
|
-
'[" border text-button-inverted bg-button border-button hover:bg-button--dark hover:border-button--dark active:bg-button--dark "," border text-button border-button hover:bg-button-inverted active:bg-button-inverted
|
|
27
|
-
~}}
|
|
26
|
+
'[" border text-button-inverted bg-button border-button hover:bg-button--dark hover:border-button--dark active:bg-button--dark "," border text-button border-button hover:bg-button-inverted active:bg-button-inverted"," border bg-transparent border-transparent text-button hover:bg-button-inverted hover:border-button active:bg-button-inverted"," border bg-transparent border-transparent text-button active:bg-button-inverted"," border text-button-inverted bg-button border-button hover:bg-button--dark hover:border-button--dark active:bg-button--dark "]'
|
|
27
|
+
~}}
|
|
28
28
|
{{/if}}
|
|
29
29
|
{{/if}}
|
|
30
30
|
{{~#unless _disableButtonPress}} active:scale-95{{/unless}}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{{#with this.contentNav}}
|
|
2
2
|
{{#if this.isListOrFlow}}
|
|
3
|
-
<nav class="w-full {{#if ../_isCopytext~}}px-0{{else}}px-5 sm:px-0{{/if}}
|
|
3
|
+
<nav class="w-full {{#if ../_isCopytext~}}px-0{{else}}px-5 sm:px-0{{/if}} {{inline-switch ../_teaserSize '["100","66","50","33","25"]' '[" teaser-size-100"," teaser-size-66"," teaser-size-50"," teaser-size-33"," teaser-size-25", ""]'}}">
|
|
4
4
|
{{> components/content_nav/content_nav_container
|
|
5
5
|
_teaserSize=../_teaserSize
|
|
6
6
|
_maindivclass="flex relative flex-wrap"
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
{{> components/content_nav/content_nav_container
|
|
19
19
|
_teaserSize=_teaserSize
|
|
20
20
|
_maindivclass="flex flex-col w-full mt-0"
|
|
21
|
-
_inputclass=(if this.isMixed 'mixed-input' '
|
|
21
|
+
_inputclass=(if this.isMixed 'mixed-input' '')
|
|
22
22
|
}}
|
|
23
23
|
|
|
24
24
|
{{/decorator}}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
{{/if}}
|
|
5
5
|
>
|
|
6
6
|
{{#if this.isAutosuggest}}
|
|
7
|
-
<div class="flex mx-0 w-full h-10 border-primary
|
|
7
|
+
<div class="flex mx-0 w-full h-10 border-primary {{#if _autoSuggestContainerCss}} {{_autoSuggestContainerCss}}{{/if}}">
|
|
8
8
|
<input x-ref="autosuggestInput"
|
|
9
9
|
class="{{#if _inputclass }}{{_inputclass}}{{/if}} w-full h-10 pl-2 border-b-8 border-white bg-gray-alabaster text-gray-dark placeholder:text-gray-dark focus:outline-none js-autosuggest-input"
|
|
10
10
|
type="text"
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
|
|
8
8
|
<span id="dropdown__label--{{getRandom}}" class="hidden">{{defaultIfEmpty _hiddenNavigationLabel "Unternavigation"}}</span>
|
|
9
9
|
<button
|
|
10
|
-
class="content-nav-dropdown_dropdown{{#if this.isDropdown}} -isDropdown{{/if}}{{#if this.isMixed}} -isMixed{{/if}} ds-link-inset relative flex w-full h-10 mb-0 overflow-hidden bg-white border md:mx-0
|
|
10
|
+
class="content-nav-dropdown_dropdown{{#if this.isDropdown}} -isDropdown{{/if}}{{#if this.isMixed}} -isMixed{{/if}} ds-link-inset relative flex w-full h-10 mb-0 overflow-hidden bg-white border md:mx-0 border-content-nav whitespace-nowrap text-content-nav fill-content-nav"
|
|
11
11
|
@click="contentNavDropdownIsOpen = !contentNavDropdownIsOpen; $dispatch('hr:global:resetinputAutoSuggest');"
|
|
12
12
|
|
|
13
13
|
{{#if this.isMixed}}
|
|
@@ -6,9 +6,9 @@
|
|
|
6
6
|
{{~#if this.isGroup~}}
|
|
7
7
|
|
|
8
8
|
{{#if ../isDropdown}}
|
|
9
|
-
<li class="w-full h-auto overflow-hidden text-base list-none border-b border-gray-400 bg-highlight-1 text-content-nav md:mx-0 font-copy fill-content-nav
|
|
10
|
-
<div class="flex items-center h-10 p-2
|
|
11
|
-
<ul class="
|
|
9
|
+
<li class="w-full h-auto overflow-hidden text-base list-none border-b border-gray-400 bg-highlight-1 text-content-nav md:mx-0 font-copy fill-content-nav">
|
|
10
|
+
<div class="flex items-center h-10 p-2">{{this.title}}</div>
|
|
11
|
+
<ul class="!px-0 mt-0">
|
|
12
12
|
{{~#each this.navigationGroup~}}
|
|
13
13
|
{{> components/content_nav/content_nav_item
|
|
14
14
|
_teaserSize=../../_teaserSize
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<footer class='bg-event-calendar-primary text-center'>
|
|
2
2
|
{{#> components/base/link _link=this.link
|
|
3
|
-
_css='block p-2 text-white text-sm font-serif hover:underline underline-offset-
|
|
3
|
+
_css='block p-2 text-white text-sm font-serif hover:underline underline-offset-2'
|
|
4
4
|
}}
|
|
5
5
|
{{loca 'event_calendar_monthly_overview_link'}}
|
|
6
6
|
{{/components/base/link}}
|
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
<nav class="relative border-b border-event-calendar-secondary js-load" data-hr-native-scroll-ds='{"isTeaser":"true"}'>
|
|
2
|
-
<button class="block border-0 ml-4 absolute left-0 min-w-
|
|
2
|
+
<button class="block border-0 ml-4 absolute left-0 min-w-1 min-h-3 top-1/2 js-ns-button js-left" aria-hidden="true">
|
|
3
3
|
{{> components/base/image/icon _icon="arrow-left" _iconmap="icons" _addClass="w-5 h-5 fill-current" }}
|
|
4
4
|
</button>
|
|
5
|
-
<button class="block border-0 mr-4 absolute right-0 min-w-3 min-h-3 top-1/2 js-ns-button -right" aria-hidden="true">
|
|
5
|
+
<button class="block border-0 mr-4 absolute right-0 min-w-3 min-h-3 top-1/2 js-ns-button js-right" aria-hidden="true">
|
|
6
6
|
{{> components/base/image/icon _icon="arrow-right" _iconmap="icons" _addClass="w-5 h-5 fill-current" }}
|
|
7
7
|
</button>
|
|
8
|
-
<div class="flex relative
|
|
9
|
-
<div class="flex mb-0 overflow-x-auto overflow-y-hidden whitespace-nowrap scroll-smooth js-ns-scroll -horizontal">
|
|
8
|
+
<div class="flex relative ml-14 mr-14 overflow-hidden box-border border-teal-600">
|
|
9
|
+
<div class="flex mb-0 overflow-x-auto overflow-y-hidden whitespace-nowrap scroll-smooth js-ns-scroll js-horizontal">
|
|
10
10
|
{{#each this}}
|
|
11
11
|
<div class="inline-block items-center justify-center border-event-calendar-secondary border-l js-ns-month {{#if
|
|
12
|
-
this.hasFutureEventsFromNow}} -selected{{else}} js-fr-reload-trigger{{/if}}">
|
|
12
|
+
this.hasFutureEventsFromNow}} js-selected{{else}} js-fr-reload-trigger{{/if}}">
|
|
13
13
|
<span class="js-monthName block font-heading font-bold w-16 sticky left-0 px-2 py-3 {{#if
|
|
14
|
-
this.isCurrentMonth}} -currentMonth{{else}}text-gray-scorpion{{/if}}">{{this.date.monthNameShort}} {{this.date.yearShort}}</span>
|
|
14
|
+
this.isCurrentMonth}} js-currentMonth{{else}}text-gray-scorpion{{/if}}">{{this.date.monthNameShort}} {{this.date.yearShort}}</span>
|
|
15
15
|
<ul class="flex">
|
|
16
16
|
{{#each this.days}}
|
|
17
17
|
<li class="inline-block h-full group cursor-pointer js-ns-item{{#if
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
<a class="js-fr-trigger js-noStateManager block h-full pt-2 pb-2.5 focus:bg-black focus:text-white focus-visible:outline-none hover:bg-black hover:text-white
|
|
1
|
+
<a class="js-fr-trigger js-noStateManager block h-full pt-2 pb-2.5 focus:bg-black focus:text-white focus-visible:outline-none hover:bg-black hover:text-white{{#if this.isFirstAvailable}} js-selected js-fr-initial{{/if}}"
|
|
2
2
|
data-prop-crit='{{this.date.htmlDate}}'
|
|
3
3
|
data-prop-filterer='{"crit":"{{this.date.htmlDate}}","strat":["hobid"]}'
|
|
4
4
|
href="{{_contentUrl}}">
|
|
5
5
|
<span class="block font-serif italic text-center font-bold uppercase pb-2 px-3 text-sm">{{this.date.weekdayNameShort}}</span>
|
|
6
|
-
<span class="block font-serif text-link font-bold
|
|
6
|
+
<span class="block font-serif text-link font-bold italic text-2xl px-3 pb-0 group-hover:text-white group-focus:text-white group-focus-within:text-white">{{this.date.day}}</span>
|
|
7
7
|
</a>
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<div class="flex flex-wrap content-center w-full h-full px-2 py-1">
|
|
2
2
|
{{#with this.startTime}}
|
|
3
|
-
<div class="flex grow shrink
|
|
3
|
+
<div class="flex grow shrink basis-6/12 align-top p-2">
|
|
4
4
|
<div class="min-w-3 min-h-3">
|
|
5
5
|
{{> components/base/image/icon _icon="clock" _iconmap="icons" _addClass="w-5 h-5 fill-event-calendar-secondary" }}
|
|
6
6
|
</div>
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
</div>
|
|
9
9
|
{{/with}}
|
|
10
10
|
{{#with this.venue}}
|
|
11
|
-
<div class="flex grow
|
|
11
|
+
<div class="flex grow shrink basis-6/12 align-top p-2">
|
|
12
12
|
<div class="min-w-3 min-h-3">
|
|
13
13
|
{{> components/base/image/icon _icon="ortsmarke" _iconmap="icons" _addClass="w-5 h-5 fill-event-calendar-secondary" }}
|
|
14
14
|
</div>
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
{{inline-switch
|
|
3
3
|
_variant
|
|
4
4
|
'["primary","secondary","tertiary"]'
|
|
5
|
-
'[" primary border text-button--dark bg-button-inverted border-button-inverted hover:bg-button-inverted--dark hover:border-button-inverted--dark active:bg-button-inverted--dark ","
|
|
5
|
+
'[" primary border text-button--dark bg-button-inverted border-button-inverted hover:bg-button-inverted--dark hover:border-button-inverted--dark active:bg-button-inverted--dark "," border text-button-inverted border-button-inverted hover:bg-button-inverted--dark hover:text-button--dark active:text-button active:bg-button-inverted--dark "," bg-transparent border-transparent text-button-inverted hover:bg-button-inverted--dark hover:text-button--dark hover:border-button-inverted--dark active:text-button active:bg-button-inverted--dark ","border text-button--dark bg-button-inverted border-button-inverted hover:bg-button-inverted--dark hover:border-button-inverted--dark active:bg-button-inverted--dark "]'
|
|
6
6
|
~}}
|
|
7
|
-
|
|
7
|
+
{{else if _disabled~}}
|
|
8
8
|
|
|
9
9
|
{{inline-switch
|
|
10
10
|
_variant
|
|
@@ -23,8 +23,8 @@
|
|
|
23
23
|
{{~inline-switch
|
|
24
24
|
_variant
|
|
25
25
|
'["primary","secondary","tertiary","icon-button"]'
|
|
26
|
-
'[" border text-button-inverted bg-button border-button hover:bg-button--dark hover:border-button--dark active:bg-button--dark "," border text-button border-button hover:bg-button-inverted active:bg-button-inverted
|
|
27
|
-
~}}
|
|
26
|
+
'[" border text-button-inverted bg-button border-button hover:bg-button--dark hover:border-button--dark active:bg-button--dark "," border text-button border-button hover:bg-button-inverted active:bg-button-inverted"," border bg-transparent border-transparent text-button hover:bg-button-inverted hover:border-button active:bg-button-inverted"," border bg-transparent border-transparent text-button active:bg-button-inverted"," border text-button-inverted bg-button border-button hover:bg-button--dark hover:border-button--dark active:bg-button--dark "]'
|
|
27
|
+
~}}
|
|
28
28
|
{{/if}}
|
|
29
29
|
{{/if}}
|
|
30
30
|
{{~#unless _disableButtonPress}} active:scale-95{{/unless}}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{{#with this.contentNav}}
|
|
2
2
|
{{#if this.isListOrFlow}}
|
|
3
|
-
<nav class="w-full {{#if ../_isCopytext~}}px-0{{else}}px-5 sm:px-0{{/if}}
|
|
3
|
+
<nav class="w-full {{#if ../_isCopytext~}}px-0{{else}}px-5 sm:px-0{{/if}} {{inline-switch ../_teaserSize '["100","66","50","33","25"]' '[" teaser-size-100"," teaser-size-66"," teaser-size-50"," teaser-size-33"," teaser-size-25", ""]'}}">
|
|
4
4
|
{{> components/content_nav/content_nav_container
|
|
5
5
|
_teaserSize=../_teaserSize
|
|
6
6
|
_maindivclass="flex relative flex-wrap"
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
{{> components/content_nav/content_nav_container
|
|
19
19
|
_teaserSize=_teaserSize
|
|
20
20
|
_maindivclass="flex flex-col w-full mt-0"
|
|
21
|
-
_inputclass=(if this.isMixed 'mixed-input' '
|
|
21
|
+
_inputclass=(if this.isMixed 'mixed-input' '')
|
|
22
22
|
}}
|
|
23
23
|
|
|
24
24
|
{{/decorator}}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
{{/if}}
|
|
5
5
|
>
|
|
6
6
|
{{#if this.isAutosuggest}}
|
|
7
|
-
<div class="flex mx-0 w-full h-10 border-primary
|
|
7
|
+
<div class="flex mx-0 w-full h-10 border-primary {{#if _autoSuggestContainerCss}} {{_autoSuggestContainerCss}}{{/if}}">
|
|
8
8
|
<input x-ref="autosuggestInput"
|
|
9
9
|
class="{{#if _inputclass }}{{_inputclass}}{{/if}} w-full h-10 pl-2 border-b-8 border-white bg-gray-alabaster text-gray-dark placeholder:text-gray-dark focus:outline-none js-autosuggest-input"
|
|
10
10
|
type="text"
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
|
|
8
8
|
<span id="dropdown__label--{{getRandom}}" class="hidden">{{defaultIfEmpty _hiddenNavigationLabel "Unternavigation"}}</span>
|
|
9
9
|
<button
|
|
10
|
-
class="content-nav-dropdown_dropdown{{#if this.isDropdown}} -isDropdown{{/if}}{{#if this.isMixed}} -isMixed{{/if}} ds-link-inset relative flex w-full h-10 mb-0 overflow-hidden bg-white border md:mx-0
|
|
10
|
+
class="content-nav-dropdown_dropdown{{#if this.isDropdown}} -isDropdown{{/if}}{{#if this.isMixed}} -isMixed{{/if}} ds-link-inset relative flex w-full h-10 mb-0 overflow-hidden bg-white border md:mx-0 border-content-nav whitespace-nowrap text-content-nav fill-content-nav"
|
|
11
11
|
@click="contentNavDropdownIsOpen = !contentNavDropdownIsOpen; $dispatch('hr:global:resetinputAutoSuggest');"
|
|
12
12
|
|
|
13
13
|
{{#if this.isMixed}}
|
|
@@ -6,9 +6,9 @@
|
|
|
6
6
|
{{~#if this.isGroup~}}
|
|
7
7
|
|
|
8
8
|
{{#if ../isDropdown}}
|
|
9
|
-
<li class="w-full h-auto overflow-hidden text-base list-none border-b border-gray-400 bg-highlight-1 text-content-nav md:mx-0 font-copy fill-content-nav
|
|
10
|
-
<div class="flex items-center h-10 p-2
|
|
11
|
-
<ul class="
|
|
9
|
+
<li class="w-full h-auto overflow-hidden text-base list-none border-b border-gray-400 bg-highlight-1 text-content-nav md:mx-0 font-copy fill-content-nav">
|
|
10
|
+
<div class="flex items-center h-10 p-2">{{this.title}}</div>
|
|
11
|
+
<ul class="!px-0 mt-0">
|
|
12
12
|
{{~#each this.navigationGroup~}}
|
|
13
13
|
{{> components/content_nav/content_nav_item
|
|
14
14
|
_teaserSize=../../_teaserSize
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<footer class='bg-event-calendar-primary text-center'>
|
|
2
2
|
{{#> components/base/link _link=this.link
|
|
3
|
-
_css='block p-2 text-white text-sm font-serif hover:underline underline-offset-
|
|
3
|
+
_css='block p-2 text-white text-sm font-serif hover:underline underline-offset-2'
|
|
4
4
|
}}
|
|
5
5
|
{{loca 'event_calendar_monthly_overview_link'}}
|
|
6
6
|
{{/components/base/link}}
|
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
<nav class="relative border-b border-event-calendar-secondary js-load" data-hr-native-scroll-ds='{"isTeaser":"true"}'>
|
|
2
|
-
<button class="block border-0 ml-4 absolute left-0 min-w-
|
|
2
|
+
<button class="block border-0 ml-4 absolute left-0 min-w-1 min-h-3 top-1/2 js-ns-button js-left" aria-hidden="true">
|
|
3
3
|
{{> components/base/image/icon _icon="arrow-left" _iconmap="icons" _addClass="w-5 h-5 fill-current" }}
|
|
4
4
|
</button>
|
|
5
|
-
<button class="block border-0 mr-4 absolute right-0 min-w-3 min-h-3 top-1/2 js-ns-button -right" aria-hidden="true">
|
|
5
|
+
<button class="block border-0 mr-4 absolute right-0 min-w-3 min-h-3 top-1/2 js-ns-button js-right" aria-hidden="true">
|
|
6
6
|
{{> components/base/image/icon _icon="arrow-right" _iconmap="icons" _addClass="w-5 h-5 fill-current" }}
|
|
7
7
|
</button>
|
|
8
|
-
<div class="flex relative
|
|
9
|
-
<div class="flex mb-0 overflow-x-auto overflow-y-hidden whitespace-nowrap scroll-smooth js-ns-scroll -horizontal">
|
|
8
|
+
<div class="flex relative ml-14 mr-14 overflow-hidden box-border border-teal-600">
|
|
9
|
+
<div class="flex mb-0 overflow-x-auto overflow-y-hidden whitespace-nowrap scroll-smooth js-ns-scroll js-horizontal">
|
|
10
10
|
{{#each this}}
|
|
11
11
|
<div class="inline-block items-center justify-center border-event-calendar-secondary border-l js-ns-month {{#if
|
|
12
|
-
this.hasFutureEventsFromNow}} -selected{{else}} js-fr-reload-trigger{{/if}}">
|
|
12
|
+
this.hasFutureEventsFromNow}} js-selected{{else}} js-fr-reload-trigger{{/if}}">
|
|
13
13
|
<span class="js-monthName block font-heading font-bold w-16 sticky left-0 px-2 py-3 {{#if
|
|
14
|
-
this.isCurrentMonth}} -currentMonth{{else}}text-gray-scorpion{{/if}}">{{this.date.monthNameShort}} {{this.date.yearShort}}</span>
|
|
14
|
+
this.isCurrentMonth}} js-currentMonth{{else}}text-gray-scorpion{{/if}}">{{this.date.monthNameShort}} {{this.date.yearShort}}</span>
|
|
15
15
|
<ul class="flex">
|
|
16
16
|
{{#each this.days}}
|
|
17
17
|
<li class="inline-block h-full group cursor-pointer js-ns-item{{#if
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
<a class="js-fr-trigger js-noStateManager block h-full pt-2 pb-2.5 focus:bg-black focus:text-white focus-visible:outline-none hover:bg-black hover:text-white
|
|
1
|
+
<a class="js-fr-trigger js-noStateManager block h-full pt-2 pb-2.5 focus:bg-black focus:text-white focus-visible:outline-none hover:bg-black hover:text-white{{#if this.isFirstAvailable}} js-selected js-fr-initial{{/if}}"
|
|
2
2
|
data-prop-crit='{{this.date.htmlDate}}'
|
|
3
3
|
data-prop-filterer='{"crit":"{{this.date.htmlDate}}","strat":["hobid"]}'
|
|
4
4
|
href="{{_contentUrl}}">
|
|
5
5
|
<span class="block font-serif italic text-center font-bold uppercase pb-2 px-3 text-sm">{{this.date.weekdayNameShort}}</span>
|
|
6
|
-
<span class="block font-serif text-link font-bold
|
|
6
|
+
<span class="block font-serif text-link font-bold italic text-2xl px-3 pb-0 group-hover:text-white group-focus:text-white group-focus-within:text-white">{{this.date.day}}</span>
|
|
7
7
|
</a>
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<div class="flex flex-wrap content-center w-full h-full px-2 py-1">
|
|
2
2
|
{{#with this.startTime}}
|
|
3
|
-
<div class="flex grow shrink
|
|
3
|
+
<div class="flex grow shrink basis-6/12 align-top p-2">
|
|
4
4
|
<div class="min-w-3 min-h-3">
|
|
5
5
|
{{> components/base/image/icon _icon="clock" _iconmap="icons" _addClass="w-5 h-5 fill-event-calendar-secondary" }}
|
|
6
6
|
</div>
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
</div>
|
|
9
9
|
{{/with}}
|
|
10
10
|
{{#with this.venue}}
|
|
11
|
-
<div class="flex grow
|
|
11
|
+
<div class="flex grow shrink basis-6/12 align-top p-2">
|
|
12
12
|
<div class="min-w-3 min-h-3">
|
|
13
13
|
{{> components/base/image/icon _icon="ortsmarke" _iconmap="icons" _addClass="w-5 h-5 fill-event-calendar-secondary" }}
|
|
14
14
|
</div>
|
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": "1.
|
|
9
|
+
"version": "1.107.1",
|
|
10
10
|
"scripts": {
|
|
11
11
|
"test": "echo \"Error: no test specified\" && exit 1",
|
|
12
12
|
"storybook": "storybook dev -p 6006 public",
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
{{inline-switch
|
|
3
3
|
_variant
|
|
4
4
|
'["primary","secondary","tertiary"]'
|
|
5
|
-
'[" primary border text-button--dark bg-button-inverted border-button-inverted hover:bg-button-inverted--dark hover:border-button-inverted--dark active:bg-button-inverted--dark ","
|
|
5
|
+
'[" primary border text-button--dark bg-button-inverted border-button-inverted hover:bg-button-inverted--dark hover:border-button-inverted--dark active:bg-button-inverted--dark "," border text-button-inverted border-button-inverted hover:bg-button-inverted--dark hover:text-button--dark active:text-button active:bg-button-inverted--dark "," bg-transparent border-transparent text-button-inverted hover:bg-button-inverted--dark hover:text-button--dark hover:border-button-inverted--dark active:text-button active:bg-button-inverted--dark ","border text-button--dark bg-button-inverted border-button-inverted hover:bg-button-inverted--dark hover:border-button-inverted--dark active:bg-button-inverted--dark "]'
|
|
6
6
|
~}}
|
|
7
|
-
|
|
7
|
+
{{else if _disabled~}}
|
|
8
8
|
|
|
9
9
|
{{inline-switch
|
|
10
10
|
_variant
|
|
@@ -23,8 +23,8 @@
|
|
|
23
23
|
{{~inline-switch
|
|
24
24
|
_variant
|
|
25
25
|
'["primary","secondary","tertiary","icon-button"]'
|
|
26
|
-
'[" border text-button-inverted bg-button border-button hover:bg-button--dark hover:border-button--dark active:bg-button--dark "," border text-button border-button hover:bg-button-inverted active:bg-button-inverted
|
|
27
|
-
~}}
|
|
26
|
+
'[" border text-button-inverted bg-button border-button hover:bg-button--dark hover:border-button--dark active:bg-button--dark "," border text-button border-button hover:bg-button-inverted active:bg-button-inverted"," border bg-transparent border-transparent text-button hover:bg-button-inverted hover:border-button active:bg-button-inverted"," border bg-transparent border-transparent text-button active:bg-button-inverted"," border text-button-inverted bg-button border-button hover:bg-button--dark hover:border-button--dark active:bg-button--dark "]'
|
|
27
|
+
~}}
|
|
28
28
|
{{/if}}
|
|
29
29
|
{{/if}}
|
|
30
30
|
{{~#unless _disableButtonPress}} active:scale-95{{/unless}}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{{#with this.contentNav}}
|
|
2
2
|
{{#if this.isListOrFlow}}
|
|
3
|
-
<nav class="w-full {{#if ../_isCopytext~}}px-0{{else}}px-5 sm:px-0{{/if}}
|
|
3
|
+
<nav class="w-full {{#if ../_isCopytext~}}px-0{{else}}px-5 sm:px-0{{/if}} {{inline-switch ../_teaserSize '["100","66","50","33","25"]' '[" teaser-size-100"," teaser-size-66"," teaser-size-50"," teaser-size-33"," teaser-size-25", ""]'}}">
|
|
4
4
|
{{> components/content_nav/content_nav_container
|
|
5
5
|
_teaserSize=../_teaserSize
|
|
6
6
|
_maindivclass="flex relative flex-wrap"
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
{{> components/content_nav/content_nav_container
|
|
19
19
|
_teaserSize=_teaserSize
|
|
20
20
|
_maindivclass="flex flex-col w-full mt-0"
|
|
21
|
-
_inputclass=(if this.isMixed 'mixed-input' '
|
|
21
|
+
_inputclass=(if this.isMixed 'mixed-input' '')
|
|
22
22
|
}}
|
|
23
23
|
|
|
24
24
|
{{/decorator}}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
{{/if}}
|
|
5
5
|
>
|
|
6
6
|
{{#if this.isAutosuggest}}
|
|
7
|
-
<div class="flex mx-0 w-full h-10 border-primary
|
|
7
|
+
<div class="flex mx-0 w-full h-10 border-primary {{#if _autoSuggestContainerCss}} {{_autoSuggestContainerCss}}{{/if}}">
|
|
8
8
|
<input x-ref="autosuggestInput"
|
|
9
9
|
class="{{#if _inputclass }}{{_inputclass}}{{/if}} w-full h-10 pl-2 border-b-8 border-white bg-gray-alabaster text-gray-dark placeholder:text-gray-dark focus:outline-none js-autosuggest-input"
|
|
10
10
|
type="text"
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
|
|
8
8
|
<span id="dropdown__label--{{getRandom}}" class="hidden">{{defaultIfEmpty _hiddenNavigationLabel "Unternavigation"}}</span>
|
|
9
9
|
<button
|
|
10
|
-
class="content-nav-dropdown_dropdown{{#if this.isDropdown}} -isDropdown{{/if}}{{#if this.isMixed}} -isMixed{{/if}} ds-link-inset relative flex w-full h-10 mb-0 overflow-hidden bg-white border md:mx-0
|
|
10
|
+
class="content-nav-dropdown_dropdown{{#if this.isDropdown}} -isDropdown{{/if}}{{#if this.isMixed}} -isMixed{{/if}} ds-link-inset relative flex w-full h-10 mb-0 overflow-hidden bg-white border md:mx-0 border-content-nav whitespace-nowrap text-content-nav fill-content-nav"
|
|
11
11
|
@click="contentNavDropdownIsOpen = !contentNavDropdownIsOpen; $dispatch('hr:global:resetinputAutoSuggest');"
|
|
12
12
|
|
|
13
13
|
{{#if this.isMixed}}
|
|
@@ -6,9 +6,9 @@
|
|
|
6
6
|
{{~#if this.isGroup~}}
|
|
7
7
|
|
|
8
8
|
{{#if ../isDropdown}}
|
|
9
|
-
<li class="w-full h-auto overflow-hidden text-base list-none border-b border-gray-400 bg-highlight-1 text-content-nav md:mx-0 font-copy fill-content-nav
|
|
10
|
-
<div class="flex items-center h-10 p-2
|
|
11
|
-
<ul class="
|
|
9
|
+
<li class="w-full h-auto overflow-hidden text-base list-none border-b border-gray-400 bg-highlight-1 text-content-nav md:mx-0 font-copy fill-content-nav">
|
|
10
|
+
<div class="flex items-center h-10 p-2">{{this.title}}</div>
|
|
11
|
+
<ul class="!px-0 mt-0">
|
|
12
12
|
{{~#each this.navigationGroup~}}
|
|
13
13
|
{{> components/content_nav/content_nav_item
|
|
14
14
|
_teaserSize=../../_teaserSize
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<footer class='bg-event-calendar-primary text-center'>
|
|
2
2
|
{{#> components/base/link _link=this.link
|
|
3
|
-
_css='block p-2 text-white text-sm font-serif hover:underline underline-offset-
|
|
3
|
+
_css='block p-2 text-white text-sm font-serif hover:underline underline-offset-2'
|
|
4
4
|
}}
|
|
5
5
|
{{loca 'event_calendar_monthly_overview_link'}}
|
|
6
6
|
{{/components/base/link}}
|
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
<nav class="relative border-b border-event-calendar-secondary js-load" data-hr-native-scroll-ds='{"isTeaser":"true"}'>
|
|
2
|
-
<button class="block border-0 ml-4 absolute left-0 min-w-
|
|
2
|
+
<button class="block border-0 ml-4 absolute left-0 min-w-1 min-h-3 top-1/2 js-ns-button js-left" aria-hidden="true">
|
|
3
3
|
{{> components/base/image/icon _icon="arrow-left" _iconmap="icons" _addClass="w-5 h-5 fill-current" }}
|
|
4
4
|
</button>
|
|
5
|
-
<button class="block border-0 mr-4 absolute right-0 min-w-3 min-h-3 top-1/2 js-ns-button -right" aria-hidden="true">
|
|
5
|
+
<button class="block border-0 mr-4 absolute right-0 min-w-3 min-h-3 top-1/2 js-ns-button js-right" aria-hidden="true">
|
|
6
6
|
{{> components/base/image/icon _icon="arrow-right" _iconmap="icons" _addClass="w-5 h-5 fill-current" }}
|
|
7
7
|
</button>
|
|
8
|
-
<div class="flex relative
|
|
9
|
-
<div class="flex mb-0 overflow-x-auto overflow-y-hidden whitespace-nowrap scroll-smooth js-ns-scroll -horizontal">
|
|
8
|
+
<div class="flex relative ml-14 mr-14 overflow-hidden box-border border-teal-600">
|
|
9
|
+
<div class="flex mb-0 overflow-x-auto overflow-y-hidden whitespace-nowrap scroll-smooth js-ns-scroll js-horizontal">
|
|
10
10
|
{{#each this}}
|
|
11
11
|
<div class="inline-block items-center justify-center border-event-calendar-secondary border-l js-ns-month {{#if
|
|
12
|
-
this.hasFutureEventsFromNow}} -selected{{else}} js-fr-reload-trigger{{/if}}">
|
|
12
|
+
this.hasFutureEventsFromNow}} js-selected{{else}} js-fr-reload-trigger{{/if}}">
|
|
13
13
|
<span class="js-monthName block font-heading font-bold w-16 sticky left-0 px-2 py-3 {{#if
|
|
14
|
-
this.isCurrentMonth}} -currentMonth{{else}}text-gray-scorpion{{/if}}">{{this.date.monthNameShort}} {{this.date.yearShort}}</span>
|
|
14
|
+
this.isCurrentMonth}} js-currentMonth{{else}}text-gray-scorpion{{/if}}">{{this.date.monthNameShort}} {{this.date.yearShort}}</span>
|
|
15
15
|
<ul class="flex">
|
|
16
16
|
{{#each this.days}}
|
|
17
17
|
<li class="inline-block h-full group cursor-pointer js-ns-item{{#if
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
<a class="js-fr-trigger js-noStateManager block h-full pt-2 pb-2.5 focus:bg-black focus:text-white focus-visible:outline-none hover:bg-black hover:text-white
|
|
1
|
+
<a class="js-fr-trigger js-noStateManager block h-full pt-2 pb-2.5 focus:bg-black focus:text-white focus-visible:outline-none hover:bg-black hover:text-white{{#if this.isFirstAvailable}} js-selected js-fr-initial{{/if}}"
|
|
2
2
|
data-prop-crit='{{this.date.htmlDate}}'
|
|
3
3
|
data-prop-filterer='{"crit":"{{this.date.htmlDate}}","strat":["hobid"]}'
|
|
4
4
|
href="{{_contentUrl}}">
|
|
5
5
|
<span class="block font-serif italic text-center font-bold uppercase pb-2 px-3 text-sm">{{this.date.weekdayNameShort}}</span>
|
|
6
|
-
<span class="block font-serif text-link font-bold
|
|
6
|
+
<span class="block font-serif text-link font-bold italic text-2xl px-3 pb-0 group-hover:text-white group-focus:text-white group-focus-within:text-white">{{this.date.day}}</span>
|
|
7
7
|
</a>
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<div class="flex flex-wrap content-center w-full h-full px-2 py-1">
|
|
2
2
|
{{#with this.startTime}}
|
|
3
|
-
<div class="flex grow shrink
|
|
3
|
+
<div class="flex grow shrink basis-6/12 align-top p-2">
|
|
4
4
|
<div class="min-w-3 min-h-3">
|
|
5
5
|
{{> components/base/image/icon _icon="clock" _iconmap="icons" _addClass="w-5 h-5 fill-event-calendar-secondary" }}
|
|
6
6
|
</div>
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
</div>
|
|
9
9
|
{{/with}}
|
|
10
10
|
{{#with this.venue}}
|
|
11
|
-
<div class="flex grow
|
|
11
|
+
<div class="flex grow shrink basis-6/12 align-top p-2">
|
|
12
12
|
<div class="min-w-3 min-h-3">
|
|
13
13
|
{{> components/base/image/icon _icon="ortsmarke" _iconmap="icons" _addClass="w-5 h-5 fill-event-calendar-secondary" }}
|
|
14
14
|
</div>
|
|
@@ -23,11 +23,11 @@ const Filterer = (context) => {
|
|
|
23
23
|
errorDomNodes = hr$(`.${errorClass}`),
|
|
24
24
|
contentTargetDomNode = hr$(contentTargetClass, rootElement)[0]
|
|
25
25
|
let targetDomNodes = hr$(`.${targetClass}`, rootElement),
|
|
26
|
-
|
|
26
|
+
currentMonth = document.getElementsByClassName('js-currentMonth')[0];
|
|
27
27
|
|
|
28
|
-
const init = function () {
|
|
29
|
-
|
|
30
|
-
|
|
28
|
+
const init = function () {
|
|
29
|
+
currentMonth.classList.add('text-white');
|
|
30
|
+
currentMonth.classList.add('bg-black');
|
|
31
31
|
|
|
32
32
|
|
|
33
33
|
for (let i = 0; i < triggerDomNodes.length; i++) {
|
|
@@ -73,15 +73,15 @@ const Filterer = (context) => {
|
|
|
73
73
|
|
|
74
74
|
const doSetSelectedFilter = function (e, forceReset) {
|
|
75
75
|
clearSelected()
|
|
76
|
-
|
|
77
|
-
|
|
76
|
+
|
|
77
|
+
|
|
78
78
|
let monthWrapper = e.currentTarget.closest('.js-ns-month');
|
|
79
|
-
let monthName = monthWrapper.querySelector('.js-monthName');
|
|
80
|
-
|
|
79
|
+
let monthName = monthWrapper.querySelector('.js-monthName');
|
|
80
|
+
|
|
81
81
|
if (!forceReset) {
|
|
82
|
-
e.currentTarget.classList.add(navItemSelectedCssTrigger)
|
|
82
|
+
e.currentTarget.classList.add(navItemSelectedCssTrigger)
|
|
83
83
|
if (monthWrapper) {
|
|
84
|
-
|
|
84
|
+
|
|
85
85
|
if (monthName) {
|
|
86
86
|
monthName.classList.remove('text-gray-scorpion')
|
|
87
87
|
monthName.classList.remove('bg-white')
|
|
@@ -106,7 +106,7 @@ const Filterer = (context) => {
|
|
|
106
106
|
currentMonth.classList.add('text-gray-scorpion');
|
|
107
107
|
currentMonth.classList.add('bg-white');
|
|
108
108
|
|
|
109
|
-
|
|
109
|
+
|
|
110
110
|
triggerDomNodes.forEach(function (triggerDomNode) {
|
|
111
111
|
|
|
112
112
|
// hacky die würde bald verändert
|
|
@@ -18,7 +18,7 @@ const NativeScroll = function (context) {
|
|
|
18
18
|
}
|
|
19
19
|
const doScroll = function (e) {
|
|
20
20
|
let step = scrollbar.clientWidth - oneScrollbarItem.clientWidth * 1.5,
|
|
21
|
-
direction = e.currentTarget.classList.contains('-left') ? -1 : 1,
|
|
21
|
+
direction = e.currentTarget.classList.contains('js-left') ? -1 : 1,
|
|
22
22
|
distance = direction * step
|
|
23
23
|
console.log(
|
|
24
24
|
'🚀 ~ file: nativeScroll.feature.js ~ line 22 ~ doScroll ~ direction',
|
|
@@ -90,14 +90,14 @@ const NativeScroll = function (context) {
|
|
|
90
90
|
: (time - 1) * (2 * time - 2) * (2 * time - 2) + 1
|
|
91
91
|
}
|
|
92
92
|
|
|
93
|
-
if (hr$('.js-ns-scroll
|
|
94
|
-
scrollbar = hr$('.js-ns-scroll
|
|
93
|
+
if (hr$('.js-ns-scroll.js-horizontal', rootElement).length > 0) {
|
|
94
|
+
scrollbar = hr$('.js-ns-scroll.js-horizontal', rootElement)[0]
|
|
95
95
|
buttons = hr$('.js-ns-button', rootElement)
|
|
96
96
|
oneScrollbarItem = hr$('.js-ns-item', rootElement)[0]
|
|
97
97
|
hasNativeSmoothScroll = isNativeSmoothScrollEnabledOn(scrollbar)
|
|
98
|
-
let initiallySelectedMonth = hr$('.js-ns-month
|
|
98
|
+
let initiallySelectedMonth = hr$('.js-ns-month.js-selected', rootElement)[0]
|
|
99
99
|
if (!initiallySelectedMonth) {
|
|
100
|
-
initiallySelectedMonth = hr$('.js-ns-month
|
|
100
|
+
initiallySelectedMonth = hr$('.js-ns-month.js-currentMonth', rootElement)[0]
|
|
101
101
|
}
|
|
102
102
|
|
|
103
103
|
if (initiallySelectedMonth) {
|
|
@@ -114,7 +114,7 @@ const NativeScroll = function (context) {
|
|
|
114
114
|
}
|
|
115
115
|
} else {
|
|
116
116
|
console.log(
|
|
117
|
-
'Kein NativeScroll Element gefunden:' + rootElement + ' .js-ns-scroll
|
|
117
|
+
'Kein NativeScroll Element gefunden:' + rootElement + ' .js-ns-scroll.js-horizontal'
|
|
118
118
|
)
|
|
119
119
|
}
|
|
120
120
|
}
|