Landing: add featured essentials row and make stages collapsible dropdowns

Adds a 5-card featured row (journey, deadlines, eVS apply, residence permit, accommodation) above the stages, and converts the six stage cards into native details/summary accordions (first open by default, chevron rotates). Links inside open into a compact grid. Cuts the empty white space and visual noise.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
popovskikandClaude Opus 4.8 committed 2026-07-31 12:33:41 +02:00
1 parent 13b2bb6eb2
commit f88a9bb6b4
4 files changed
+277 -106

No files matched your search

+59 -25
View File
@@ -222,31 +222,61 @@
<section class="guide-section">
<h2>Find your way through the guide</h2>
<p class="guide-section-sub">The guide follows your journey in six stages, from choosing a programme to daily life in Slovenia. Open the stage you are in, or use Show my route above for a personal checklist.</p>
<p class="guide-section-sub">Most students start with the essentials below. Open a stage to see everything in it.</p>
<div class="guide-featured">
<a class="guide-featured-card" href="complete-student-journey/">
<span class="guide-featured-icon"><i class="fas fa-route" aria-hidden="true"></i></span>
<span class="guide-featured-label">Your journey</span>
<span class="guide-featured-sub">The whole path at a glance</span>
</a>
<a class="guide-featured-card" href="application-deadlines/">
<span class="guide-featured-icon"><i class="fas fa-calendar-day" aria-hidden="true"></i></span>
<span class="guide-featured-label">Deadlines</span>
<span class="guide-featured-sub">What closes when</span>
</a>
<a class="guide-featured-card" href="evs-application-guide/">
<span class="guide-featured-icon"><i class="fas fa-file-lines" aria-hidden="true"></i></span>
<span class="guide-featured-label">Apply (eVŠ)</span>
<span class="guide-featured-sub">Enrol step by step</span>
</a>
<a class="guide-featured-card" href="student-residence-permit/">
<span class="guide-featured-icon"><i class="fas fa-id-card" aria-hidden="true"></i></span>
<span class="guide-featured-label">Residence permit</span>
<span class="guide-featured-sub">Your right to stay</span>
</a>
<a class="guide-featured-card" href="student-accommodation/">
<span class="guide-featured-icon"><i class="fas fa-house" aria-hidden="true"></i></span>
<span class="guide-featured-label">Accommodation</span>
<span class="guide-featured-sub">Finding a place to live</span>
</a>
</div>
<p class="guide-browse-label">Browse by stage</p>
<div class="guide-cats">
<div class="guide-cat">
<div class="guide-cat-head">
<details class="guide-cat" open>
<summary class="guide-cat-head">
<span class="guide-cat-num">1</span>
<div class="guide-cat-heading">
<h3><i class="fas fa-compass" aria-hidden="true"></i>Start here: explore and decide</h3>
<p>See the whole journey, then pick a programme, a city, and check the cost.</p>
</div>
</div>
<i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links">
<a class="guide-quicklink" href="complete-student-journey/"><i class="fas fa-route" aria-hidden="true"></i>Your complete journey</a>
<a class="guide-quicklink" href="choose-a-programme/"><i class="fas fa-compass" aria-hidden="true"></i>Choosing a programme</a>
<a class="guide-quicklink" href="study-cities/"><i class="fas fa-city" aria-hidden="true"></i>Study cities</a>
<a class="guide-quicklink" href="tuition-and-scholarships/"><i class="fas fa-money-bill-wave" aria-hidden="true"></i>Tuition and scholarships</a>
</div>
</div>
<div class="guide-cat">
<div class="guide-cat-head">
</details>
<details class="guide-cat">
<summary class="guide-cat-head">
<span class="guide-cat-num">2</span>
<div class="guide-cat-heading">
<h3><i class="fas fa-file-lines" aria-hidden="true"></i>Apply to study</h3>
<p>Deadlines, the eVŠ application, recognition, documents, and enrolment.</p>
</div>
</div>
<i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links">
<a class="guide-quicklink" href="application-deadlines/"><i class="fas fa-calendar-day" aria-hidden="true"></i>Current deadlines</a>
<a class="guide-quicklink" href="bachelor-application/"><i class="fas fa-graduation-cap" aria-hidden="true"></i>Bachelor application</a>
@@ -256,15 +286,16 @@
<a class="guide-quicklink" href="document-preparation/"><i class="fas fa-folder-open" aria-hidden="true"></i>Preparing documents</a>
<a class="guide-quicklink" href="admission-and-enrolment/"><i class="fas fa-clipboard-check" aria-hidden="true"></i>Admission and enrolment</a>
</div>
</div>
<div class="guide-cat">
<div class="guide-cat-head">
</details>
<details class="guide-cat">
<summary class="guide-cat-head">
<span class="guide-cat-num">3</span>
<div class="guide-cat-heading">
<h3><i class="fas fa-passport" aria-hidden="true"></i>Residence and healthcare</h3>
<p>Your legal right to stay for the year and your access to healthcare.</p>
</div>
</div>
<i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links">
<a class="guide-quicklink" href="visa-and-residence-explained/"><i class="fas fa-passport" aria-hidden="true"></i>Visa and residence</a>
<a class="guide-quicklink" href="student-residence-permit/"><i class="fas fa-id-card" aria-hidden="true"></i>Residence permit</a>
@@ -273,30 +304,32 @@
<a class="guide-quicklink" href="rm-si-3-health-insurance/"><i class="fas fa-heart-pulse" aria-hidden="true"></i>Health insurance (RM/SI 3)</a>
<a class="guide-quicklink" href="healthcare-in-slovenia/"><i class="fas fa-house-medical" aria-hidden="true"></i>Using healthcare</a>
</div>
</div>
<div class="guide-cat">
<div class="guide-cat-head">
</details>
<details class="guide-cat">
<summary class="guide-cat-head">
<span class="guide-cat-num">4</span>
<div class="guide-cat-heading">
<h3><i class="fas fa-suitcase-rolling" aria-hidden="true"></i>Move and settle in</h3>
<p>Housing, packing, arrival, and the admin that unlocks everything else.</p>
</div>
</div>
<i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links">
<a class="guide-quicklink" href="student-accommodation/"><i class="fas fa-house" aria-hidden="true"></i>Accommodation</a>
<a class="guide-quicklink" href="prepare-to-move/"><i class="fas fa-suitcase-rolling" aria-hidden="true"></i>Travelling and packing</a>
<a class="guide-quicklink" href="arrival-checklist/"><i class="fas fa-list-check" aria-hidden="true"></i>Arrival checklist</a>
<a class="guide-quicklink" href="administrative-basics/"><i class="fas fa-gears" aria-hidden="true"></i>Admin basics (EMŠO, tax, bank)</a>
</div>
</div>
<div class="guide-cat">
<div class="guide-cat-head">
</details>
<details class="guide-cat">
<summary class="guide-cat-head">
<span class="guide-cat-num">5</span>
<div class="guide-cat-heading">
<h3><i class="fas fa-mug-hot" aria-hidden="true"></i>Everyday student life</h3>
<p>Meals, transport, work, budget, studying, and finding your community.</p>
</div>
</div>
<i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links">
<a class="guide-quicklink" href="student-meals/"><i class="fas fa-utensils" aria-hidden="true"></i>Student meals</a>
<a class="guide-quicklink" href="student-transport/"><i class="fas fa-bus" aria-hidden="true"></i>Student transport</a>
@@ -306,20 +339,21 @@
<a class="guide-quicklink" href="wellbeing-and-community/"><i class="fas fa-hands-holding-circle" aria-hidden="true"></i>Wellbeing and community</a>
<a class="guide-quicklink" href="student-organisations-and-extracurriculars/"><i class="fas fa-people-group" aria-hidden="true"></i>Student organisations</a>
</div>
</div>
<div class="guide-cat">
<div class="guide-cat-head">
</details>
<details class="guide-cat">
<summary class="guide-cat-head">
<span class="guide-cat-num">6</span>
<div class="guide-cat-heading">
<h3><i class="fas fa-arrows-rotate" aria-hidden="true"></i>After your first year</h3>
<p>Renewing, changing or graduating, plus the official sources to trust.</p>
</div>
</div>
<i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links">
<a class="guide-quicklink" href="renew-change-graduate/"><i class="fas fa-arrows-rotate" aria-hidden="true"></i>Renewal and graduation</a>
<a class="guide-quicklink" href="official-sources-and-checklists/"><i class="fas fa-list-ul" aria-hidden="true"></i>Official sources</a>
</div>
</div>
</details>
</div>
</section>