semantic HTML: apropos.php and licence.php (TODO section V & VI)

apropos.php:
- Remove redundant <div class="apropos-left"> wrapper; prose div is now a direct
  grid child
- <div class="apropos-description apropos-page-content"> → <div class="prose">
  (single canonical class for Markdown-rendered content)
- <div class="apropos-right"> → <aside class="apropos-aside"> (supplementary info
  landmark; contacts and credits are secondary to the main description)
- Three bare <div> wrappers inside the aside → <section> (erg link, Contacts, Crédits)
- Three <div class="apropos-contact"> entries → <address> with font-style:normal
  override; <span class="apropos-contact-name"> → <strong>;
  <span class="apropos-contact-email"> → <a href="mailto:…">
  Removes classes: apropos-left, apropos-right, apropos-contact, apropos-contact-name,
  apropos-contact-role, apropos-contact-email, apropos-description, apropos-page-content

licence.php:
- <div class="apropos-description apropos-page-content apropos-single"> →
  <div class="prose apropos-single"> (consistent with apropos.php rename)

apropos.css:
- Rename .apropos-description / .apropos-page-content → .prose; merge all prose
  content rules under the single .prose selector
- Rename .apropos-right → .apropos-aside; remove .apropos-left (empty rule)
- Replace .apropos-contact, .apropos-contact-name etc. with element selectors:
  .apropos-aside address, .apropos-aside address strong,
  .apropos-aside address span, .apropos-aside address a
- Update responsive blocks to reference .prose instead of .apropos-description
This commit is contained in:
Pontoporeia
2026-03-29 17:01:52 +02:00
parent f2c023e19a
commit 59ae2151d0
4 changed files with 99 additions and 90 deletions

View File

@@ -46,44 +46,42 @@ $extraCss = ['assets/apropos.css'];
<div class="apropos-layout">
<!-- LEFT: main text (from DB, Markdown-rendered) -->
<div class="apropos-left">
<div class="apropos-description apropos-page-content">
<?= $aboutHtml ?>
</div>
<div class="prose">
<?= $aboutHtml ?>
</div>
<!-- RIGHT: links, contacts, credits -->
<div class="apropos-right">
<aside class="apropos-aside">
<div>
<section>
<h2 class="apropos-section-title">
<a href="https://erg.be" target="_blank" rel="noopener">Site de l'erg</a>
</h2>
</div>
</section>
<div>
<section>
<h2 class="apropos-section-title">Contacts</h2>
<div class="apropos-contact">
<span class="apropos-contact-name">Laurent Leprince</span>
<span class="apropos-contact-role">Bibliothèque d'architecture, d'ingénierie architecturale, d'urbanisme (BAIU) :</span>
<span class="apropos-contact-email">laurent.leprince@uclouvain.be</span>
</div>
<address>
<strong>Laurent Leprince</strong>
<span>Bibliothèque d'architecture, d'ingénierie architecturale, d'urbanisme (BAIU) :</span>
<a href="mailto:laurent.leprince@uclouvain.be">laurent.leprince@uclouvain.be</a>
</address>
<div class="apropos-contact">
<span class="apropos-contact-name">Xavier Gorgol</span>
<span class="apropos-contact-role">Responsable des mémoires de l'ERG :</span>
<span class="apropos-contact-email">xavier.gorgol@erg.be</span>
</div>
<address>
<strong>Xavier Gorgol</strong>
<span>Responsable des mémoires de l'ERG :</span>
<a href="mailto:xavier.gorgol@erg.be">xavier.gorgol@erg.be</a>
</address>
<div class="apropos-contact">
<span class="apropos-contact-name">Brigitte Ledune</span>
<span class="apropos-contact-role">Cours de suivi de mémoire :</span>
<span class="apropos-contact-email">brigitte.ledune@erg.be</span>
</div>
</div>
<address>
<strong>Brigitte Ledune</strong>
<span>Cours de suivi de mémoire :</span>
<a href="mailto:brigitte.ledune@erg.be">brigitte.ledune@erg.be</a>
</address>
</section>
<div>
<section>
<h2 class="apropos-section-title">Crédits</h2>
<p class="apropos-credits-text">
Design &amp; développement : Olivia Marly, Théophile Gerveau-Mercie &amp; Théo Hennequin
@@ -91,9 +89,9 @@ $extraCss = ['assets/apropos.css'];
<p class="apropos-credits-text">
Typographies : Ductus (Amélie Dumont) &amp; BBB DM Sans
</p>
</div>
</section>
</div>
</aside>
</div>
</main>