Posodobljeni meniji pri clankih
Deploy to Production on Develop Push / deploy (push) Successful in 1m15s
Details
Deploy to Production on Develop Push / deploy (push) Successful in 1m15s
Details
This commit is contained in:
Mark Poljanšek
parent
90055985fd
commit
28c097a959
4609
code_export.txt
4609
code_export.txt
File diff suppressed because it is too large
Load Diff
|
|
@ -10,8 +10,8 @@
|
|||
|
||||
/* 1. Temeljni stili */
|
||||
|
||||
html, body {
|
||||
overflow-x: hidden; /* Preprečuje horizontalno drsenje na najvišji ravni */
|
||||
html {
|
||||
/* To je pomembno, da ostane prazno ali brez overflow-x: hidden */
|
||||
}
|
||||
|
||||
body {
|
||||
|
|
@ -19,6 +19,7 @@ body {
|
|||
margin: 0;
|
||||
background-color: #FFFFFF;
|
||||
color: #101828;
|
||||
overflow-x: hidden; /* Preprečuje horizontalno drsenje na telesu strani */
|
||||
}
|
||||
|
||||
/* NOVO (zamenjaj znotraj _base.css): */
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
/* css/pages/_article.css */
|
||||
|
||||
/* ==========================================================================
|
||||
Single Article/Project Page Specific Styles
|
||||
========================================================================== */
|
||||
|
|
@ -6,29 +8,194 @@
|
|||
* Ta datoteka vsebuje stile, ki se uporabljajo izključno na strani s
|
||||
* posameznim člankom ali projektom.
|
||||
*
|
||||
* 1. Glavna postavitev strani članka
|
||||
* 2. Glava članka (naslov, podnaslov, datum)
|
||||
* 3. Glavna slika in slike v vsebini
|
||||
* 4. Telo članka (vsebina, tipografija, citati)
|
||||
* 5. Noga članka (avtor, deljenje)
|
||||
* 6. Poziv k prijavi na novice (CTA)
|
||||
* 7. Stili za stran s člankom na mobilnih napravah
|
||||
* 1. Glavna postavitev strani članka (z levo navigacijo)
|
||||
* 2. Lepljiva leva navigacija (Scrollspy - Desktop)
|
||||
* 3. Lepljiva zgornja vrstica z naslovom in progress barom (Mobile)
|
||||
* 4. Glava članka (naslov, podnaslov, datum)
|
||||
* 5. Glavna slika in slike v vsebini
|
||||
* 6. Telo članka (vsebina, tipografija, citati)
|
||||
* 7. Noga članka (avtor, deljenje)
|
||||
* 8. Poziv k prijavi na novice (CTA)
|
||||
* 9. Stili za stran s člankom na mobilnih napravah
|
||||
*/
|
||||
|
||||
/* 1. Glavna postavitev strani članka */
|
||||
/* ==========================================================================
|
||||
1. Glavna postavitev strani članka
|
||||
========================================================================== */
|
||||
|
||||
.article-page {
|
||||
padding-top: 80px;
|
||||
background: #FFFFFF;
|
||||
}
|
||||
|
||||
.article-container {
|
||||
max-width: 1024px;
|
||||
.article-layout-container {
|
||||
display: flex;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
padding: 96px 32px;
|
||||
padding: 0 32px;
|
||||
gap: 64px;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
/* 2. Glava članka */
|
||||
.article-container {
|
||||
flex-grow: 1;
|
||||
min-width: 0;
|
||||
padding: 96px 0;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
2. Lepljiva leva navigacija (Scrollspy - Desktop) - POSODOBLJENO
|
||||
========================================================================== */
|
||||
|
||||
.article-sidebar {
|
||||
width: 288px;
|
||||
flex-shrink: 0;
|
||||
position: sticky;
|
||||
top: 120px;
|
||||
height: calc(100vh - 140px);
|
||||
margin-top: 48px; /* NOVO: Doda začetni odmik od vrha */
|
||||
}
|
||||
|
||||
.scrollspy-nav {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.scrollspy-nav ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
border-left: 2px solid #EAECF0;
|
||||
}
|
||||
|
||||
.scrollspy-nav li a {
|
||||
display: block;
|
||||
padding: 12px 24px;
|
||||
text-decoration: none;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: #667085;
|
||||
border-left: 2px solid transparent;
|
||||
margin-left: -2px;
|
||||
transition: all 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
.scrollspy-nav li a:hover {
|
||||
color: #101828;
|
||||
background-color: #F9FAFB;
|
||||
}
|
||||
|
||||
.scrollspy-nav li a.active {
|
||||
color: #2D738C;
|
||||
font-weight: 600;
|
||||
border-left-color: #2D738C;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
3. Lepljiva zgornja vrstica (Mobile)
|
||||
========================================================================== */
|
||||
.mobile-article-header {
|
||||
display: none;
|
||||
position: sticky;
|
||||
top: 60px;
|
||||
background-color: #FFFFFF;
|
||||
z-index: 900;
|
||||
border-bottom: 1px solid #EAECF0;
|
||||
padding: 12px 24px;
|
||||
cursor: pointer;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
|
||||
.mobile-article-header .fa-chevron-down {
|
||||
transition: transform 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
.mobile-article-header.open .fa-chevron-down {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
#mobile-article-title {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #101828;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
flex-grow: 1;
|
||||
padding-right: 16px;
|
||||
}
|
||||
|
||||
.progress-bar-container {
|
||||
width: 100%;
|
||||
height: 3px;
|
||||
background-color: #EAECF0;
|
||||
position: absolute;
|
||||
bottom: -1px;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.progress-bar {
|
||||
width: 0%;
|
||||
height: 100%;
|
||||
background-color: #2D738C;
|
||||
transition: width 0.1s linear;
|
||||
}
|
||||
|
||||
.mobile-scrollspy-dropdown {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-top: 1px solid #EAECF0;
|
||||
box-shadow: 0 4px 6px rgba(0,0,0,0.05);
|
||||
max-height: 0;
|
||||
overflow: hidden;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out, visibility 0.3s;
|
||||
}
|
||||
|
||||
.mobile-scrollspy-dropdown.open {
|
||||
max-height: 50vh;
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.mobile-scrollspy-dropdown ul {
|
||||
list-style: none;
|
||||
padding: 8px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.mobile-scrollspy-dropdown a {
|
||||
display: block;
|
||||
padding: 12px 16px;
|
||||
text-decoration: none;
|
||||
color: #344054;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
border-radius: 6px;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.mobile-scrollspy-dropdown a:hover,
|
||||
.mobile-scrollspy-dropdown a.active {
|
||||
background-color: #F9FAFB;
|
||||
color: #2D738C;
|
||||
}
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
4. Glava članka
|
||||
========================================================================== */
|
||||
|
||||
.article-header {
|
||||
text-align: center;
|
||||
|
|
@ -61,7 +228,9 @@
|
|||
margin-right: auto;
|
||||
}
|
||||
|
||||
/* 3. Glavna slika in slike v vsebini */
|
||||
/* ==========================================================================
|
||||
5. Glavna slika in slike v vsebini
|
||||
========================================================================== */
|
||||
|
||||
.article-main-image {
|
||||
margin: 0 0 64px 0;
|
||||
|
|
@ -95,7 +264,9 @@
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
/* 4. Telo članka */
|
||||
/* ==========================================================================
|
||||
6. Telo članka
|
||||
========================================================================== */
|
||||
|
||||
.article-body {
|
||||
max-width: 720px;
|
||||
|
|
@ -118,6 +289,7 @@
|
|||
line-height: 38px;
|
||||
color: #101828;
|
||||
margin: 16px 0;
|
||||
scroll-margin-top: 120px;
|
||||
}
|
||||
|
||||
.article-body ol {
|
||||
|
|
@ -127,7 +299,6 @@
|
|||
gap: 12px;
|
||||
}
|
||||
|
||||
/* Stil za citat */
|
||||
.article-quote {
|
||||
margin: 16px 0;
|
||||
padding-left: 20px;
|
||||
|
|
@ -157,7 +328,9 @@
|
|||
background: transparent;
|
||||
}
|
||||
|
||||
/* 5. Noga članka */
|
||||
/* ==========================================================================
|
||||
7. Noga članka
|
||||
========================================================================== */
|
||||
|
||||
.article-footer {
|
||||
max-width: 720px;
|
||||
|
|
@ -209,7 +382,9 @@
|
|||
gap: 12px;
|
||||
}
|
||||
|
||||
/* 6. Poziv k prijavi na novice (CTA) */
|
||||
/* ==========================================================================
|
||||
8. Poziv k prijavi na novice (CTA)
|
||||
========================================================================== */
|
||||
|
||||
.newsletter-cta {
|
||||
padding: 0 32px 96px 32px;
|
||||
|
|
@ -276,15 +451,28 @@
|
|||
|
||||
|
||||
/* ==========================================================================
|
||||
Mobile Article Page Styles
|
||||
9. Mobile Article Page Styles
|
||||
========================================================================== */
|
||||
|
||||
@media (max-width: 768px) {
|
||||
|
||||
.article-page {
|
||||
padding-top: 60px;
|
||||
}
|
||||
|
||||
.article-layout-container {
|
||||
flex-direction: column;
|
||||
padding: 0;
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.article-sidebar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.mobile-article-header {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.article-container {
|
||||
padding: 48px 24px;
|
||||
}
|
||||
|
|
@ -327,6 +515,7 @@
|
|||
.article-body h2 {
|
||||
font-size: 24px;
|
||||
line-height: 32px;
|
||||
scroll-margin-top: 120px;
|
||||
}
|
||||
|
||||
.article-quote p {
|
||||
|
|
|
|||
|
|
@ -19,271 +19,295 @@
|
|||
<body>
|
||||
|
||||
<!-- START_HEADER -->
|
||||
<header class="dropdown-header-navigation">
|
||||
<div class="container">
|
||||
<!-- Logotip je zdaj samostojen element na levi strani -->
|
||||
<a href="../../../en/" class="logo-link">
|
||||
<img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
|
||||
</a>
|
||||
|
||||
<!-- Nov ovoj za vse elemente na desni strani -->
|
||||
<div class="header-right-wrapper">
|
||||
<nav>
|
||||
<ul class="navigation desktop-nav">
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">Who We Are</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="../../../en/timeline-and-milestones/">Timeline & Milestones</a></li>
|
||||
<li><a href="../../../en/about-us/">Our team, mission, vision & core values</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">What We Do</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="../../../en/projects/">Event & Projects</a></li>
|
||||
<li><a href="#">Blog</a></li>
|
||||
<li><a href="#">Gallery</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">Get Involved</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Become a member</a></li>
|
||||
<li><a href="#">Support MSOS</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">For Students</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Student Welcome Guide</a></li>
|
||||
<li><a href="#">Mentorship Programme</a></li>
|
||||
<li><a href="#">FAQs</a></li>
|
||||
<li><a href="#">Get to know Slovenia</a></li>
|
||||
<li><a href="#">Get to know North Macedonia</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">News</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Announcements</a></li>
|
||||
<li><a href="#">Open calls</a></li>
|
||||
<li><a href="#">Press releases</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="navigation-actions">
|
||||
<button class="btn btn-secondary">Become a member</button>
|
||||
<button class="btn btn-primary">Donate</button>
|
||||
<div class="language-selector">
|
||||
<div class="current-lang">
|
||||
<i class="fas fa-globe"></i>
|
||||
<span id="current-lang-code">EN</span>
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
</div>
|
||||
<div class="lang-dropdown">
|
||||
<a href="#" data-lang="si">Slovenščina (SI)</a>
|
||||
<a href="#" data-lang="en">English (EN)</a>
|
||||
<a href="#" data-lang="mk">Македонски (MK)</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Ikona za mobilni meni ostaja ločena za lažje upravljanje -->
|
||||
<div class="mobile-menu-icon">
|
||||
<i class="fas fa-bars"></i>
|
||||
<i class="fas fa-times"></i>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- Panel za mobilno navigacijo (struktura ostaja enaka) -->
|
||||
<div class="mobile-nav-panel">
|
||||
<nav>
|
||||
<ul class="navigation mobile-nav">
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">Who We Are</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="../../../en/timeline-and-milestones/">Timeline & Milestones</a></li>
|
||||
<li><a href="../../../en/about-us/">Our team, mission, vision & core values</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">What We Do</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="../../../en/projects/">Event & Projects</a></li>
|
||||
<li><a href="#">Blog</a></li>
|
||||
<li><a href="#">Gallery</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">Get Involved</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Become a member</a></li>
|
||||
<li><a href="#">Support MSOS</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">For Students</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Student Welcome Guide</a></li>
|
||||
<li><a href="#">Mentorship Programme</a></li>
|
||||
<li><a href="#">FAQs</a></li>
|
||||
<li><a href="#">Get to know Slovenia</a></li>
|
||||
<li><a href="#">Get to know North Macedonia</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">News</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Announcements</a></li>
|
||||
<li><a href="#">Open calls</a></li>
|
||||
<li><a href="#">Press releases</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="navigation-actions">
|
||||
<button class="btn btn-secondary">Become a member</button>
|
||||
<button class="btn btn-primary">Donate</button>
|
||||
<div class="language-selector">
|
||||
<button class="current-lang" id="mobile-lang-trigger">
|
||||
<i class="fas fa-globe"></i>
|
||||
<span>EN</span>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modalno okno za izbiro jezika (ostaja enako) -->
|
||||
<div id="language-modal-overlay">
|
||||
<div class="language-modal-content">
|
||||
<div class="language-modal-header">
|
||||
<h3>Select Language</h3>
|
||||
<button id="language-modal-close" aria-label="Close language selection">×</button>
|
||||
</div>
|
||||
<div class="language-modal-body">
|
||||
<a href="#" data-lang="si">Slovenščina (SI)</a>
|
||||
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
|
||||
<a href="#" data-lang="mk">Македонски (MK)</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- END_HEADER -->
|
||||
|
||||
<main class="article-page">
|
||||
<article class="article-container">
|
||||
<header class="article-header">
|
||||
<p class="article-publish-date">Published on September 16, 2024</p>
|
||||
<h1>Meet Student Slovenia 2024</h1>
|
||||
<p class="article-subtitle">When student stories turn into the first step towards a new home.</p>
|
||||
</header>
|
||||
|
||||
<figure class="article-main-image">
|
||||
<img src="../../../images/event4-img-1.webp" alt="A group of students at the 'Meet Student Slovenia 2024' event">
|
||||
</figure>
|
||||
|
||||
<div class="article-body">
|
||||
<p>Following the success in 2023, "Meet Student Slovenia" returned this year with even greater energy. On September 16, 2024, at the NLB Gallery in Skopje, we held the second edition of the event, which has become a true tradition. The interest was enormous – we had twice as many applications as the capacity of the venue. The atmosphere was full of excitement, questions, and a desire for new beginnings.</p>
|
||||
|
||||
<h2>"Coffee chat" with future colleagues, but on a panel discussion</h2>
|
||||
<p>Our goal was never to create "dry presentations." Instead, we organized a panel – a real conversation with four students who are already living the Slovenian student life. Marija Koštrevska from the University of Ljubljana, Vasil Hanџiski from the University of Maribor, Sofija Matovska from the University of Nova Gorica, and Igor Arsov from the University of Primorska spoke about everything: the first days away from home, how to find accommodation, what student "boni" (subsidized meals) are, and what it's like to build a new circle of friends. Everyone shared something of their own, and the audience asked questions and participated – just like a coffee chat.</p>
|
||||
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-2.webp" alt="Panel discussion with speakers">
|
||||
<figcaption>Photograph of the moderator and panelists in the following order: Klimentina Čapovska (left, moderator), Vasil Hanџiski, Marija Koštrevska, Igor Arsov, and Sofija Matovska.</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-3.webp" alt="Marija Koštrevska and Sofija Matovska sharing their student experiences in Slovenia.">
|
||||
<figcaption>Marija Koštrevska (in the upper picture) and Sofija Matovska (in the lower picture) are recounting their student experiences in Slovenia.</figcaption>
|
||||
</figure>
|
||||
|
||||
<h2>What remained behind us</h2>
|
||||
<p>This evening was not just an exchange of information. It was a moment when future students understood that they are not alone in their worries and fears. Every question received an answer from experience, every dilemma was resolved with a real-life example. Many left encouraged, with new friends, and with the feeling that Slovenia is no longer so distant and unknown.</p>
|
||||
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-4.webp" alt="Marko Ivanovski, event host">
|
||||
<figcaption>Marko Ivanovski, host of the event.</figcaption>
|
||||
</figure>
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-5.webp" alt="Lea Janačkovska, event coordinator">
|
||||
<figcaption>Lea Janačkovska, event coordinator.</figcaption>
|
||||
</figure>
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-6.webp" alt="Marko Arsov, presenter">
|
||||
<figcaption>Marko Arsov, presenter.</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-7.webp" alt="Representatives of the Embassy, the Management Board of NLB Bank and the Management Board of MSOS.">
|
||||
<figcaption>The bottom picture shows representatives of the Embassy, the Management Board of NLB Bank, and the Management Board of MSOS.</figcaption>
|
||||
</figure>
|
||||
|
||||
<h2>The support that made a difference</h2>
|
||||
<p>"Meet Student Slovenia 2024" would not have looked this way without the help of our partners and friends. We extend great gratitude to the Embassy of the Republic of Slovenia in North Macedonia, NLB Bank Skopje as the patron and main sponsor of the entire event, and Capital Financial Center, who with their support made it possible for the event to be realized at this high level.</p>
|
||||
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-8.webp" alt="Newly printed MSOS stickers">
|
||||
<figcaption>Photograph of the newly printed MSOS stickers.</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-9.webp" alt="Handing over flowers as a thank you to the Embassy, Capital Financial Center and NLB Bank Skopje">
|
||||
<figcaption>Photograph from the handing over of flowers as a sign of gratitude to the Embassy, Capital Financial Center, and NLB Bank Skopje.</figcaption>
|
||||
</figure>
|
||||
|
||||
<p>Special thanks go to the MSOS team, who worked tirelessly for weeks on preparations – from the initial idea to the last detail of the evening. Above all, great recognition goes to Lea Janačkovska, the event coordinator, who with her energy, patience, and organizational skills ensured that every piece fell into place.</p>
|
||||
<p>This time, the memories of the evening are thanks to Hristina Trakovska, who was the photographer and made sure all those moments were captured so we can relive them again through photographs.</p>
|
||||
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-10.webp" alt="Welcome speech by H.E. Ambassador Mr. Gregor Presker.">
|
||||
<figcaption>Photograph of the welcome speech by H.E. Ambassador Mr. Gregor Presker.</figcaption>
|
||||
</figure>
|
||||
|
||||
<h2>Why was it special?</h2>
|
||||
<p>Because this event was not just another presentation. It was a hand extended to future students – a message that they are not alone, that a community is already waiting for them. Some left with new friends, others with concrete answers to questions that had bothered them for months. But everyone left with the same feeling: that Slovenia is no longer an unknown place, but a new home where they will be part of something bigger.</p>
|
||||
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-11.webp" alt="Attendees asking questions to the panelists">
|
||||
<figcaption>Moments when the participants ask questions to the panelists!😊✨</figcaption>
|
||||
</figure>
|
||||
|
||||
<h2>For those who were not physically present with us</h2>
|
||||
<p>We know that not everyone managed to attend the NLB Gallery, but we therefore provided a high-quality livestream. The event was broadcast live and is now available for re-watching. If you want to feel the atmosphere and hear the honest stories from the panel, you can watch the entire event at this link <a href="#">Watch the video here.</a></p>
|
||||
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-12.webp" alt="Poster for the 'Meet Student Slovenia' event">
|
||||
<figcaption>Photograph of the event poster!</figcaption>
|
||||
</figure>
|
||||
|
||||
<h2>See you in Slovenia!</h2>
|
||||
<p>"Meet Student Slovenia" is not just an event. It is a place where future students take their first step – with support, with first-hand advice, and with the feeling that they are not alone. And this year we managed to create that feeling, and that is the greatest victory.</p>
|
||||
<p>See you again next year!</p>
|
||||
<p>P.S. Every year after a successfully organized event, the MSOS team traditionally heads to the nearest tavern, for an evening full of socializing, singing, and emotions! 😊 That's why it's worth being part of our team! Join us.</p>
|
||||
</div>
|
||||
|
||||
<footer class="article-footer">
|
||||
<hr>
|
||||
<div class="author-share-section">
|
||||
<div class="author-details">
|
||||
<img src="../../../images/11-boy.webp" alt="Avatar of Kristijan Popovski">
|
||||
<div class="author-text">
|
||||
<p class="author-name">Kristijan Popovski</p>
|
||||
<p class="author-title">President and Founder</p>
|
||||
<header class="dropdown-header-navigation">
|
||||
<div class="container">
|
||||
<a href="../../../en/" class="logo-link">
|
||||
<img src="../../../images/1-logo.png" alt="Macedonian Student Organisation in Slovenia Logo" class="logo-img">
|
||||
</a>
|
||||
<div class="header-right-wrapper">
|
||||
<nav>
|
||||
<ul class="navigation desktop-nav">
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">Who We Are</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="../../../en/timeline-and-milestones/">Timeline & Milestones</a></li>
|
||||
<li><a href="../../../en/about-us/">Our team, mission, vision & core values</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">What We Do</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="../../../en/projects/">Event & Projects</a></li>
|
||||
<li><a href="#">Blog</a></li>
|
||||
<li><a href="#">Gallery</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">Get Involved</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Become a member</a></li>
|
||||
<li><a href="#">Support MSOS</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">For Students</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Student Welcome Guide</a></li>
|
||||
<li><a href="#">Mentorship Programme</a></li>
|
||||
<li><a href="#">FAQs</a></li>
|
||||
<li><a href="#">Get to know Slovenia</a></li>
|
||||
<li><a href="#">Get to know North Macedonia</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">News</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Announcements</a></li>
|
||||
<li><a href="#">Open calls</a></li>
|
||||
<li><a href="#">Press releases</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="navigation-actions">
|
||||
<button class="btn btn-secondary">Become a member</button>
|
||||
<button class="btn btn-primary">Donate</button>
|
||||
<div class="language-selector">
|
||||
<div class="current-lang">
|
||||
<i class="fas fa-globe"></i>
|
||||
<span id="current-lang-code">EN</span>
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
</div>
|
||||
<div class="lang-dropdown">
|
||||
<a href="#" data-lang="si">Slovenščina (SI)</a>
|
||||
<a href="#" data-lang="en">English (EN)</a>
|
||||
<a href="#" data-lang="mk">Македонски (MK)</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="share-buttons">
|
||||
<button class="btn btn-secondary"><i class="fas fa-link"></i> Copy link</button>
|
||||
<a href="#" class="social-icon-btn" aria-label="Share on Twitter"><i class="fab fa-twitter"></i></a>
|
||||
<a href="#" class="social-icon-btn" aria-label="Share on Facebook"><i class="fab fa-facebook-f"></i></a>
|
||||
<a href="#" class="social-icon-btn" aria-label="Share on LinkedIn"><i class="fab fa-linkedin-in"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</article>
|
||||
</div>
|
||||
<div class="mobile-menu-icon">
|
||||
<i class="fas fa-bars"></i>
|
||||
<i class="fas fa-times"></i>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="mobile-nav-panel">
|
||||
<nav>
|
||||
<ul class="navigation mobile-nav">
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">Who We Are</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="../../../en/timeline-and-milestones/">Timeline & Milestones</a></li>
|
||||
<li><a href="../../../en/about-us/">Our team, mission, vision & core values</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">What We Do</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="../../../en/projects/">Event & Projects</a></li>
|
||||
<li><a href="#">Blog</a></li>
|
||||
<li><a href="#">Gallery</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">Get Involved</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Become a member</a></li>
|
||||
<li><a href="#">Support MSOS</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">For Students</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Student Welcome Guide</a></li>
|
||||
<li><a href="#">Mentorship Programme</a></li>
|
||||
<li><a href="#">FAQs</a></li>
|
||||
<li><a href="#">Get to know Slovenia</a></li>
|
||||
<li><a href="#">Get to know North Macedonia</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="menu-item menu-item-has-children">
|
||||
<a href="#">News</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Announcements</a></li>
|
||||
<li><a href="#">Open calls</a></li>
|
||||
<li><a href="#">Press releases</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="navigation-actions">
|
||||
<button class="btn btn-secondary">Become a member</button>
|
||||
<button class="btn btn-primary">Donate</button>
|
||||
<div class="language-selector">
|
||||
<button class="current-lang" id="mobile-lang-trigger">
|
||||
<i class="fas fa-globe"></i>
|
||||
<span>EN</span>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="language-modal-overlay">
|
||||
<div class="language-modal-content">
|
||||
<div class="language-modal-header">
|
||||
<h3>Select Language</h3>
|
||||
<button id="language-modal-close" aria-label="Close language selection">×</button>
|
||||
</div>
|
||||
<div class="language-modal-body">
|
||||
<a href="#" data-lang="si">Slovenščina (SI)</a>
|
||||
<a href="#" data-lang="en" class="active-lang">English (EN)</a>
|
||||
<a href="#" data-lang="mk">Македонски (MK)</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- END_HEADER -->
|
||||
|
||||
<main class="article-page">
|
||||
<!-- Sticky Mobile Header -->
|
||||
<div class="mobile-article-header">
|
||||
<span id="mobile-article-title">Meet Student Slovenia 2024</span>
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
<div class="progress-bar-container">
|
||||
<div class="progress-bar"></div>
|
||||
</div>
|
||||
<!-- Dropdown Menu for Mobile -->
|
||||
<div class="mobile-scrollspy-dropdown">
|
||||
<ul id="mobile-scrollspy-links">
|
||||
<!-- Links will be dynamically inserted here by JavaScript -->
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="article-layout-container">
|
||||
<!-- Desktop Scrollspy Sidebar -->
|
||||
<aside class="article-sidebar">
|
||||
<nav class="scrollspy-nav">
|
||||
<ul>
|
||||
<li><a href="#coffee-chat" class="active">"Coffee chat" with future colleagues</a></li>
|
||||
<li><a href="#what-remained">What remained behind us</a></li>
|
||||
<li><a href="#the-support">The support that made a difference</a></li>
|
||||
<li><a href="#why-special">Why was it special?</a></li>
|
||||
<li><a href="#livestream">For those not physically present</a></li>
|
||||
<li><a href="#see-you">See you in Slovenia!</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</aside>
|
||||
|
||||
<article class="article-container">
|
||||
<header class="article-header">
|
||||
<p class="article-publish-date">Published on September 16, 2024</p>
|
||||
<h1>Meet Student Slovenia 2024</h1>
|
||||
<p class="article-subtitle">When student stories turn into the first step towards a new home.</p>
|
||||
</header>
|
||||
|
||||
<figure class="article-main-image">
|
||||
<img src="../../../images/event4-img-1.webp" alt="A group of students at the 'Meet Student Slovenia 2024' event">
|
||||
</figure>
|
||||
|
||||
<div class="article-body">
|
||||
<p>Following the success in 2023, "Meet Student Slovenia" returned this year with even greater energy. On September 16, 2024, at the NLB Gallery in Skopje, we held the second edition of the event, which has become a true tradition. The interest was enormous – we had twice as many applications as the capacity of the venue. The atmosphere was full of excitement, questions, and a desire for new beginnings.</p>
|
||||
|
||||
<h2 id="coffee-chat">"Coffee chat" with future colleagues, but on a panel discussion</h2>
|
||||
<p>Our goal was never to create "dry presentations." Instead, we organized a panel – a real conversation with four students who are already living the Slovenian student life. Marija Koštrevska from the University of Ljubljana, Vasil Hanџiski from the University of Maribor, Sofija Matovska from the University of Nova Gorica, and Igor Arsov from the University of Primorska spoke about everything: the first days away from home, how to find accommodation, what student "boni" (subsidized meals) are, and what it's like to build a new circle of friends. Everyone shared something of their own, and the audience asked questions and participated – just like a coffee chat.</p>
|
||||
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-2.webp" alt="Panel discussion with speakers">
|
||||
<figcaption>Photograph of the moderator and panelists in the following order: Klimentina Čapovska (left, moderator), Vasil Hanџiski, Marija Koštrevska, Igor Arsov, and Sofija Matovska.</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-3.webp" alt="Marija Koštrevska and Sofija Matovska sharing their student experiences in Slovenia.">
|
||||
<figcaption>Marija Koštrevska (in the upper picture) and Sofija Matovska (in the lower picture) are recounting their student experiences in Slovenia.</figcaption>
|
||||
</figure>
|
||||
|
||||
<h2 id="what-remained">What remained behind us</h2>
|
||||
<p>This evening was not just an exchange of information. It was a moment when future students understood that they are not alone in their worries and fears. Every question received an answer from experience, every dilemma was resolved with a real-life example. Many left encouraged, with new friends, and with the feeling that Slovenia is no longer so distant and unknown.</p>
|
||||
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-4.webp" alt="Marko Ivanovski, event host">
|
||||
<figcaption>Marko Ivanovski, host of the event.</figcaption>
|
||||
</figure>
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-5.webp" alt="Lea Janačkovska, event coordinator">
|
||||
<figcaption>Lea Janačkovska, event coordinator.</figcaption>
|
||||
</figure>
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-6.webp" alt="Marko Arsov, presenter">
|
||||
<figcaption>Marko Arsov, presenter.</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-7.webp" alt="Representatives of the Embassy, the Management Board of NLB Bank and the Management Board of MSOS.">
|
||||
<figcaption>The bottom picture shows representatives of the Embassy, the Management Board of NLB Bank, and the Management Board of MSOS.</figcaption>
|
||||
</figure>
|
||||
|
||||
<h2 id="the-support">The support that made a difference</h2>
|
||||
<p>"Meet Student Slovenia 2024" would not have looked this way without the help of our partners and friends. We extend great gratitude to the Embassy of the Republic of Slovenia in North Macedonia, NLB Bank Skopje as the patron and main sponsor of the entire event, and Capital Financial Center, who with their support made it possible for the event to be realized at this high level.</p>
|
||||
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-8.webp" alt="Newly printed MSOS stickers">
|
||||
<figcaption>Photograph of the newly printed MSOS stickers.</figcaption>
|
||||
</figure>
|
||||
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-9.webp" alt="Handing over flowers as a thank you to the Embassy, Capital Financial Center and NLB Bank Skopje">
|
||||
<figcaption>Photograph from the handing over of flowers as a sign of gratitude to the Embassy, Capital Financial Center, and NLB Bank Skopje.</figcaption>
|
||||
</figure>
|
||||
|
||||
<p>Special thanks go to the MSOS team, who worked tirelessly for weeks on preparations – from the initial idea to the last detail of the evening. Above all, great recognition goes to Lea Janačkovska, the event coordinator, who with her energy, patience, and organizational skills ensured that every piece fell into place.</p>
|
||||
<p>This time, the memories of the evening are thanks to Hristina Trakovska, who was the photographer and made sure all those moments were captured so we can relive them again through photographs.</p>
|
||||
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-10.webp" alt="Welcome speech by H.E. Ambassador Mr. Gregor Presker.">
|
||||
<figcaption>Photograph of the welcome speech by H.E. Ambassador Mr. Gregor Presker.</figcaption>
|
||||
</figure>
|
||||
|
||||
<h2 id="why-special">Why was it special?</h2>
|
||||
<p>Because this event was not just another presentation. It was a hand extended to future students – a message that they are not alone, that a community is already waiting for them. Some left with new friends, others with concrete answers to questions that had bothered them for months. But everyone left with the same feeling: that Slovenia is no longer an unknown place, but a new home where they will be part of something bigger.</p>
|
||||
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-11.webp" alt="Attendees asking questions to the panelists">
|
||||
<figcaption>Moments when the participants ask questions to the panelists!😊✨</figcaption>
|
||||
</figure>
|
||||
|
||||
<h2 id="livestream">For those not physically present with us</h2>
|
||||
<p>We know that not everyone managed to attend the NLB Gallery, but we therefore provided a high-quality livestream. The event was broadcast live and is now available for re-watching. If you want to feel the atmosphere and hear the honest stories from the panel, you can watch the entire event at this link <a href="#">Watch the video here.</a></p>
|
||||
|
||||
<figure class="article-inline-image">
|
||||
<img src="../../../images/event4-img-12.webp" alt="Poster for the 'Meet Student Slovenia' event">
|
||||
<figcaption>Photograph of the event poster!</figcaption>
|
||||
</figure>
|
||||
|
||||
<h2 id="see-you">See you in Slovenia!</h2>
|
||||
<p>"Meet Student Slovenia" is not just an event. It is a place where future students take their first step – with support, with first-hand advice, and with the feeling that they are not alone. And this year we managed to create that feeling, and that is the greatest victory.</p>
|
||||
<p>See you again next year!</p>
|
||||
<p>P.S. Every year after a successfully organized event, the MSOS team traditionally heads to the nearest tavern, for an evening full of socializing, singing, and emotions! 😊 That's why it's worth being part of our team! Join us.</p>
|
||||
</div>
|
||||
|
||||
<footer class="article-footer">
|
||||
<hr>
|
||||
<div class="author-share-section">
|
||||
<div class="author-details">
|
||||
<img src="../../../images/11-boy.webp" alt="Avatar of Kristijan Popovski">
|
||||
<div class="author-text">
|
||||
<p class="author-name">Kristijan Popovski</p>
|
||||
<p class="author-title">President and Founder</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="share-buttons">
|
||||
<button class="btn btn-secondary"><i class="fas fa-link"></i> Copy link</button>
|
||||
<a href="#" class="social-icon-btn" aria-label="Share on Twitter"><i class="fab fa-twitter"></i></a>
|
||||
<a href="#" class="social-icon-btn" aria-label="Share on Facebook"><i class="fab fa-facebook-f"></i></a>
|
||||
<a href="#" class="social-icon-btn" aria-label="Share on LinkedIn"><i class="fab fa-linkedin-in"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
<section class="newsletter-cta">
|
||||
<div class="container">
|
||||
|
|
@ -303,60 +327,59 @@
|
|||
</main>
|
||||
|
||||
<!-- START_FOOTER -->
|
||||
<footer>
|
||||
<div class="footer-container">
|
||||
<div class="footer-main">
|
||||
<div class="footer-info">
|
||||
<div class="footer-logo">
|
||||
<img src="../../../images/13-whitelogo.png" alt="Macedonian Student Organisation in Slovenia Logo">
|
||||
<footer>
|
||||
<div class="footer-container">
|
||||
<div class="footer-main">
|
||||
<div class="footer-info">
|
||||
<div class="footer-logo">
|
||||
<img src="../../../images/13-whitelogo.png" alt="Macedonian Student Organisation in Slovenia Logo">
|
||||
</div>
|
||||
<p>
|
||||
Masarykova cesta 24<br>
|
||||
1000 Ljubljana, Slovenia<br>
|
||||
+389 02 123 4567<br>
|
||||
info.msosorg@gmail.com
|
||||
</p>
|
||||
<div class="social-icons">
|
||||
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
|
||||
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
|
||||
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
Masarykova cesta 24<br>
|
||||
1000 Ljubljana, Slovenia<br>
|
||||
+389 02 123 4567<br>
|
||||
info.msosorg@gmail.com
|
||||
</p>
|
||||
<div class="social-icons">
|
||||
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
|
||||
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
|
||||
<a href="#" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
|
||||
<div class="footer-links">
|
||||
<div class="links-column">
|
||||
<h4>For students</h4>
|
||||
<a href="#">Blog</a>
|
||||
<a href="#">Gallery</a>
|
||||
<a href="#">FAQs</a>
|
||||
<a href="#">Brochure</a>
|
||||
</div>
|
||||
<div class="links-column">
|
||||
<h4>Projects</h4>
|
||||
<a href="#">Upcoming</a>
|
||||
<a href="#">Previous</a>
|
||||
</div>
|
||||
<div class="links-column">
|
||||
<h4>Organisation</h4>
|
||||
<a href="#">About us</a>
|
||||
<a href="#">Contact</a>
|
||||
<a href="#">Documentation</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-links">
|
||||
<div class="links-column">
|
||||
<h4>For students</h4>
|
||||
<a href="#">Blog</a>
|
||||
<a href="#">Gallery</a>
|
||||
<a href="#">FAQs</a>
|
||||
<a href="#">Brochure</a>
|
||||
</div>
|
||||
<div class="links-column">
|
||||
<h4>Projects</h4>
|
||||
<a href="#">Upcoming</a>
|
||||
<a href="#">Previous</a>
|
||||
</div>
|
||||
<div class="links-column">
|
||||
<h4>Organisation</h4>
|
||||
<a href="#">About us</a>
|
||||
<a href="#">Contact</a>
|
||||
<a href="#">Documentation</a>
|
||||
<hr>
|
||||
<div class="footer-bottom">
|
||||
<p>© MSOS org 2023 All rights reserved.</p>
|
||||
<div class="legal-links">
|
||||
<a href="#">Privacy policy</a>
|
||||
<a href="#">Cookie Policy</a>
|
||||
<a href="#">Legal Terms</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="footer-bottom">
|
||||
<p>© MSOS org 2023 All rights reserved.</p>
|
||||
<div class="legal-links">
|
||||
<a href="#">Privacy policy</a>
|
||||
<a href="#">Cookie Policy</a>
|
||||
<a href="#">Legal Terms</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="../../../main.js"></script>
|
||||
</footer>
|
||||
<!-- END_FOOTER -->
|
||||
<script src="../../../main.js"></script>
|
||||
</footer>
|
||||
<!-- END_FOOTER -->
|
||||
|
||||
<script src="../../../main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 574 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 519 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 396 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 501 KiB |
106
main.js
106
main.js
|
|
@ -247,10 +247,114 @@ document.addEventListener('DOMContentLoaded', function() {
|
|||
} catch(error) {
|
||||
console.error('Error in Mission/Vision interaction setup:', error);
|
||||
}
|
||||
|
||||
/**
|
||||
* ===================================================================
|
||||
* 5. SCROLLSPY IN PROGRESS BAR ZA STRANI ČLANKOV (POSODOBLJENO)
|
||||
* ===================================================================
|
||||
*/
|
||||
try {
|
||||
const articlePage = document.querySelector('.article-page');
|
||||
if (articlePage) {
|
||||
const scrollspyNav = document.querySelector('.scrollspy-nav');
|
||||
const mobileHeader = document.querySelector('.mobile-article-header');
|
||||
const mobileTitle = document.getElementById('mobile-article-title');
|
||||
const mobileDropdown = document.querySelector('.mobile-scrollspy-dropdown');
|
||||
const mobileLinksContainer = document.getElementById('mobile-scrollspy-links');
|
||||
const progressBar = document.querySelector('.progress-bar');
|
||||
|
||||
const headings = Array.from(articlePage.querySelectorAll('.article-body h2'));
|
||||
const desktopNavLinks = scrollspyNav ? Array.from(scrollspyNav.querySelectorAll('a')) : [];
|
||||
|
||||
// --- Dinamično ustvarjanje mobilnega spustnega seznama ---
|
||||
if (headings.length > 0 && mobileLinksContainer) {
|
||||
headings.forEach(heading => {
|
||||
const listItem = document.createElement('li');
|
||||
const link = document.createElement('a');
|
||||
link.href = `#${heading.id}`;
|
||||
link.textContent = heading.textContent;
|
||||
listItem.appendChild(link);
|
||||
mobileLinksContainer.appendChild(listItem);
|
||||
});
|
||||
}
|
||||
|
||||
// --- Logika za odpiranje/zapiranje mobilnega spustnega seznama ---
|
||||
if (mobileHeader && mobileDropdown) {
|
||||
mobileHeader.addEventListener('click', (e) => {
|
||||
// Preprečimo, da se meni zapre, če kliknemo na povezavo znotraj njega
|
||||
if (!e.target.closest('a')) {
|
||||
mobileHeader.classList.toggle('open');
|
||||
mobileDropdown.classList.toggle('open');
|
||||
}
|
||||
});
|
||||
|
||||
// Dodamo dogodek za zapiranje menija ob kliku na povezavo
|
||||
mobileDropdown.querySelectorAll('a').forEach(link => {
|
||||
link.addEventListener('click', () => {
|
||||
mobileHeader.classList.remove('open');
|
||||
mobileDropdown.classList.remove('open');
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// --- Logika za Progress Bar ---
|
||||
function updateProgressBar() {
|
||||
if (!progressBar) return;
|
||||
const scrollableHeight = document.documentElement.scrollHeight - window.innerHeight;
|
||||
const scrollTop = window.scrollY;
|
||||
|
||||
if (scrollableHeight > 0) {
|
||||
const progress = (scrollTop / scrollableHeight) * 100;
|
||||
progressBar.style.width = `${progress}%`;
|
||||
} else {
|
||||
progressBar.style.width = '0%';
|
||||
}
|
||||
}
|
||||
|
||||
// --- Logika za Scrollspy ---
|
||||
if (headings.length > 0) {
|
||||
const observer = new IntersectionObserver((entries) => {
|
||||
entries.forEach(entry => {
|
||||
const id = entry.target.getAttribute('id');
|
||||
const desktopNavLink = desktopNavLinks.find(link => link.getAttribute('href') === `#${id}`);
|
||||
const mobileNavLink = mobileLinksContainer ? mobileLinksContainer.querySelector(`a[href="#${id}"]`) : null;
|
||||
|
||||
if (entry.isIntersecting) {
|
||||
// Posodobi namizno navigacijo
|
||||
if (desktopNavLink) {
|
||||
desktopNavLinks.forEach(link => link.classList.remove('active'));
|
||||
desktopNavLink.classList.add('active');
|
||||
}
|
||||
// Posodobi mobilni naslov in aktivno povezavo v spustnem seznamu
|
||||
if (mobileTitle) {
|
||||
mobileTitle.textContent = entry.target.textContent;
|
||||
}
|
||||
if (mobileNavLink) {
|
||||
mobileLinksContainer.querySelectorAll('a').forEach(link => link.classList.remove('active'));
|
||||
mobileNavLink.classList.add('active');
|
||||
}
|
||||
}
|
||||
});
|
||||
}, {
|
||||
rootMargin: "-100px 0px -50% 0px" // Sproži, ko je naslov v zgornjem delu zaslona
|
||||
});
|
||||
|
||||
headings.forEach(heading => {
|
||||
observer.observe(heading);
|
||||
});
|
||||
}
|
||||
|
||||
// Dodaj poslušalca dogodkov za vrstico napredka
|
||||
window.addEventListener('scroll', updateProgressBar);
|
||||
updateProgressBar(); // Klic ob nalaganju strani
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error in Article Scrollspy/Progress Bar setup:', error);
|
||||
}
|
||||
|
||||
/**
|
||||
* ===================================================================
|
||||
* 5. ZAGON FUNKCIJ PO NALOŽITVI STRANI
|
||||
* 6. ZAGON FUNKCIJ PO NALOŽITVI STRANI
|
||||
* ===================================================================
|
||||
*/
|
||||
highlightActiveLink();
|
||||
|
|
|
|||
Loading…
Reference in New Issue