mummert/eventmanager-bundle
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(map): simplify filters and restore style toggle behavior

Browse Source
This commit is contained in:
Jürgen Mummert
2026-02-26 18:26:20 +01:00
parent 40aaa747d9
commit 621ce8dc8b
6 changed files with 141 additions and 138 deletions
Download Patch File Download Diff File Expand all files Collapse all files
contao/templates/frontend/event_map.html.twig
+30 -16
View File
@@ -9,12 +9,13 @@
>
<button
type="button"
class="eventmanager-map-filter__toggle"
class="eventmanager-map-filter__toggle is-expanded"
data-map-filter-toggle="1"
aria-expanded="true"
aria-controls="{{ mapFilterGroupId|e('html_attr') }}"
>
Bereiche ausblenden
<span class="eventmanager-map-filter__toggle-label eventmanager-map-filter__toggle-label--expand">Filter einblenden</span>
<span class="eventmanager-map-filter__toggle-label eventmanager-map-filter__toggle-label--collapse">Filter ausblenden</span>
</button>
<div
@@ -23,29 +24,43 @@
role="group"
aria-label="Organisationstypen"
>
<button
type="button"
class="eventmanager-map-filter__tag is-active"
data-map-filter-action="all"
aria-pressed="true"
>Alle</button>
{% if tags is iterable and tags|length > 0 %}
{% for tag in tags %}
<button
type="button"
class="eventmanager-map-filter__tag is-active"
class="eventmanager-map-filter__tag"
data-map-tag-filter="{{ tag.id|e('html_attr') }}"
aria-pressed="true"
aria-pressed="false"
>{{ tag.label|e }}</button>
{% endfor %}
{% endif %}
<button
type="button"
class="eventmanager-map-filter__tag is-active"
class="eventmanager-map-filter__tag"
data-map-event-toggle="1"
aria-pressed="true"
aria-pressed="false"
>Veranstaltungen</button>
</div>
<div class="eventmanager-map-filter__actions">
<button type="button" data-map-filter-action="all">Alle auswählen</button>
<button type="button" data-map-filter-action="none">Alle abwählen</button>
<button type="button" data-map-style-mode="street" aria-pressed="true">Straße</button>
<button type="button" data-map-style-mode="satellite" aria-pressed="false">Satellit</button>
<button
type="button"
class="eventmanager-map-filter__tag"
data-map-style-mode="street"
aria-pressed="true"
>Straße</button>
<button
type="button"
class="eventmanager-map-filter__tag"
data-map-style-mode="satellite"
aria-pressed="false"
>Satellit</button>
</div>
</section>
@@ -57,7 +72,7 @@
data-map-style="{{ mapStyleUrl|e('html_attr') }}"
data-map-data-id="{{ mapDataElementId|e('html_attr') }}"
data-map-event-color="{{ mapEventColor|default('#BC5067')|e('html_attr') }}"
data-map-organization-colors="{{ mapOrganizationColorScheme|default('')|e('html_attr') }}"
data-map-organization-color="{{ mapOrganizationColor|default('#BC5067')|e('html_attr') }}"
data-map-center-mode="{{ mapCenterMode|default('markers')|e('html_attr') }}"
data-map-center-lat="{{ mapCenterLat|default('')|e('html_attr') }}"
data-map-center-lng="{{ mapCenterLng|default('')|e('html_attr') }}"
@@ -71,8 +86,7 @@
margin-bottom: .75rem;
}
.eventmanager-map-filter__group,
.eventmanager-map-filter__actions {
.eventmanager-map-filter__group {
display: flex;
flex-wrap: wrap;
gap: .5rem;
@@ -89,4 +103,4 @@
</style>
<script type="application/json" id="{{ mapDataElementId|e('html_attr') }}">{{ mapItemsJson|raw }}</script>
<script type="module" src="/bundles/mummertmediaeventmanager/assets/map-module.js"></script>
<script type="module" src="/bundles/mummertmediaeventmanager/assets/map-module.js?v=20260226"></script>