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:
popovskik 2026-07-31 12:33:41 +02:00
parent 13b2bb6eb2
commit f88a9bb6b4
4 changed files with 277 additions and 106 deletions

View File

@ -674,71 +674,137 @@
.guide-section { max-width: 1080px; margin: 56px auto; padding: 0 24px; } .guide-section { max-width: 1080px; margin: 56px auto; padding: 0 24px; }
.guide-section > h2 { font-size: 26px; color: #101828; text-align: center; margin: 0 0 6px; } .guide-section > h2 { font-size: 26px; color: #101828; text-align: center; margin: 0 0 6px; }
.guide-section > .guide-section-sub { text-align: center; color: #667085; margin: 0 0 28px; } .guide-section > .guide-section-sub { text-align: center; color: #667085; margin: 0 0 28px; }
/* Stage cards: the guide grouped into six journey stages. */ /* Featured essentials row */
.guide-cats { .guide-featured {
display: grid; display: grid;
grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
gap: 22px; gap: 14px;
align-items: start; margin-bottom: 36px;
}
.guide-featured-card {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 3px;
padding: 18px;
border: 1px solid #D8E3E8;
border-radius: 14px;
background: linear-gradient(180deg, #f4f9fb 0%, #ffffff 70%);
text-decoration: none;
transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.guide-featured-card:hover {
transform: translateY(-3px);
border-color: #2D738C;
box-shadow: 0 12px 26px rgba(45, 115, 140, .18);
}
.guide-featured-icon {
display: flex;
align-items: center;
justify-content: center;
width: 42px;
height: 42px;
margin-bottom: 8px;
border-radius: 11px;
background: #2D738C;
color: #fff;
font-size: 18px;
}
.guide-featured-label {
font-size: 16px;
font-weight: 700;
color: #101828;
}
.guide-featured-sub {
font-size: 13px;
color: #667085;
line-height: 18px;
}
/* Browse-by-stage label */
.guide-browse-label {
max-width: 860px;
margin: 0 auto 14px;
font-size: 13px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
color: #98A2B3;
}
/* Stage accordion (six journey stages) */
.guide-cats {
display: flex;
flex-direction: column;
gap: 12px;
max-width: 860px;
margin: 0 auto;
} }
.guide-cat { .guide-cat {
border: 1px solid #EAECF0; border: 1px solid #EAECF0;
border-radius: 16px; border-radius: 14px;
background: #FFFFFF; background: #FFFFFF;
padding: 22px 22px 14px; overflow: hidden;
box-shadow: 0 1px 2px rgba(16, 24, 40, .04); transition: border-color .15s ease, box-shadow .15s ease;
transition: box-shadow .15s ease, border-color .15s ease;
} }
.guide-cat:hover { .guide-cat[open] {
border-color: #D8E3E8; border-color: #D8E3E8;
box-shadow: 0 12px 28px rgba(16, 24, 40, .08); box-shadow: 0 8px 22px rgba(16, 24, 40, .06);
} }
.guide-cat-head { .guide-cat-head {
display: flex; display: flex;
align-items: flex-start; align-items: center;
gap: 14px; gap: 14px;
padding-bottom: 14px; padding: 16px 18px;
margin-bottom: 8px; cursor: pointer;
border-bottom: 1px solid #F2F4F7; list-style: none;
} }
.guide-cat-head::-webkit-details-marker { display: none; }
.guide-cat-head:hover { background: #FCFCFD; }
.guide-cat-num { .guide-cat-num {
flex-shrink: 0; flex-shrink: 0;
width: 38px; width: 34px;
height: 38px; height: 34px;
border-radius: 10px; border-radius: 9px;
background: #2D738C; background: #2D738C;
color: #fff; color: #fff;
font-weight: 700; font-weight: 700;
font-size: 17px; font-size: 16px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.guide-cat-heading { flex: 1 1 auto; }
.guide-cat-heading h3 { .guide-cat-heading h3 {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 9px; gap: 9px;
margin: 2px 0 4px; margin: 0 0 2px;
font-size: 17px; font-size: 16px;
font-weight: 700; font-weight: 700;
color: #101828; color: #101828;
line-height: 22px; line-height: 21px;
text-align: left; text-align: left;
} }
.guide-cat-heading h3 i { .guide-cat-heading h3 i { color: #2D738C; font-size: 14px; }
color: #2D738C;
font-size: 15px;
}
.guide-cat-heading p { .guide-cat-heading p {
margin: 0; margin: 0;
font-size: 13.5px; font-size: 13px;
color: #667085; color: #667085;
line-height: 20px; line-height: 18px;
} }
.guide-cat-caret {
flex-shrink: 0;
color: #98A2B3;
font-size: 14px;
transition: transform .2s ease;
}
.guide-cat[open] .guide-cat-caret { transform: rotate(180deg); }
.guide-cat-links { .guide-cat-links {
display: flex; display: grid;
flex-direction: column; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
gap: 2px; gap: 4px 10px;
padding: 2px 14px 16px 62px;
} }
.guide-quicklink { .guide-quicklink {
display: flex; display: flex;
@ -763,6 +829,9 @@
text-align: center; text-align: center;
flex-shrink: 0; flex-shrink: 0;
} }
@media (max-width: 640px) {
.guide-cat-links { padding-left: 16px; }
}
/* ---------- Notice / before-you-rely blocks on landing ---------- */ /* ---------- Notice / before-you-rely blocks on landing ---------- */
.guide-notice { .guide-notice {

View File

@ -222,31 +222,61 @@
<section class="guide-section"> <section class="guide-section">
<h2>Find your way through the guide</h2> <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-cats">
<div class="guide-cat"> <details class="guide-cat" open>
<div class="guide-cat-head"> <summary class="guide-cat-head">
<span class="guide-cat-num">1</span> <span class="guide-cat-num">1</span>
<div class="guide-cat-heading"> <div class="guide-cat-heading">
<h3><i class="fas fa-compass" aria-hidden="true"></i>Start here: explore and decide</h3> <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> <p>See the whole journey, then pick a programme, a city, and check the cost.</p>
</div> </div>
</div> <i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links"> <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="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="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="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> <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> </details>
<div class="guide-cat"> <details class="guide-cat">
<div class="guide-cat-head"> <summary class="guide-cat-head">
<span class="guide-cat-num">2</span> <span class="guide-cat-num">2</span>
<div class="guide-cat-heading"> <div class="guide-cat-heading">
<h3><i class="fas fa-file-lines" aria-hidden="true"></i>Apply to study</h3> <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> <p>Deadlines, the eVŠ application, recognition, documents, and enrolment.</p>
</div> </div>
</div> <i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links"> <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="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> <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="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> <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> </details>
<div class="guide-cat"> <details class="guide-cat">
<div class="guide-cat-head"> <summary class="guide-cat-head">
<span class="guide-cat-num">3</span> <span class="guide-cat-num">3</span>
<div class="guide-cat-heading"> <div class="guide-cat-heading">
<h3><i class="fas fa-passport" aria-hidden="true"></i>Residence and healthcare</h3> <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> <p>Your legal right to stay for the year and your access to healthcare.</p>
</div> </div>
</div> <i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links"> <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="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> <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="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> <a class="guide-quicklink" href="healthcare-in-slovenia/"><i class="fas fa-house-medical" aria-hidden="true"></i>Using healthcare</a>
</div> </div>
</div> </details>
<div class="guide-cat"> <details class="guide-cat">
<div class="guide-cat-head"> <summary class="guide-cat-head">
<span class="guide-cat-num">4</span> <span class="guide-cat-num">4</span>
<div class="guide-cat-heading"> <div class="guide-cat-heading">
<h3><i class="fas fa-suitcase-rolling" aria-hidden="true"></i>Move and settle in</h3> <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> <p>Housing, packing, arrival, and the admin that unlocks everything else.</p>
</div> </div>
</div> <i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links"> <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="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="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="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> <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> </details>
<div class="guide-cat"> <details class="guide-cat">
<div class="guide-cat-head"> <summary class="guide-cat-head">
<span class="guide-cat-num">5</span> <span class="guide-cat-num">5</span>
<div class="guide-cat-heading"> <div class="guide-cat-heading">
<h3><i class="fas fa-mug-hot" aria-hidden="true"></i>Everyday student life</h3> <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> <p>Meals, transport, work, budget, studying, and finding your community.</p>
</div> </div>
</div> <i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links"> <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-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> <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="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> <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> </details>
<div class="guide-cat"> <details class="guide-cat">
<div class="guide-cat-head"> <summary class="guide-cat-head">
<span class="guide-cat-num">6</span> <span class="guide-cat-num">6</span>
<div class="guide-cat-heading"> <div class="guide-cat-heading">
<h3><i class="fas fa-arrows-rotate" aria-hidden="true"></i>After your first year</h3> <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> <p>Renewing, changing or graduating, plus the official sources to trust.</p>
</div> </div>
</div> <i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links"> <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="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> <a class="guide-quicklink" href="official-sources-and-checklists/"><i class="fas fa-list-ul" aria-hidden="true"></i>Official sources</a>
</div> </div>
</div> </details>
</div> </div>
</section> </section>

View File

@ -222,31 +222,61 @@
<section class="guide-section"> <section class="guide-section">
<h2>Најдете го вашиот пат низ водичот</h2> <h2>Најдете го вашиот пат низ водичот</h2>
<p class="guide-section-sub">Водичот ја следи вашата патека во шест фази, од избор на програма до секојдневниот живот во Словенија. Отворете ја фазата во која сте, или горе користете Прикажи го мојот пат за личен список.</p> <p class="guide-section-sub">Повеќето студенти почнуваат со основите подолу. Отворете фаза за да видите сè во неа.</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">Вашиот пат</span>
<span class="guide-featured-sub">Целиот пат на едно место</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">Рокови</span>
<span class="guide-featured-sub">Што кога се затвора</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">Пријава (eVŠ)</span>
<span class="guide-featured-sub">Запишување чекор по чекор</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">Дозвола за престој</span>
<span class="guide-featured-sub">Вашето право на престој</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">Сместување</span>
<span class="guide-featured-sub">Наоѓање сместување</span>
</a>
</div>
<p class="guide-browse-label">Прелистувајте по фази</p>
<div class="guide-cats"> <div class="guide-cats">
<div class="guide-cat"> <details class="guide-cat" open>
<div class="guide-cat-head"> <summary class="guide-cat-head">
<span class="guide-cat-num">1</span> <span class="guide-cat-num">1</span>
<div class="guide-cat-heading"> <div class="guide-cat-heading">
<h3><i class="fas fa-compass" aria-hidden="true"></i>Почнете тука: истражете и одлучете</h3> <h3><i class="fas fa-compass" aria-hidden="true"></i>Почнете тука: истражете и одлучете</h3>
<p>Видете го целиот пат, потоа изберете програма, град и проверете ги трошоците.</p> <p>Видете го целиот пат, потоа изберете програма, град и проверете ги трошоците.</p>
</div> </div>
</div> <i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links"> <div class="guide-cat-links">
<a class="guide-quicklink" href="complete-student-journey/"><i class="fas fa-route" aria-hidden="true"></i>Целосниот пат</a> <a class="guide-quicklink" href="complete-student-journey/"><i class="fas fa-route" aria-hidden="true"></i>Целосниот пат</a>
<a class="guide-quicklink" href="choose-a-programme/"><i class="fas fa-compass" aria-hidden="true"></i>Избор на програма</a> <a class="guide-quicklink" href="choose-a-programme/"><i class="fas fa-compass" aria-hidden="true"></i>Избор на програма</a>
<a class="guide-quicklink" href="study-cities/"><i class="fas fa-city" aria-hidden="true"></i>Студентски градови</a> <a class="guide-quicklink" href="study-cities/"><i class="fas fa-city" aria-hidden="true"></i>Студентски градови</a>
<a class="guide-quicklink" href="tuition-and-scholarships/"><i class="fas fa-money-bill-wave" aria-hidden="true"></i>Школарина и стипендии</a> <a class="guide-quicklink" href="tuition-and-scholarships/"><i class="fas fa-money-bill-wave" aria-hidden="true"></i>Школарина и стипендии</a>
</div> </div>
</div> </details>
<div class="guide-cat"> <details class="guide-cat">
<div class="guide-cat-head"> <summary class="guide-cat-head">
<span class="guide-cat-num">2</span> <span class="guide-cat-num">2</span>
<div class="guide-cat-heading"> <div class="guide-cat-heading">
<h3><i class="fas fa-file-lines" aria-hidden="true"></i>Пријава за студии</h3> <h3><i class="fas fa-file-lines" aria-hidden="true"></i>Пријава за студии</h3>
<p>Рокови, пријавата преку eVŠ, признавање, документи и запишување.</p> <p>Рокови, пријавата преку eVŠ, признавање, документи и запишување.</p>
</div> </div>
</div> <i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links"> <div class="guide-cat-links">
<a class="guide-quicklink" href="application-deadlines/"><i class="fas fa-calendar-day" aria-hidden="true"></i>Тековни рокови</a> <a class="guide-quicklink" href="application-deadlines/"><i class="fas fa-calendar-day" aria-hidden="true"></i>Тековни рокови</a>
<a class="guide-quicklink" href="bachelor-application/"><i class="fas fa-graduation-cap" aria-hidden="true"></i>Додипломска пријава</a> <a class="guide-quicklink" href="bachelor-application/"><i class="fas fa-graduation-cap" aria-hidden="true"></i>Додипломска пријава</a>
@ -256,15 +286,16 @@
<a class="guide-quicklink" href="document-preparation/"><i class="fas fa-folder-open" aria-hidden="true"></i>Подготовка на документи</a> <a class="guide-quicklink" href="document-preparation/"><i class="fas fa-folder-open" aria-hidden="true"></i>Подготовка на документи</a>
<a class="guide-quicklink" href="admission-and-enrolment/"><i class="fas fa-clipboard-check" aria-hidden="true"></i>Прием и запишување</a> <a class="guide-quicklink" href="admission-and-enrolment/"><i class="fas fa-clipboard-check" aria-hidden="true"></i>Прием и запишување</a>
</div> </div>
</div> </details>
<div class="guide-cat"> <details class="guide-cat">
<div class="guide-cat-head"> <summary class="guide-cat-head">
<span class="guide-cat-num">3</span> <span class="guide-cat-num">3</span>
<div class="guide-cat-heading"> <div class="guide-cat-heading">
<h3><i class="fas fa-passport" aria-hidden="true"></i>Престој и здравство</h3> <h3><i class="fas fa-passport" aria-hidden="true"></i>Престој и здравство</h3>
<p>Вашето законско право на престој за годината и пристапот до здравство.</p> <p>Вашето законско право на престој за годината и пристапот до здравство.</p>
</div> </div>
</div> <i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links"> <div class="guide-cat-links">
<a class="guide-quicklink" href="visa-and-residence-explained/"><i class="fas fa-passport" aria-hidden="true"></i>Виза и престој</a> <a class="guide-quicklink" href="visa-and-residence-explained/"><i class="fas fa-passport" aria-hidden="true"></i>Виза и престој</a>
<a class="guide-quicklink" href="student-residence-permit/"><i class="fas fa-id-card" aria-hidden="true"></i>Дозвола за престој</a> <a class="guide-quicklink" href="student-residence-permit/"><i class="fas fa-id-card" aria-hidden="true"></i>Дозвола за престој</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>Здравствено осигурување (RM/SI 3)</a> <a class="guide-quicklink" href="rm-si-3-health-insurance/"><i class="fas fa-heart-pulse" aria-hidden="true"></i>Здравствено осигурување (RM/SI 3)</a>
<a class="guide-quicklink" href="healthcare-in-slovenia/"><i class="fas fa-house-medical" aria-hidden="true"></i>Користење здравство</a> <a class="guide-quicklink" href="healthcare-in-slovenia/"><i class="fas fa-house-medical" aria-hidden="true"></i>Користење здравство</a>
</div> </div>
</div> </details>
<div class="guide-cat"> <details class="guide-cat">
<div class="guide-cat-head"> <summary class="guide-cat-head">
<span class="guide-cat-num">4</span> <span class="guide-cat-num">4</span>
<div class="guide-cat-heading"> <div class="guide-cat-heading">
<h3><i class="fas fa-suitcase-rolling" aria-hidden="true"></i>Преселба и снаоѓање</h3> <h3><i class="fas fa-suitcase-rolling" aria-hidden="true"></i>Преселба и снаоѓање</h3>
<p>Сместување, пакување, пристигнување и администрацијата што отклучува сè друго.</p> <p>Сместување, пакување, пристигнување и администрацијата што отклучува сè друго.</p>
</div> </div>
</div> <i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links"> <div class="guide-cat-links">
<a class="guide-quicklink" href="student-accommodation/"><i class="fas fa-house" aria-hidden="true"></i>Сместување</a> <a class="guide-quicklink" href="student-accommodation/"><i class="fas fa-house" aria-hidden="true"></i>Сместување</a>
<a class="guide-quicklink" href="prepare-to-move/"><i class="fas fa-suitcase-rolling" aria-hidden="true"></i>Патување и пакување</a> <a class="guide-quicklink" href="prepare-to-move/"><i class="fas fa-suitcase-rolling" aria-hidden="true"></i>Патување и пакување</a>
<a class="guide-quicklink" href="arrival-checklist/"><i class="fas fa-list-check" aria-hidden="true"></i>Листа по пристигнување</a> <a class="guide-quicklink" href="arrival-checklist/"><i class="fas fa-list-check" aria-hidden="true"></i>Листа по пристигнување</a>
<a class="guide-quicklink" href="administrative-basics/"><i class="fas fa-gears" aria-hidden="true"></i>Основна администрација (EMŠO, данок, банка)</a> <a class="guide-quicklink" href="administrative-basics/"><i class="fas fa-gears" aria-hidden="true"></i>Основна администрација (EMŠO, данок, банка)</a>
</div> </div>
</div> </details>
<div class="guide-cat"> <details class="guide-cat">
<div class="guide-cat-head"> <summary class="guide-cat-head">
<span class="guide-cat-num">5</span> <span class="guide-cat-num">5</span>
<div class="guide-cat-heading"> <div class="guide-cat-heading">
<h3><i class="fas fa-mug-hot" aria-hidden="true"></i>Секојдневен студентски живот</h3> <h3><i class="fas fa-mug-hot" aria-hidden="true"></i>Секојдневен студентски живот</h3>
<p>Исхрана, превоз, работа, буџет, студирање и наоѓање на заедницата.</p> <p>Исхрана, превоз, работа, буџет, студирање и наоѓање на заедницата.</p>
</div> </div>
</div> <i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links"> <div class="guide-cat-links">
<a class="guide-quicklink" href="student-meals/"><i class="fas fa-utensils" aria-hidden="true"></i>Студентска исхрана</a> <a class="guide-quicklink" href="student-meals/"><i class="fas fa-utensils" aria-hidden="true"></i>Студентска исхрана</a>
<a class="guide-quicklink" href="student-transport/"><i class="fas fa-bus" aria-hidden="true"></i>Студентски превоз</a> <a class="guide-quicklink" href="student-transport/"><i class="fas fa-bus" aria-hidden="true"></i>Студентски превоз</a>
@ -306,20 +339,21 @@
<a class="guide-quicklink" href="wellbeing-and-community/"><i class="fas fa-hands-holding-circle" aria-hidden="true"></i>Благосостојба и заедница</a> <a class="guide-quicklink" href="wellbeing-and-community/"><i class="fas fa-hands-holding-circle" aria-hidden="true"></i>Благосостојба и заедница</a>
<a class="guide-quicklink" href="student-organisations-and-extracurriculars/"><i class="fas fa-people-group" aria-hidden="true"></i>Студентски организации</a> <a class="guide-quicklink" href="student-organisations-and-extracurriculars/"><i class="fas fa-people-group" aria-hidden="true"></i>Студентски организации</a>
</div> </div>
</div> </details>
<div class="guide-cat"> <details class="guide-cat">
<div class="guide-cat-head"> <summary class="guide-cat-head">
<span class="guide-cat-num">6</span> <span class="guide-cat-num">6</span>
<div class="guide-cat-heading"> <div class="guide-cat-heading">
<h3><i class="fas fa-arrows-rotate" aria-hidden="true"></i>По првата година</h3> <h3><i class="fas fa-arrows-rotate" aria-hidden="true"></i>По првата година</h3>
<p>Обнова, промена или дипломирање, плус официјалните извори на кои да им верувате.</p> <p>Обнова, промена или дипломирање, плус официјалните извори на кои да им верувате.</p>
</div> </div>
</div> <i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links"> <div class="guide-cat-links">
<a class="guide-quicklink" href="renew-change-graduate/"><i class="fas fa-arrows-rotate" aria-hidden="true"></i>Обнова и дипломирање</a> <a class="guide-quicklink" href="renew-change-graduate/"><i class="fas fa-arrows-rotate" aria-hidden="true"></i>Обнова и дипломирање</a>
<a class="guide-quicklink" href="official-sources-and-checklists/"><i class="fas fa-list-ul" aria-hidden="true"></i>Официјални извори</a> <a class="guide-quicklink" href="official-sources-and-checklists/"><i class="fas fa-list-ul" aria-hidden="true"></i>Официјални извори</a>
</div> </div>
</div> </details>
</div> </div>
</section> </section>

View File

@ -222,31 +222,61 @@
<section class="guide-section"> <section class="guide-section">
<h2>Poiščite svojo pot skozi vodnik</h2> <h2>Poiščite svojo pot skozi vodnik</h2>
<p class="guide-section-sub">Vodnik sledi vaši poti v šestih fazah, od izbire programa do vsakdana v Sloveniji. Odprite fazo, v kateri ste, ali zgoraj uporabite Prikaži mojo pot za osebni seznam.</p> <p class="guide-section-sub">Večina študentov začne s spodnjimi osnovami. Odprite fazo in si oglejte vse v njej.</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">Vaša pot</span>
<span class="guide-featured-sub">Celotna pot na enem mestu</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">Roki</span>
<span class="guide-featured-sub">Kaj se kdaj zapre</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">Prijava (eVŠ)</span>
<span class="guide-featured-sub">Vpis korak za korakom</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">Dovoljenje za prebivanje</span>
<span class="guide-featured-sub">Vaša pravica do bivanja</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">Nastanitev</span>
<span class="guide-featured-sub">Iskanje nastanitve</span>
</a>
</div>
<p class="guide-browse-label">Prebrskajte po fazah</p>
<div class="guide-cats"> <div class="guide-cats">
<div class="guide-cat"> <details class="guide-cat" open>
<div class="guide-cat-head"> <summary class="guide-cat-head">
<span class="guide-cat-num">1</span> <span class="guide-cat-num">1</span>
<div class="guide-cat-heading"> <div class="guide-cat-heading">
<h3><i class="fas fa-compass" aria-hidden="true"></i>Začnite tukaj: raziščite in se odločite</h3> <h3><i class="fas fa-compass" aria-hidden="true"></i>Začnite tukaj: raziščite in se odločite</h3>
<p>Poglejte celotno pot, nato izberite program, mesto in preverite stroške.</p> <p>Poglejte celotno pot, nato izberite program, mesto in preverite stroške.</p>
</div> </div>
</div> <i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links"> <div class="guide-cat-links">
<a class="guide-quicklink" href="complete-student-journey/"><i class="fas fa-route" aria-hidden="true"></i>Celotna pot</a> <a class="guide-quicklink" href="complete-student-journey/"><i class="fas fa-route" aria-hidden="true"></i>Celotna pot</a>
<a class="guide-quicklink" href="choose-a-programme/"><i class="fas fa-compass" aria-hidden="true"></i>Izbira programa</a> <a class="guide-quicklink" href="choose-a-programme/"><i class="fas fa-compass" aria-hidden="true"></i>Izbira programa</a>
<a class="guide-quicklink" href="study-cities/"><i class="fas fa-city" aria-hidden="true"></i>Študijska mesta</a> <a class="guide-quicklink" href="study-cities/"><i class="fas fa-city" aria-hidden="true"></i>Študijska mesta</a>
<a class="guide-quicklink" href="tuition-and-scholarships/"><i class="fas fa-money-bill-wave" aria-hidden="true"></i>Šolnina in štipendije</a> <a class="guide-quicklink" href="tuition-and-scholarships/"><i class="fas fa-money-bill-wave" aria-hidden="true"></i>Šolnina in štipendije</a>
</div> </div>
</div> </details>
<div class="guide-cat"> <details class="guide-cat">
<div class="guide-cat-head"> <summary class="guide-cat-head">
<span class="guide-cat-num">2</span> <span class="guide-cat-num">2</span>
<div class="guide-cat-heading"> <div class="guide-cat-heading">
<h3><i class="fas fa-file-lines" aria-hidden="true"></i>Prijava na študij</h3> <h3><i class="fas fa-file-lines" aria-hidden="true"></i>Prijava na študij</h3>
<p>Roki, prijava prek eVŠ, priznavanje, dokumenti in vpis.</p> <p>Roki, prijava prek eVŠ, priznavanje, dokumenti in vpis.</p>
</div> </div>
</div> <i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links"> <div class="guide-cat-links">
<a class="guide-quicklink" href="application-deadlines/"><i class="fas fa-calendar-day" aria-hidden="true"></i>Trenutni roki</a> <a class="guide-quicklink" href="application-deadlines/"><i class="fas fa-calendar-day" aria-hidden="true"></i>Trenutni roki</a>
<a class="guide-quicklink" href="bachelor-application/"><i class="fas fa-graduation-cap" aria-hidden="true"></i>Dodiplomska prijava</a> <a class="guide-quicklink" href="bachelor-application/"><i class="fas fa-graduation-cap" aria-hidden="true"></i>Dodiplomska prijava</a>
@ -256,15 +286,16 @@
<a class="guide-quicklink" href="document-preparation/"><i class="fas fa-folder-open" aria-hidden="true"></i>Priprava dokumentov</a> <a class="guide-quicklink" href="document-preparation/"><i class="fas fa-folder-open" aria-hidden="true"></i>Priprava dokumentov</a>
<a class="guide-quicklink" href="admission-and-enrolment/"><i class="fas fa-clipboard-check" aria-hidden="true"></i>Sprejem in vpis</a> <a class="guide-quicklink" href="admission-and-enrolment/"><i class="fas fa-clipboard-check" aria-hidden="true"></i>Sprejem in vpis</a>
</div> </div>
</div> </details>
<div class="guide-cat"> <details class="guide-cat">
<div class="guide-cat-head"> <summary class="guide-cat-head">
<span class="guide-cat-num">3</span> <span class="guide-cat-num">3</span>
<div class="guide-cat-heading"> <div class="guide-cat-heading">
<h3><i class="fas fa-passport" aria-hidden="true"></i>Prebivanje in zdravstvo</h3> <h3><i class="fas fa-passport" aria-hidden="true"></i>Prebivanje in zdravstvo</h3>
<p>Vaša zakonita pravica do bivanja za celo leto in dostop do zdravstva.</p> <p>Vaša zakonita pravica do bivanja za celo leto in dostop do zdravstva.</p>
</div> </div>
</div> <i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links"> <div class="guide-cat-links">
<a class="guide-quicklink" href="visa-and-residence-explained/"><i class="fas fa-passport" aria-hidden="true"></i>Vizum in prebivanje</a> <a class="guide-quicklink" href="visa-and-residence-explained/"><i class="fas fa-passport" aria-hidden="true"></i>Vizum in prebivanje</a>
<a class="guide-quicklink" href="student-residence-permit/"><i class="fas fa-id-card" aria-hidden="true"></i>Dovoljenje za prebivanje</a> <a class="guide-quicklink" href="student-residence-permit/"><i class="fas fa-id-card" aria-hidden="true"></i>Dovoljenje za prebivanje</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>Zdravstveno zavarovanje (RM/SI 3)</a> <a class="guide-quicklink" href="rm-si-3-health-insurance/"><i class="fas fa-heart-pulse" aria-hidden="true"></i>Zdravstveno zavarovanje (RM/SI 3)</a>
<a class="guide-quicklink" href="healthcare-in-slovenia/"><i class="fas fa-house-medical" aria-hidden="true"></i>Uporaba zdravstva</a> <a class="guide-quicklink" href="healthcare-in-slovenia/"><i class="fas fa-house-medical" aria-hidden="true"></i>Uporaba zdravstva</a>
</div> </div>
</div> </details>
<div class="guide-cat"> <details class="guide-cat">
<div class="guide-cat-head"> <summary class="guide-cat-head">
<span class="guide-cat-num">4</span> <span class="guide-cat-num">4</span>
<div class="guide-cat-heading"> <div class="guide-cat-heading">
<h3><i class="fas fa-suitcase-rolling" aria-hidden="true"></i>Selitev in ureditev</h3> <h3><i class="fas fa-suitcase-rolling" aria-hidden="true"></i>Selitev in ureditev</h3>
<p>Nastanitev, pakiranje, prihod in administracija, ki odklene vse drugo.</p> <p>Nastanitev, pakiranje, prihod in administracija, ki odklene vse drugo.</p>
</div> </div>
</div> <i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links"> <div class="guide-cat-links">
<a class="guide-quicklink" href="student-accommodation/"><i class="fas fa-house" aria-hidden="true"></i>Nastanitev</a> <a class="guide-quicklink" href="student-accommodation/"><i class="fas fa-house" aria-hidden="true"></i>Nastanitev</a>
<a class="guide-quicklink" href="prepare-to-move/"><i class="fas fa-suitcase-rolling" aria-hidden="true"></i>Selitev in pakiranje</a> <a class="guide-quicklink" href="prepare-to-move/"><i class="fas fa-suitcase-rolling" aria-hidden="true"></i>Selitev in pakiranje</a>
<a class="guide-quicklink" href="arrival-checklist/"><i class="fas fa-list-check" aria-hidden="true"></i>Kontrolni seznam ob prihodu</a> <a class="guide-quicklink" href="arrival-checklist/"><i class="fas fa-list-check" aria-hidden="true"></i>Kontrolni seznam ob prihodu</a>
<a class="guide-quicklink" href="administrative-basics/"><i class="fas fa-gears" aria-hidden="true"></i>Osnovna administracija (EMŠO, davčna, banka)</a> <a class="guide-quicklink" href="administrative-basics/"><i class="fas fa-gears" aria-hidden="true"></i>Osnovna administracija (EMŠO, davčna, banka)</a>
</div> </div>
</div> </details>
<div class="guide-cat"> <details class="guide-cat">
<div class="guide-cat-head"> <summary class="guide-cat-head">
<span class="guide-cat-num">5</span> <span class="guide-cat-num">5</span>
<div class="guide-cat-heading"> <div class="guide-cat-heading">
<h3><i class="fas fa-mug-hot" aria-hidden="true"></i>Vsakdanje študentsko življenje</h3> <h3><i class="fas fa-mug-hot" aria-hidden="true"></i>Vsakdanje študentsko življenje</h3>
<p>Prehrana, prevoz, delo, proračun, študij in iskanje skupnosti.</p> <p>Prehrana, prevoz, delo, proračun, študij in iskanje skupnosti.</p>
</div> </div>
</div> <i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links"> <div class="guide-cat-links">
<a class="guide-quicklink" href="student-meals/"><i class="fas fa-utensils" aria-hidden="true"></i>Študentska prehrana</a> <a class="guide-quicklink" href="student-meals/"><i class="fas fa-utensils" aria-hidden="true"></i>Študentska prehrana</a>
<a class="guide-quicklink" href="student-transport/"><i class="fas fa-bus" aria-hidden="true"></i>Študentski prevoz</a> <a class="guide-quicklink" href="student-transport/"><i class="fas fa-bus" aria-hidden="true"></i>Študentski prevoz</a>
@ -306,20 +339,21 @@
<a class="guide-quicklink" href="wellbeing-and-community/"><i class="fas fa-hands-holding-circle" aria-hidden="true"></i>Dobro počutje in skupnost</a> <a class="guide-quicklink" href="wellbeing-and-community/"><i class="fas fa-hands-holding-circle" aria-hidden="true"></i>Dobro počutje in skupnost</a>
<a class="guide-quicklink" href="student-organisations-and-extracurriculars/"><i class="fas fa-people-group" aria-hidden="true"></i>Študentske organizacije</a> <a class="guide-quicklink" href="student-organisations-and-extracurriculars/"><i class="fas fa-people-group" aria-hidden="true"></i>Študentske organizacije</a>
</div> </div>
</div> </details>
<div class="guide-cat"> <details class="guide-cat">
<div class="guide-cat-head"> <summary class="guide-cat-head">
<span class="guide-cat-num">6</span> <span class="guide-cat-num">6</span>
<div class="guide-cat-heading"> <div class="guide-cat-heading">
<h3><i class="fas fa-arrows-rotate" aria-hidden="true"></i>Po prvem letu</h3> <h3><i class="fas fa-arrows-rotate" aria-hidden="true"></i>Po prvem letu</h3>
<p>Podaljšanje, sprememba ali diplomiranje ter zanesljivi uradni viri.</p> <p>Podaljšanje, sprememba ali diplomiranje ter zanesljivi uradni viri.</p>
</div> </div>
</div> <i class="fas fa-chevron-down guide-cat-caret" aria-hidden="true"></i>
</summary>
<div class="guide-cat-links"> <div class="guide-cat-links">
<a class="guide-quicklink" href="renew-change-graduate/"><i class="fas fa-arrows-rotate" aria-hidden="true"></i>Podaljšanje in diplomiranje</a> <a class="guide-quicklink" href="renew-change-graduate/"><i class="fas fa-arrows-rotate" aria-hidden="true"></i>Podaljšanje in diplomiranje</a>
<a class="guide-quicklink" href="official-sources-and-checklists/"><i class="fas fa-list-ul" aria-hidden="true"></i>Uradni viri</a> <a class="guide-quicklink" href="official-sources-and-checklists/"><i class="fas fa-list-ul" aria-hidden="true"></i>Uradni viri</a>
</div> </div>
</div> </details>
</div> </div>
</section> </section>