itchy/Dialyse-Webseite
1
0 Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
1e33c525f195d51b3adff4c24a2ffa9d7a28d57d
Dialyse-Webseite/view/contact.php
T

153 lines
13 KiB
PHP
Raw Blame History

<?php $isEn = ($lang ?? 'de') === 'en'; ?>
<h1><?= $isEn ? 'Contact &amp; Directions' : 'Kontakt &amp; Anfahrt' ?></h1>
<p class="lead" style="font-size: 1.1rem; color: var(--text-muted); margin-bottom: 2rem;">
<?= $isEn
? 'We are here for you at two conveniently accessible locations in Berlin. Feel free to contact us by phone, email, or via our online contact form.'
: 'Wir sind an zwei verkehrsgünstigen Standorten in Berlin für Sie da. Nehmen Sie gern telefonisch, per E-Mail oder über unser Kontaktformular Verbindung mit uns auf.' ?>
</p>
<div class="contact-layout">
<!-- Standort-Details -->
<div>
<!-- Zentrumsdialyse Card -->
<div class="location-card">
<div class="location-header">
<div class="location-badge" aria-hidden="true">
<svg aria-hidden="true" focusable="false" viewBox="0 0 24 24"><path d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5a2.5 2.5 0 0 1 0-5 2.5 2.5 0 0 1 0 5z"/></svg>
</div>
<h2 class="location-title"><?= $isEn ? 'Center Dialysis (Main Location)' : 'Zentrumsdialyse (Hauptstandort)' ?></h2>
</div>
<div class="contact-detail-row">
<svg class="contact-detail-icon" aria-hidden="true" focusable="false" viewBox="0 0 24 24"><path d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5a2.5 2.5 0 0 1 0-5 2.5 2.5 0 0 1 0 5z"/></svg>
<div class="contact-detail-label"><?= $isEn ? 'Address:' : 'Adresse:' ?></div>
<div class="contact-detail-value">
Thorner Straße 1<br>
12623 Berlin &ndash; Mahlsdorf<br>
<a href="https://www.google.com/maps/place/Dialysezentrum+Berlin-Mahlsdorf/@52.5078291,13.6092903,17z/data=!3m1!4b1!4m6!3m5!1s0x47a84991f9c57f7f:0xad4486f559442067!8m2!3d52.5078291!4d13.6092903!16s%2Fg%2F1tdqghgn" target="_blank" rel="noopener noreferrer" aria-label="<?= $isEn ? 'Open Center Dialysis Thorner Straße 1 in Google Maps' : 'Zentrumsdialyse Thorner Straße 1 in Google Maps öffnen' ?>" style="font-weight: 600; display: inline-flex; align-items: center; gap: 0.25rem; margin-top: 0.25rem;">
<span aria-hidden="true">&raquo;</span> <span><?= $isEn ? 'Open in Google Maps' : 'In Google Maps öffnen' ?></span>
</a>
</div>
</div>
<div class="contact-detail-row">
<svg class="contact-detail-icon" aria-hidden="true" focusable="false" viewBox="0 0 24 24"><path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/></svg>
<div class="contact-detail-label"><?= $isEn ? 'Phone (Dialysis):' : 'Telefon (Dialyse):' ?></div>
<div class="contact-detail-value">
<a href="tel:0305662484"><strong>030 / 566 24 84</strong></a>
</div>
</div>
<div class="contact-detail-row">
<svg class="contact-detail-icon" aria-hidden="true" focusable="false" viewBox="0 0 24 24"><path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/></svg>
<div class="contact-detail-label"><?= $isEn ? 'Phone (Clinic):' : 'Telefon (Ambulanz):' ?></div>
<div class="contact-detail-value">
<a href="tel:0305662539"><strong>030 / 566 25 39</strong></a>
</div>
</div>
<div class="contact-detail-row">
<svg class="contact-detail-icon" aria-hidden="true" focusable="false" viewBox="0 0 24 24"><path d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z"/></svg>
<div class="contact-detail-label"><?= $isEn ? 'Email:' : 'E-Mail:' ?></div>
<div class="contact-detail-value">
<a href="javascript:void(0);" onclick="sending();" class="mail-obf" data-usr="kontakt" data-dom="dialyse-berlin" data-tld="net" style="display: inline-flex; align-items: center; gap: 0.35rem; color: var(--accent); font-weight: 600;">
<span class="mail-val c-rev">net.nilreb-esylaid&#64;tkatnok</span>
</a>
</div>
</div>
</div>
<!-- Satellitendialyse Card -->
<div class="location-card">
<div class="location-header">
<div class="location-badge" aria-hidden="true">
<svg aria-hidden="true" focusable="false" viewBox="0 0 24 24"><path d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5a2.5 2.5 0 0 1 0-5 2.5 2.5 0 0 1 0 5z"/></svg>
</div>
<h2 class="location-title"><?= $isEn ? 'Satellite Dialysis' : 'Satellitendialyse' ?></h2>
</div>
<div class="contact-detail-row">
<svg class="contact-detail-icon" aria-hidden="true" focusable="false" viewBox="0 0 24 24"><path d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5a2.5 2.5 0 0 1 0-5 2.5 2.5 0 0 1 0 5z"/></svg>
<div class="contact-detail-label"><?= $isEn ? 'Address:' : 'Adresse:' ?></div>
<div class="contact-detail-value">
Blumberger Damm 130<br>
<small style="color: var(--text-muted);"><?= $isEn ? '(Entrance: Pritzhagener Weg 21)' : '(Eingang: Pritzhagener Weg 21)' ?></small><br>
12685 Berlin &ndash; Marzahn<br>
<a href="https://www.google.com/maps/place/Dialysezentrum+Berlin-Mahlsdorf+LC/@52.5428128,13.5716785,17z/data=!3m1!4b1!4m6!3m5!1s0x47a84991f9d5111b:0xda0b4785760166c5!8m2!3d52.5428128!4d13.5716785!16s%2Fg%2F1ts_5mmj" target="_blank" rel="noopener noreferrer" aria-label="<?= $isEn ? 'Open Satellite Dialysis Blumberger Damm 130 in Google Maps' : 'Satellitendialyse Blumberger Damm 130 in Google Maps öffnen' ?>" style="font-weight: 600; display: inline-flex; align-items: center; gap: 0.25rem; margin-top: 0.25rem;">
<span aria-hidden="true">&raquo;</span> <span><?= $isEn ? 'Open in Google Maps' : 'In Google Maps öffnen' ?></span>
</a>
</div>
</div>
<div class="contact-detail-row">
<svg class="contact-detail-icon" aria-hidden="true" focusable="false" viewBox="0 0 24 24"><path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/></svg>
<div class="contact-detail-label"><?= $isEn ? 'Phone (Dialysis):' : 'Telefon (Dialyse):' ?></div>
<div class="contact-detail-value">
<a href="tel:0305662484"><strong>030 / 566 24 84</strong></a>
</div>
</div>
<div class="contact-detail-row">
<svg class="contact-detail-icon" aria-hidden="true" focusable="false" viewBox="0 0 24 24"><path d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z"/></svg>
<div class="contact-detail-label"><?= $isEn ? 'Email:' : 'E-Mail:' ?></div>
<div class="contact-detail-value">
<a href="javascript:void(0);" onclick="sending();" class="mail-obf" data-usr="kontakt" data-dom="dialyse-berlin" data-tld="net" style="display: inline-flex; align-items: center; gap: 0.35rem; color: var(--accent); font-weight: 600;">
<span class="mail-val c-rev">net.nilreb-esylaid&#64;tkatnok</span>
</a>
</div>
</div>
</div>
<!-- Action Links & Download -->
<div style="display: flex; flex-direction: column; gap: 0.75rem; margin-top: 1rem;">
<a href="javascript:void(0);" onclick="sending();" class="btn btn-secondary mail-obf" data-usr="kontakt" data-dom="dialyse-berlin" data-tld="net" style="width: 100%;">
<svg aria-hidden="true" focusable="false" style="width: 18px; height: 18px; fill: currentColor;" viewBox="0 0 24 24"><path d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z"/></svg>
<?= $isEn ? 'Write Directly via Email:' : 'Direkt per E-Mail schreiben:' ?> <span class="mail-val c-rev">net.nilreb-esylaid&#64;tkatnok</span>
</a>
<a href="<?= Helper::url('/kontakt-formular.html', $lang ?? 'de') ?>" class="btn btn-primary" style="width: 100%;">
<svg aria-hidden="true" focusable="false" style="width: 18px; height: 18px; fill: currentColor;" viewBox="0 0 24 24"><path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-5 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z"/></svg>
<?= $isEn ? 'Open Online Contact Form' : 'Online-Kontaktformular aufrufen' ?> <span aria-hidden="true">&raquo;</span>
</a>
<a href="<?= Helper::url('/ersttermin.html', $lang ?? 'de') ?>" class="btn btn-outline-primary" style="width: 100%;">
<svg aria-hidden="true" focusable="false" style="width: 18px; height: 18px; fill: currentColor;" viewBox="0 0 24 24"><path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>
<?= $isEn ? 'First Appointment Information &amp; Forms' : 'Informationen &amp; Formulare zum 1. Termin' ?> <span aria-hidden="true">&raquo;</span>
</a>
<a href="/files/dialyse_flyer.pdf" target="_blank" rel="noopener" class="btn btn-outline-primary" style="width: 100%;">
<svg aria-hidden="true" focusable="false" style="width: 18px; height: 18px; fill: currentColor;" viewBox="0 0 24 24"><path d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"/></svg>
<?= $isEn ? 'Download Practice Flyer (PDF)' : 'Praxis-Flyer herunterladen (PDF)' ?>
</a>
</div>
</div>
<!-- Interaktive Karte & Standorte -->
<div>
<div class="map-card">
<div class="map-header">
<h2 class="map-header-title" id="mapHeaderTitle" style="margin: 0;"><?= $isEn ? 'Location Map &bull; Berlin-Mahlsdorf' : 'Standortkarte &bull; Berlin-Mahlsdorf' ?></h2>
<div role="group" aria-label="<?= $isEn ? 'Select location on map' : 'Standort auf der Karte auswählen' ?>" style="display: flex; gap: 0.5rem;">
<button type="button" id="btnMapMahlsdorf" class="btn btn-sm btn-primary" aria-pressed="true" onclick="showMapLocation('mahlsdorf');"><?= $isEn ? 'Center' : 'Zentrum' ?></button>
<button type="button" id="btnMapSatellit" class="btn btn-sm btn-outline-primary" aria-pressed="false" onclick="showMapLocation('satellit');"><?= $isEn ? 'Satellite' : 'Satellit' ?></button>
</div>
</div>
<div class="map-iframe-wrapper">
<iframe id="mapFrame"
src="https://maps.google.com/maps?q=Thorner+Stra%C3%9Fe+1,+12623+Berlin&t=&z=15&ie=UTF8&iwloc=&output=embed"
loading="lazy"
title="<?= $isEn ? 'Map Center Dialysis Berlin-Mahlsdorf' : 'Karte Zentrumsdialyse Berlin-Mahlsdorf' ?>"></iframe>
</div>
<div style="padding: 1rem 1.25rem; background-color: #ffffff; border-top: 1px solid var(--border); font-size: 0.85rem; color: var(--text-muted); display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 0.5rem;">
<span id="mapAddressText">Thorner Straße 1, 12623 Berlin</span>
<a id="mapExternalLink" href="https://www.google.com/maps/place/Dialysezentrum+Berlin-Mahlsdorf/@52.5078291,13.6092903,17z/data=!3m1!4b1!4m6!3m5!1s0x47a84991f9c57f7f:0xad4486f559442067!8m2!3d52.5078291!4d13.6092903!16s%2Fg%2F1tdqghgn" target="_blank" rel="noopener noreferrer" style="font-weight: 600;">
<?= $isEn ? 'Large Route Map' : 'Große Routenkarte' ?> <span aria-hidden="true">&raquo;</span>
</a>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="/js/contact.js"></script>
Reference in new issue View Git Blame Copy Permalink