merge: conditional social links into wp

tests/functional/tests/portal.spec.ts

@@ -47,6 +47,16 @@ test("provides usable contact actions", async ({ page }) => {
     "href",
     "https://wa.me/393331234567",
   );
+  await expect(page.locator(".social-links a")).toHaveCount(2);
+  await expect(page.getByRole("link", { name: "Instagram" })).toHaveAttribute(
+    "href",
+    "https://instagram.com/",
+  );
+  await expect(page.getByRole("link", { name: "Facebook" })).toHaveAttribute(
+    "href",
+    "https://facebook.com/",
+  );
+  await expect(page.locator(".social-links .social-icon")).toHaveCount(2);
 });
 
 test("supports mobile navigation without horizontal overflow", async ({ page }) => {

wordpress/theme/azionelab/front-page.php

@@ -11,6 +11,15 @@ $features = array(
     array( 'Per chi vuole crescere', 'Un tempo regolare per approfondire strumenti, consapevolezza e libertà espressiva.' ),
     array( 'Per chi ama il gruppo', 'La scena nasce dalla fiducia: si crea insieme, rispettando tempi e sensibilità diverse.' ),
 );
+$social_links = array_values(
+    array_filter(
+        array(
+            array( 'label' => 'Instagram', 'url' => trim( azionelab_mod( 'contact_instagram' ) ), 'icon' => 'instagram' ),
+            array( 'label' => 'Facebook', 'url' => trim( azionelab_mod( 'contact_facebook' ) ), 'icon' => 'facebook' ),
+        ),
+        static fn ( array $link ): bool => '' !== $link['url']
+    )
+);
 ?>
 <main id="contenuto">
     <section class="hero section" id="inizio" aria-labelledby="hero-title">
@@ -174,7 +183,22 @@ $features = array(
 
     <section class="contacts section" id="contatti" aria-labelledby="contacts-title">
         <div class="container contact-grid">
-            <div><p class="eyebrow">Parliamone</p><h2 id="contacts-title">Vieni a conoscerci</h2><p class="lead">Non serve esperienza: basta la curiosità di incontrare il teatro e il gruppo.</p><p><strong>Dove</strong><br><?php echo esc_html( azionelab_mod( 'contact_address' ) ); ?></p><div class="social-links"><a href="<?php echo esc_url( azionelab_mod( 'contact_instagram' ) ); ?>" rel="noopener noreferrer">Instagram</a><a href="<?php echo esc_url( azionelab_mod( 'contact_facebook' ) ); ?>" rel="noopener noreferrer">Facebook</a></div></div>
+            <div>
+                <p class="eyebrow">Parliamone</p>
+                <h2 id="contacts-title">Vieni a conoscerci</h2>
+                <p class="lead">Non serve esperienza: basta la curiosità di incontrare il teatro e il gruppo.</p>
+                <p><strong>Dove</strong><br><?php echo esc_html( azionelab_mod( 'contact_address' ) ); ?></p>
+                <?php if ( $social_links ) : ?>
+                    <div class="social-links">
+                        <?php foreach ( $social_links as $social_link ) : ?>
+                            <a href="<?php echo esc_url( $social_link['url'] ); ?>" rel="noopener noreferrer">
+                                <?php echo azionelab_social_icon( $social_link['icon'] ); ?>
+                                <span><?php echo esc_html( $social_link['label'] ); ?></span>
+                            </a>
+                        <?php endforeach; ?>
+                    </div>
+                <?php endif; ?>
+            </div>
             <div class="contact-actions">
                 <a class="contact-action" href="mailto:<?php echo esc_attr( sanitize_email( azionelab_mod( 'contact_email' ) ) ); ?>"><span>Scrivi una mail</span><strong><?php echo esc_html( azionelab_mod( 'contact_email' ) ); ?></strong></a>
                 <a class="contact-action" href="tel:<?php echo esc_attr( azionelab_phone_href( azionelab_mod( 'contact_phone' ) ) ); ?>"><span>Chiama</span><strong><?php echo esc_html( azionelab_mod( 'contact_phone' ) ); ?></strong></a>

wordpress/theme/azionelab/functions.php

@@ -77,6 +77,18 @@ function azionelab_whatsapp_href( string $number ): string {
     return preg_replace( '/[^0-9]/', '', $number ) ?: '';
 }
 
+function azionelab_social_icon( string $network ): string {
+    if ( 'instagram' === $network ) {
+        return '<svg class="social-icon" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><rect x="4.5" y="4.5" width="15" height="15" rx="4.2" fill="none" stroke="currentColor" stroke-width="1.8"/><circle cx="12" cy="12" r="3.5" fill="none" stroke="currentColor" stroke-width="1.8"/><circle cx="16.8" cy="7.2" r="1.1" fill="currentColor"/></svg>';
+    }
+
+    if ( 'facebook' === $network ) {
+        return '<svg class="social-icon" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path fill="currentColor" d="M14.2 8.4h2.3V5.1c-.4-.1-1.7-.2-3.1-.2-3.1 0-5.1 1.8-5.1 5.1v2.8H5v3.7h3.3V24h4.1v-7.5h3.3l.5-3.7h-3.8v-2.4c0-1.1.3-2 1.8-2Z"/></svg>';
+    }
+
+    return '';
+}
+
 function azionelab_setup(): void {
     load_theme_textdomain( 'azionelab', get_template_directory() . '/languages' );
     add_theme_support( 'title-tag' );

wordpress/theme/azionelab/style.css

@@ -186,6 +186,8 @@ blockquote { margin: 2rem 0 0; padding-left: 1.5rem; border-left: 3px solid var(
 .contact-action { display: grid; padding: 1rem 1.1rem; border: 1px solid rgba(255,255,255,0.18); border-radius: 0.9rem; text-decoration: none; }
 .contact-action span { color: var(--color-sand); font-size: 0.78rem; text-transform: uppercase; }
 .social-links { display: flex; margin-top: 1.25rem; flex-wrap: wrap; gap: 1rem; }
+.social-links a { display: inline-flex; align-items: center; gap: 0.45rem; text-underline-offset: 0.25em; }
+.social-icon { width: 1.05rem; height: 1.05rem; flex: 0 0 auto; }
 .site-footer { padding-block: 2rem; color: #f7efe4; background: var(--color-dark-text); }
 .site-footer a { color: #fff8ef; }
 .footer-inner { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.75rem 1.5rem; font-size: 0.85rem; }