Dev Spec — Promo Seminars (δυναμικά states)

Ίδιο template για όλες τις περιπτώσεις. Αλλάζει μόνο πόσες κάρτες τυπώνει το loop και αν τρέχει το slider. Το «fill» είναι ήδη CSS (flex:1) — μηδέν επιπλέον κώδικας.

1 · Το query — αυτόματα «upcoming»

Custom post type seminar με ACF πεδίο ημερομηνίας. Φέρνουμε μόνο όσα δεν έχουν περάσει, σε χρονολογική σειρά:

// functions/template — upcoming seminars
$today = date('Ymd');
$q = new WP_Query([
  'post_type'      => 'seminar',
  'posts_per_page' => -1,
  'meta_key'       => 'start_date',      // ACF date (Ymd)
  'orderby'        => 'meta_value_num',
  'order'          => 'ASC',
  'meta_query'     => [[
    'key'     => 'start_date',
    'value'   => $today,
    'compare' => '>=',           // μελλοντικά μόνο
    'type'    => 'NUMERIC',
  ]],
]);
$count = $q->found_posts;

Όταν περάσει η ημερομηνία ενός σεμιναρίου, φεύγει μόνο του από την ενότητα — καμία χειροκίνητη ενέργεια.

2 · Το conditional — τα 4 states

if ($count === 0) {
  // → EMPTY STATE: μήνυμα + CTA «Όλα τα σεμινάρια»
} else {
  // ίδιο markup loop για 1 / 2 / 3+ (flex:1 = fill αυτόματα)
  $is_carousel = $count >= 3;        // slider μόνο εδώ
  // echo .seminars-row > .intro-card + .cards(loop)
  // echo dots ΜΟΝΟ αν $is_carousel
}

// JS — conditional init (responsive)
const n = document.querySelectorAll('.cards .s-card').length;
// Desktop: slider μόνο αν 3+ ·  Tablet/Mobile: 1 ανά view → slider από 2+
if (n >= 2) {
  new Swiper('.cards', {
    spaceBetween: 20,
    pagination: { el: '.dots', clickable: true },
    slidesPerView: 1,                          // mobile (<768) → 1
    breakpoints: {
      768:  { slidesPerView: 2 },              // tablet → 2
      1240: { slidesPerView: 3, enabled: n>=3 } // wide desktop → 3, slider μόνο αν 3+
    }
  });
}

3 · ACF πεδία ανά σεμινάριο

Badges: το «Upcoming» προκύπτει αυτόματα από το query (όλα είναι μελλοντικά). Το «Live Streaming» οδηγείται από το is_live.

4 · Αποφασισμένο (βάσει αλλαγών)

• 0-state: κάρτα με σταθερή brand εικόνα + σκούρο overlay (όχι κενό panel, όχι απόκρυψη). CTA «Δες τις Ακαδημίες μας» → Ακαδημίες/Μέθοδος (όχι διπλό με το intro). Το intro link «Όλα τα σεμινάρια» καλύπτει το archive — αποφεύγουμε redundant CTA.
• Responsive 3 → 2 → 1: ≥1240px = 3 κάρτες · 768–1239px (tablet) = 2 · <768px (mobile) = 1 (swipe carousel με dots). Το intro card στοιβάζεται από πάνω σε mobile. Αποφεύγει στενές/«σπασμένες» κάρτες στα ενδιάμεσα πλάτη.
• Desktop: fill για 1–2 σεμινάρια (χωρίς dots)· carousel + dots από 3+.

5 · Προς επιβεβαίωση ομάδας

• Breakpoint desktop: πόσες κάρτες ορατές (εδώ 3) — ορίζει το όριο ενεργοποίησης slider.
• 0-state copy: οριστικό κείμενο μηνύματος + ακριβής προορισμός CTA (σελίδα Ακαδημιών ή Μεθόδου).
• Ποια σταθερή brand εικόνα θα μπει στο 0-state (επιλογή asset).