diff --git a/package-lock.json b/package-lock.json index 0b22b2d7..5a229500 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16,6 +16,7 @@ "bootstrap-sass": "^3.4.1", "bourbon": "^4.3.2", "cookieconsent": "^3.1.0", + "cooltipz-css": "^1.6.8", "dayjs": "^1.10.6", "es6-slide-up-down": "^1.0.0", "flatpickr": "^4.6.9", @@ -24,7 +25,6 @@ "jquery": "^3.6.0", "lazysizes": "^4.1.8", "leaflet": "^1.7.1", - "microtip": "^0.2.2", "normalize.css": "^8.0.1", "picturefill": "^3.0.3", "slick-carousel": "^1.8.1", @@ -3491,6 +3491,11 @@ "resolved": "https://registry.npmjs.org/cookieconsent/-/cookieconsent-3.1.1.tgz", "integrity": "sha512-v8JWLJcI7Zs9NWrs8hiVldVtm3EBF70TJI231vxn6YToBGj0c9dvdnYwltydkAnrbBMOM/qX1xLFrnTfm5wTag==" }, + "node_modules/cooltipz-css": { + "version": "1.6.8", + "resolved": "https://registry.npmjs.org/cooltipz-css/-/cooltipz-css-1.6.8.tgz", + "integrity": "sha512-AlLfZm1XYhM8tFLlHG9gXb6GzYZE523Op5JPx5qgA2AzLYl0w87boFsxDCuaeVMz+uQ9py9wFQ8wGpNssKwzUA==" + }, "node_modules/core-js": { "version": "3.16.1", "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.16.1.tgz", @@ -6447,11 +6452,6 @@ "node": ">=8.6" } }, - "node_modules/microtip": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/microtip/-/microtip-0.2.2.tgz", - "integrity": "sha512-oah38eH5vSHVFP6yXjbKWOYt92mav++0j3zh844h1vhOscqEg7Rf4agDEIwUTFCcAPPdlhYUQMe6eZfHgD+4oQ==" - }, "node_modules/mime": { "version": "1.6.0", "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz", @@ -13827,6 +13827,11 @@ "resolved": "https://registry.npmjs.org/cookieconsent/-/cookieconsent-3.1.1.tgz", "integrity": "sha512-v8JWLJcI7Zs9NWrs8hiVldVtm3EBF70TJI231vxn6YToBGj0c9dvdnYwltydkAnrbBMOM/qX1xLFrnTfm5wTag==" }, + "cooltipz-css": { + "version": "1.6.8", + "resolved": "https://registry.npmjs.org/cooltipz-css/-/cooltipz-css-1.6.8.tgz", + "integrity": "sha512-AlLfZm1XYhM8tFLlHG9gXb6GzYZE523Op5JPx5qgA2AzLYl0w87boFsxDCuaeVMz+uQ9py9wFQ8wGpNssKwzUA==" + }, "core-js": { "version": "3.16.1", "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.16.1.tgz", @@ -16108,11 +16113,6 @@ "picomatch": "^2.2.3" } }, - "microtip": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/microtip/-/microtip-0.2.2.tgz", - "integrity": "sha512-oah38eH5vSHVFP6yXjbKWOYt92mav++0j3zh844h1vhOscqEg7Rf4agDEIwUTFCcAPPdlhYUQMe6eZfHgD+4oQ==" - }, "mime": { "version": "1.6.0", "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz", diff --git a/package.json b/package.json index 6f70f276..8b7c09e7 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "bootstrap-sass": "^3.4.1", "bourbon": "^4.3.2", "cookieconsent": "^3.1.0", + "cooltipz-css": "^1.6.8", "dayjs": "^1.10.6", "es6-slide-up-down": "^1.0.0", "flatpickr": "^4.6.9", @@ -24,7 +25,6 @@ "jquery": "^3.6.0", "lazysizes": "^4.1.8", "leaflet": "^1.7.1", - "microtip": "^0.2.2", "normalize.css": "^8.0.1", "picturefill": "^3.0.3", "slick-carousel": "^1.8.1", diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/controllers/watchlist_label_controller.js b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/controllers/watchlist_label_controller.js index 194a2ef5..b07c0951 100644 --- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/controllers/watchlist_label_controller.js +++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/controllers/watchlist_label_controller.js @@ -4,7 +4,7 @@ export default class extends Controller { static values = { count: Number } - static targets = [ 'label' ] + static targets = [ 'label', 'icon' ] connect() { this.watchlist = JSON.parse(sessionStorage.getItem('myep-watchlist')) || [] @@ -24,11 +24,7 @@ export default class extends Controller { } countValueChanged() { - if (0 === this.countValue) { - this.element.classList.add('hidden') - } else { - this.element.classList.remove('hidden') - this.labelTarget.innerText = `Merkliste (${this.watchlist.length})` - } + this.iconTarget.setAttribute('fill', this.countValue > 0 ? 'currentColor' : 'none') + this.labelTarget.innerText = `Merkliste (${this.countValue})` } } diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/controllers/watchlist_toggle_controller.js b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/controllers/watchlist_toggle_controller.js index 1595a108..5875785a 100644 --- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/controllers/watchlist_toggle_controller.js +++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/controllers/watchlist_toggle_controller.js @@ -36,7 +36,7 @@ export default class extends Controller { this.labelTarget.innerText = true === this.onListValue ? 'von der Merkliste entfernen' : 'auf die Merkliste setzen' } if (this.hasIconTarget) { - this.iconTarget.setAttribute('href', true === this.onListValue ? '#icon-minus-circle' : '#icon-plus-circle') + this.iconTarget.setAttribute('fill', true === this.onListValue ? 'currentColor' : 'none') } if (this.hasAriaLabelTarget) { this.ariaLabelTarget.setAttribute('aria-label', true === this.onListValue ? 'von der Merkliste entfernen' : 'auf die Merkliste setzen') diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/components/_tooltips.scss b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/components/_tooltips.scss new file mode 100644 index 00000000..c253ab80 --- /dev/null +++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/components/_tooltips.scss @@ -0,0 +1,6 @@ +@import "~cooltipz-css/src/cooltipz"; + +:root { + --cooltipz-bg-color: theme('colors.ep.secondary'); + --cooltipz-text-color: theme('colors.white'); +} diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/main.scss b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/main.scss index b2377300..e023561e 100644 --- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/main.scss +++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/main.scss @@ -18,7 +18,7 @@ } @layer components { - @import "~microtip/microtip"; + @import "components/tooltips"; @import "components/background"; @import "components/badges"; @import "components/buttons"; diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/ContactBar.html b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/ContactBar.html index 2b66a28b..1021b55c 100644 --- a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/ContactBar.html +++ b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/ContactBar.html @@ -9,10 +9,10 @@ data-controller="watchlist-label" data-action="watchlist-toggle:toggle@window->watchlist-label#update" rel="nofollow"> - - - -
+ +
+ Merkliste +
- - - - - + diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Icons.html b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Icons.html index c81ee03a..479b0a8b 100644 --- a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Icons.html +++ b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Icons.html @@ -31,6 +31,9 @@ + + + diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Pricetable.html b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Pricetable.html index da68ca36..18026acb 100644 --- a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Pricetable.html +++ b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Pricetable.html @@ -56,12 +56,12 @@ - + - + diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Product/Teaser.html b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Product/Teaser.html index beaa9b08..fbf4f12b 100644 --- a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Product/Teaser.html +++ b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Product/Teaser.html @@ -3,54 +3,60 @@ xmlns:f="http://typo3.org/ns/fluid/ViewHelpers"> - - - - - - - - -
- -
+
+
+
- - - + + + + +
- {teaser.concept.name} - + {teaser.concept.name} +
-
- + +
+ +
+ + +
-
- -
-
{teaser.product.name}
-
{teaser.region.name}
-
{ep:nightsOptions(options: teaser.nights, daytrip: teaser.daytrip)}
+
+ + + +
+
+ {teaser.product.name} +
+
+ {teaser.region.name} +
+
+ {ep:nightsOptions(options: teaser.nights, daytrip: teaser.daytrip)} +
  • {f:if(condition: '{teaser.season} == "s"', then: 'Bergbahnticket', else: 'Skipass')} @@ -65,9 +71,13 @@ {f:if(condition: '{teaser.season} == "s"', then: 'Bergbahnticket', else: 'Skipass')}
-
- ab {teaser.minPrice} € - p. P. / inkl. {f:if(condition: '{teaser.season} == "s"', then: 'Bergbahnticket', else: 'Skipass')} +
+
+ ab {teaser.minPrice} € +
+
+ p. P. / inkl. {f:if(condition: '{teaser.season} == "s"', then: 'Bergbahnticket', else: 'Skipass')} +
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Product/TeaserWide.html b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Product/TeaserWide.html index b6fbda81..87614f4c 100644 --- a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Product/TeaserWide.html +++ b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Product/TeaserWide.html @@ -93,7 +93,7 @@
- + diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Search/Result.html b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Search/Result.html index f22542eb..c9e2c84a 100644 --- a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Search/Result.html +++ b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Search/Result.html @@ -145,14 +145,7 @@ data-controller="watchlist-toggle" data-watchlist-toggle-key-value="{item.key}" data-action="watchlist-toggle#toggle"> - - - - - +
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Templates/AjaxTable/Datestable.html b/public/typo3conf/ext/ep_theme/Resources/Private/Templates/AjaxTable/Datestable.html index 14446eae..4bbaa7d2 100644 --- a/public/typo3conf/ext/ep_theme/Resources/Private/Templates/AjaxTable/Datestable.html +++ b/public/typo3conf/ext/ep_theme/Resources/Private/Templates/AjaxTable/Datestable.html @@ -50,7 +50,7 @@ Termin - + @@ -116,7 +116,7 @@