UI/UX improvements: unified logo size, mobile optimizations, grid layout restructure
Deploy to Development and Production / deploy (push) Successful in 15s
Deploy to Development and Production / deploy (push) Successful in 15s
- Fixed logo size inconsistency across devices (unified to 44px) - Restructured homepage hero section with grid-template-areas for better layout control - Desktop: 3-column layout (welcome | image | sidebar) with recommendation box under image - Mobile: optimized order (image -> welcome -> recommendations -> info -> sidebar) - Added mobile text alignment optimizations (center for h1, left for descriptions) - Updated Medkulturno posredovanje page with justified text on mobile - Fixed Ponudba page free consultation notice alignment on mobile - Moved recommendation box to align with hero section bottom - Changed 'Svetovalno / preventivno' to 'Svetovalno medkulturno posredovanje' - Fixed star icon alignment in 'Zakaj izbrati Prosberry' section
This commit is contained in:
1 parent
aefd9b3b53
commit
6114983af5
4 files changed
+166
-64
No files matched your search
+39
-34
@@ -107,12 +107,13 @@
|
||||
|
||||
<!-- 1. Sekcija: Glavni pozdrav (Hero) -->
|
||||
<section class="hero-new" style="overflow: visible;">
|
||||
<div class="hero-new-content" style="grid-template-columns: 1.2fr 0.8fr 200px; gap: 2rem; max-width: 1600px;">
|
||||
<div class="hero-new-text" data-aos="fade-up">
|
||||
<h1>Dobrodošli v prostoru rasti in sodelovanja</h1>
|
||||
<div class="hero-new-content">
|
||||
<!-- 1. Področje z besedilom (naslov, slogani) -->
|
||||
<div class="hero-welcome-area" data-aos="fade-up">
|
||||
<h1 id="hero-welcome">Dobrodošli v prostoru rasti in sodelovanja</h1>
|
||||
<p class="hero-slogan">PROSBERRY – mesto, kjer učenje, povezovanje in podpora postanejo enostavni!</p>
|
||||
<p class="hero-new-description">Učenje splošne in poslovne angleščine za vse starostne skupine ter podpora medkulturni integraciji v vrtcih, šolah in institucijah</p>
|
||||
<div style="background: rgba(251, 99, 57, 0.08); padding: 0.75rem 1rem; border-radius: 10px; margin: 0.75rem 0; border-left: 4px solid var(--primary-color);">
|
||||
<div class="hero-cta-box-inline">
|
||||
<p style="font-size: 0.85rem; margin-bottom: 0.5rem; color: #333; line-height: 1.4;">
|
||||
<strong>Prvo srečanje ali uvodni posvet je brezplačen in brez obveznosti.</strong> Pogovoriva se o vaših ciljih in možnostih sodelovanja.
|
||||
</p>
|
||||
@@ -121,38 +122,14 @@
|
||||
</div>
|
||||
</div>
|
||||
<p class="hero-new-slogan">Uči se angleščine, spoznaj medkulturne zgodbe in uživaj v vsakem koraku!</p>
|
||||
<div class="hero-info-box">
|
||||
<h2>Zakaj PROSBERRY?</h2>
|
||||
<p><strong>PROS</strong> simbolizira znanje, izkušnje in strokovnost, ki podpirajo rast in razvoj.</p>
|
||||
<p><strong>BERRY</strong> predstavlja raznolikost in živost, ki bogati učenje, povezovanje in medkulturne izkušnje.</p>
|
||||
<p>Tudi v jeziku in med ljudmi rastemo vsak po svoje – z različnimi potrebami, ozadji in cilji.</p>
|
||||
<p>Moj cilj je ustvariti prostor, kjer se lahko učimo, povezujemo in sodelujemo naravno, enostavno in z veseljem.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero-new-image" data-aos="fade-left" style="margin: 0;">
|
||||
<img src="assets/images/amra.webp" alt="Amra Kurešepi Zulji" width="1544" height="1920" fetchpriority="high" srcset="/assets/images/amra-320w.webp 320w, /assets/images/amra-480w.webp 480w, /assets/images/amra-767w.webp 767w, /assets/images/amra-960w.webp 960w, /assets/images/amra.webp 1544w">
|
||||
|
||||
<!-- Okvirček: Priporočamo branje -->
|
||||
<div class="recommendation-box-home">
|
||||
<h3>Priporočamo branje</h3>
|
||||
<div class="rec-list">
|
||||
<a href="/blog/clanki/2025-11-17-medkulturnost-prostor-za-rast.html" class="rec-item">
|
||||
<img src="/assets/images/blog/2025-11-17-medkulturnost-prostor-za-rast/header.png" alt="Kako medkulturnost spodbuja rast?" class="rec-thumb">
|
||||
<span>Kako medkulturnost spodbuja rast?</span>
|
||||
</a>
|
||||
<a href="/blog/clanki/2025-11-18-dojemanje-casa-tocnosti-discipline.html" class="rec-item">
|
||||
<img src="/assets/images/ikona2.png" alt="Kako se čas in disciplina razlikujeta po kulturah?" class="rec-thumb">
|
||||
<span>Kako se čas in disciplina razlikujeta po kulturah?</span>
|
||||
</a>
|
||||
<a href="/blog/clanki/2025-12-21-od-ucilnice-do-skupnosti.html" class="rec-item">
|
||||
<img src="/assets/images/ikona3.png" alt="Kako učenje ustvarja skupnost?" class="rec-thumb">
|
||||
<span>Kako učenje ustvarja skupnost?</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Panel: Aktualne delavnice (tretji stolpec) -->
|
||||
<!-- 2. Slika (Sredina na desktopu) -->
|
||||
<div class="hero-new-image" data-aos="fade-left">
|
||||
<img src="assets/images/amra.webp" alt="Amra Kurešepi Zulji" width="1544" height="1920" fetchpriority="high" srcset="/assets/images/amra-320w.webp 320w, /assets/images/amra-480w.webp 480w, /assets/images/amra-767w.webp 767w, /assets/images/amra-960w.webp 960w, /assets/images/amra.webp 1544w">
|
||||
</div>
|
||||
|
||||
<!-- 3. AKTUALNE DELAVNICE (Desno na desktopu) -->
|
||||
<div class="workshops-sidebar-inline" data-aos="fade-left" data-aos-delay="200">
|
||||
<h3>Aktualne delavnice</h3>
|
||||
<div class="workshops-sidebar-list">
|
||||
@@ -174,6 +151,34 @@
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 4. PRIPOROČAMO BRANJE (Desktop: pod sliko v sredini) -->
|
||||
<div class="recommendation-box-home">
|
||||
<h3>Priporočamo branje</h3>
|
||||
<div class="rec-list">
|
||||
<a href="/blog/clanki/2025-11-17-medkulturnost-prostor-za-rast.html" class="rec-item">
|
||||
<img src="/assets/images/blog/2025-11-17-medkulturnost-prostor-za-rast/header.png" alt="Kako medkulturnost spodbuja rast?" class="rec-thumb">
|
||||
<span>Kako medkulturnost spodbuja rast?</span>
|
||||
</a>
|
||||
<a href="/blog/clanki/2025-11-18-dojemanje-casa-tocnosti-discipline.html" class="rec-item">
|
||||
<img src="/assets/images/ikona2.png" alt="Kako se čas in disciplina razlikujeta po kulturah?" class="rec-thumb">
|
||||
<span>Kako se čas in disciplina razlikujeta po kulturah?</span>
|
||||
</a>
|
||||
<a href="/blog/clanki/2025-12-21-od-ucilnice-do-skupnosti.html" class="rec-item">
|
||||
<img src="/assets/images/ikona3.png" alt="Kako učenje ustvarja skupnost?" class="rec-thumb">
|
||||
<span>Kako učenje ustvarja skupnost?</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 5. ZAKAJ PROSBERRY (Desktop: pod besedilom levo) -->
|
||||
<div class="hero-info-box">
|
||||
<h2>Zakaj PROSBERRY?</h2>
|
||||
<p><strong>PROS</strong> simbolizira znanje, izkušnje in strokovnost, ki podpirajo rast in razvoj.</p>
|
||||
<p><strong>BERRY</strong> predstavlja raznolikost in živost, ki bogati učenje, povezovanje in medkulturne izkušnje.</p>
|
||||
<p>Tudi v jeziku in med ljudmi rastemo vsak po svoje – z različnimi potrebami, ozadji in cilji.</p>
|
||||
<p>Moj cilj je ustvariti prostor, kjer se lahko učimo, povezujemo in sodelujemo naravno, enostavno in z veseljem.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Dekorativni elementi v ozadju -->
|
||||
<div class="bg-shape shape-1"></div>
|
||||
|
||||
Reference in new issue
Block a user