---
import { site } from "../data/site";

interface Props {
  title?: string;
  text?: string;
  application?: boolean;
}

const {
  title = "Der direkte Draht zu uns",
  text = "Für Beratung, Angebot oder Reparatur erreichen Sie uns telefonisch oder per E-Mail.",
  application = false,
} = Astro.props;
const email = application ? site.applicationEmail : site.email;
---

<aside class="contact-panel">
  <p class="label">Kontakt</p>
  <h2>{title}</h2>
  <p>{text}</p>
  <div class="contact-actions">
    <a class="button primary" href={site.phoneHref}>Anrufen</a>
    <a class="button secondary" href={`mailto:${email}`}>E-Mail schreiben</a>
  </div>
  <dl>
    <div>
      <dt>Telefon</dt>
      <dd><a href={site.phoneHref}>{site.phone}</a></dd>
    </div>
    <div>
      <dt>E-Mail</dt>
      <dd><a href={`mailto:${email}`}>{email}</a></dd>
    </div>
    <div>
      <dt>Adresse</dt>
      <dd>{site.address[0]}<br />{site.address[1]}</dd>
    </div>
  </dl>
</aside>