65 lines
3.4 KiB
PHP
65 lines
3.4 KiB
PHP
|
<?php
|
||
|
|
|
||
|
|
declare(strict_types=1);
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Eine Ehrenamtsstelle als aufklappbare Karte (Seite /mitmachen). Props:
|
||
|
|
* $position array{id, group?, area?, icon?, title, summary?, description?, tasks?[], commitment?, requirements?[]}
|
||
|
|
* $contact array|null — aufgelöster Ansprechpartner (Shape wie person-card erwartet)
|
||
|
|
* Natives <details>/<summary> → ohne JS bedienbar (FAQ-Mechanik). Eingeklappt zeigt die
|
||
|
|
* Karte nur Bereich + Titel; Details und Ansprechpartner erscheinen beim Aufklappen.
|
||
|
|
* Das JobPosting-Schema liefert die Seite über $meta['schema'] (helpers: job_posting_schema).
|
||
|
|
* Heading-Outline: Titel h3 (in der summary), Ansprechpartner (person-card) h4.
|
||
|
|
*/
|
||
|
|
$contact = $contact ?? null;
|
||
|
|
?>
|
||
|
|
<details class="position-card" id="<?= e($position['id']) ?>" data-group="<?= e($position['group'] ?? '') ?>">
|
||
|
|
<summary class="position-card__head">
|
||
|
|
<?php if (!empty($position['icon'])): ?>
|
||
|
|
<span class="position-card__icon" aria-hidden="true"><?= icon($position['icon']) ?></span>
|
||
|
|
<?php endif; ?>
|
||
|
|
<span class="position-card__heading">
|
||
|
|
<?php if (!empty($position['area'])): ?>
|
||
|
|
<span class="position-card__area"><?= e($position['area']) ?></span>
|
||
|
|
<?php endif; ?>
|
||
|
|
<h3 class="position-card__title"><?= e($position['title']) ?></h3>
|
||
|
|
</span>
|
||
|
|
<?= icon('chevron-down', 'position-card__chevron') ?>
|
||
|
|
</summary>
|
||
|
|
<div class="position-card__body">
|
||
|
|
<div class="position-card__main">
|
||
|
|
<?php if (!empty($position['summary'])): ?>
|
||
|
|
<p class="position-card__summary"><?= e($position['summary']) ?></p>
|
||
|
|
<?php endif; ?>
|
||
|
|
<?php if (!empty($position['tasks'])): ?>
|
||
|
|
<ul class="position-card__tasks" role="list">
|
||
|
|
<?php foreach ($position['tasks'] as $task): ?>
|
||
|
|
<li><?= icon('check2', 'position-card__check') ?><span><?= e($task) ?></span></li>
|
||
|
|
<?php endforeach; ?>
|
||
|
|
</ul>
|
||
|
|
<?php endif; ?>
|
||
|
|
<?php if (!empty($position['commitment']) || !empty($position['requirements'])): ?>
|
||
|
|
<dl class="position-card__meta">
|
||
|
|
<?php if (!empty($position['commitment'])): ?>
|
||
|
|
<div class="position-card__meta-row">
|
||
|
|
<dt><?= icon('clock-history', 'position-card__meta-icon') ?>Zeitaufwand</dt>
|
||
|
|
<dd><?= e($position['commitment']) ?></dd>
|
||
|
|
</div>
|
||
|
|
<?php endif; ?>
|
||
|
|
<?php if (!empty($position['requirements'])): ?>
|
||
|
|
<div class="position-card__meta-row">
|
||
|
|
<dt><?= icon('check2', 'position-card__meta-icon') ?>Das brauchst du</dt>
|
||
|
|
<dd><?= e(implode(' · ', $position['requirements'])) ?></dd>
|
||
|
|
</div>
|
||
|
|
<?php endif; ?>
|
||
|
|
</dl>
|
||
|
|
<?php endif; ?>
|
||
|
|
</div>
|
||
|
|
<?php if ($contact !== null): ?>
|
||
|
|
<div class="position-card__contact">
|
||
|
|
<?php component('person-card', ['person' => $contact, 'level' => 'h4']); ?>
|
||
|
|
</div>
|
||
|
|
<?php endif; ?>
|
||
|
|
</div>
|
||
|
|
</details>
|