Reserve slider layout space to eliminate CLS
Deploy to Development and Production / deploy (push) Successful in 5s

This commit is contained in:
Mark Poljanšek committed 2025-11-03 16:19:14 +01:00
1 parent 7681a62715
commit 6eeaf78cee
3 files changed
+18 -74

No files matched your search

+4 -66
View File
@@ -44,12 +44,14 @@ body {
color: var(--color-text);
background-color: var(--color-background);
line-height: 1.7;
font-size-adjust: 0.5;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/* Ta blok je bil odstranjen, ker je preprečeval drsenje.
Nova, boljša logika je v datoteki pages/_homepage.css */
/* SOURCE: assets/css/base/_typography.css */
/* /assets/css/base/_typography.css */
@@ -59,6 +61,7 @@ h1, h2, h3 {
line-height: 1.2;
margin-bottom: var(--spacing-m);
color: var(--color-primary-accent); /* SPREMEMBA: Vsi naslovi so sedaj v primarni barvi */
font-size-adjust: 0.45;
}
p {
@@ -80,6 +83,7 @@ a:hover {
color: var(--color-primary-accent);
text-transform: uppercase;
}
/* SOURCE: assets/css/layout/_structure.css */
/* /assets/css/layout/_structure.css */
@@ -276,72 +280,6 @@ a:hover {
align-self: start; /* Zagotovi pravilno poravnavo znotraj grid celice */
}
}
/* SOURCE: assets/css/layout/_grids.css */
/* /assets/css/layout/_grids.css */
.about-grid {
display: grid;
grid-template-columns: 1fr;
gap: var(--spacing-l);
align-items: flex-start;
}
.image-grid {
display: grid;
grid-template-columns: 1fr;
gap: var(--spacing-l);
margin-bottom: var(--spacing-xl);
}
.services-grid {
display: grid;
grid-template-columns: 1fr;
gap: var(--spacing-l);
}
.blog-grid {
display: grid;
grid-template-columns: 1fr;
gap: var(--spacing-l);
}
.contact-grid {
display: grid;
grid-template-columns: 1fr;
gap: var(--spacing-xl);
}
/* --- MEDIA QUERIES --- */
@media (max-width: 768px) {
.image-grid, .services-grid, .blog-grid, .contact-grid {
grid-template-columns: 1fr;
}
}
@media (min-width: 768px) {
/* Stili za večje tablice */
.image-grid { grid-template-columns: 1fr 1fr; }
.services-grid { grid-template-columns: repeat(2, 1fr); }
.blog-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 992px) {
/* Stili za namizje */
.about-grid {
grid-template-columns: 1fr 2fr;
gap: var(--spacing-xl);
}
.services-grid, .blog-grid {
grid-template-columns: repeat(3, 1fr);
gap: var(--spacing-xl);
}
.contact-grid {
grid-template-columns: 1fr 1fr;
align-items: flex-start;
}
}
/* SOURCE: assets/css/components/_header.css */
/* /assets/css/components/_header.css */
+1 -1
View File
@@ -1 +1 @@
:root{--font-heading:'Playfair Display',serif;--font-body:'Montserrat',sans-serif;--color-text:#2c3e50;--color-background:#fdfdfd;--color-primary-accent:#0804fc;--color-primary-accent-dark:#0603c9;--color-white:#ffffff;--color-border:#e0e0e0;--spacing-xs:0.25rem;--spacing-s:0.5rem;--spacing-m:1rem;--spacing-l:2rem;--spacing-xl:4rem;--shadow-light:0 4px 6px rgba(0,0,0,0.05);--shadow-medium:0 8px 24px rgba(0,0,0,0.1);--transition-fast:0.2s ease-in-out;--transition-medium:0.5s ease-in-out}*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-body);color:var(--color-text);background-color:var(--color-background);line-height:1.7;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3{font-family:var(--font-heading);font-weight:700;line-height:1.2;margin-bottom:var(--spacing-m);color:var(--color-primary-accent)}p{margin-bottom:var(--spacing-m)}a{color:var(--color-primary-accent);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-primary-accent-dark)}.text-accent-uppercase{color:var(--color-primary-accent);text-transform:uppercase}.page-main-content{padding-top:var(--spacing-xl);padding-bottom:var(--spacing-xl);min-height:calc(100vh - 80px - 150px)}.container{max-width:1100px;margin:0 auto;padding:0 var(--spacing-l)}.page-title{font-size:clamp(2.5rem,6vw,4rem);text-align:center;margin-bottom:var(--spacing-xl);color:var(--color-primary-accent)}.section-title{font-size:clamp(1.5rem,4vw,2rem);margin-top:var(--spacing-l);margin-bottom:var(--spacing-m);color:var(--color-text);border-left:4px solid var(--color-primary-accent);padding-left:var(--spacing-m)}.intro-text{font-size:1.25rem;font-style:italic;font-weight:500;line-height:1.6;margin-bottom:var(--spacing-l);color:#555}.page-subtitle{font-size:clamp(1.1rem,3vw,1.4rem);text-align:center;max-width:800px;margin:0 auto var(--spacing-xl) auto;color:#555}.text-section{margin-bottom:var(--spacing-l)}.about-image{width:100%;max-width:400px;margin:0 auto;position:static}.about-image img{width:100%;height:auto;border-radius:10px;box-shadow:var(--shadow-medium)}.grid-image{width:100%;aspect-ratio:1 / 1;background-size:cover;background-position:center;border-radius:10px;box-shadow:var(--shadow-medium);transition:transform var(--transition-medium),box-shadow var(--transition-medium)}.grid-image:hover{transform:scale(1.03);box-shadow:0 12px 30px rgba(0,0,0,0.15)}.highlight-quote{margin:var(--spacing-l) auto;padding:var(--spacing-l);border-left:5px solid var(--color-primary-accent);background-color:rgba(8,4,252,0.05);border-radius:0 8px 8px 0}.highlight-quote p{font-size:1.1rem;font-style:italic;font-weight:500;margin-bottom:var(--spacing-m)}.highlight-quote cite{display:block;text-align:right;font-style:normal;font-weight:600}.concluding-statement{text-align:center;padding:var(--spacing-l);margin:var(--spacing-xl) 0;border:1px solid var(--color-border);border-radius:8px;background-color:var(--color-white);box-shadow:var(--shadow-light)}.concluding-statement p{margin-bottom:0;font-size:1.1rem;line-height:1.8;text-transform:uppercase;letter-spacing:0.5px}.content-cta{text-align:center;margin-top:var(--spacing-xl)}.page-hero{padding:var(--spacing-l) 0;text-align:center;background-color:rgba(8,4,252,0.05);margin-bottom:var(--spacing-xl)}.page-hero .page-title{margin-bottom:var(--spacing-m)}.page-hero .page-subtitle{font-size:1.1rem;max-width:700px;margin:0 auto;color:#555;font-style:normal}.contact-details{background-color:rgba(221,226,229,0.2);padding:var(--spacing-l);border-radius:8px}.contact-info-item{margin-bottom:1.5rem}.contact-info-item .info-label{display:block;font-size:0.9rem;font-weight:600;color:#777;margin-bottom:var(--spacing-xs)}.contact-info-item .info-data{font-size:1.1rem;margin:0}.contact-info-item .info-data a{word-break:break-all}.map-placeholder{width:100%;height:300px;border-radius:8px;overflow:hidden;margin-top:var(--spacing-l);background-color:#e9e9e9;box-shadow:inset 0 2px 4px rgba(0,0,0,0.06)}.map-placeholder iframe{width:100%;height:100%;border:0}.animate-on-scroll{opacity:0;transform:translateY(30px);transition:opacity 0.6s ease-out,transform 0.6s ease-out}.animate-on-scroll.is-visible{opacity:1;transform:translateY(0)}@media (max-width:768px){}@media (min-width:768px){}@media (min-width:992px){.about-image{max-width:100%;position:sticky;top:calc(var(--spacing-l) + 80px);align-self:start}}.about-grid{display:grid;grid-template-columns:1fr;gap:var(--spacing-l);align-items:flex-start}.image-grid{display:grid;grid-template-columns:1fr;gap:var(--spacing-l);margin-bottom:var(--spacing-xl)}.services-grid{display:grid;grid-template-columns:1fr;gap:var(--spacing-l)}.blog-grid{display:grid;grid-template-columns:1fr;gap:var(--spacing-l)}.contact-grid{display:grid;grid-template-columns:1fr;gap:var(--spacing-xl)}@media (max-width:768px){.image-grid,.services-grid,.blog-grid,.contact-grid{grid-template-columns:1fr}}@media (min-wiLine truncated
:root{--font-heading:'Playfair Display',serif;--font-body:'Montserrat',sans-serif;--color-text:#2c3e50;--color-background:#fdfdfd;--color-primary-accent:#0804fc;--color-primary-accent-dark:#0603c9;--color-white:#ffffff;--color-border:#e0e0e0;--spacing-xs:0.25rem;--spacing-s:0.5rem;--spacing-m:1rem;--spacing-l:2rem;--spacing-xl:4rem;--shadow-light:0 4px 6px rgba(0,0,0,0.05);--shadow-medium:0 8px 24px rgba(0,0,0,0.1);--transition-fast:0.2s ease-in-out;--transition-medium:0.5s ease-in-out}*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-body);color:var(--color-text);background-color:var(--color-background);line-height:1.7;font-size-adjust:0.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3{font-family:var(--font-heading);font-weight:700;line-height:1.2;margin-bottom:var(--spacing-m);color:var(--color-primary-accent);font-size-adjust:0.45}p{margin-bottom:var(--spacing-m)}a{color:var(--color-primary-accent);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-primary-accent-dark)}.text-accent-uppercase{color:var(--color-primary-accent);text-transform:uppercase}.page-main-content{padding-top:var(--spacing-xl);padding-bottom:var(--spacing-xl);min-height:calc(100vh - 80px - 150px)}.container{max-width:1100px;margin:0 auto;padding:0 var(--spacing-l)}.page-title{font-size:clamp(2.5rem,6vw,4rem);text-align:center;margin-bottom:var(--spacing-xl);color:var(--color-primary-accent)}.section-title{font-size:clamp(1.5rem,4vw,2rem);margin-top:var(--spacing-l);margin-bottom:var(--spacing-m);color:var(--color-text);border-left:4px solid var(--color-primary-accent);padding-left:var(--spacing-m)}.intro-text{font-size:1.25rem;font-style:italic;font-weight:500;line-height:1.6;margin-bottom:var(--spacing-l);color:#555}.page-subtitle{font-size:clamp(1.1rem,3vw,1.4rem);text-align:center;max-width:800px;margin:0 auto var(--spacing-xl) auto;color:#555}.text-section{margin-bottom:var(--spacing-l)}.about-image{width:100%;max-width:400px;margin:0 auto;position:static}.about-image img{width:100%;height:auto;border-radius:10px;box-shadow:var(--shadow-medium)}.grid-image{width:100%;aspect-ratio:1 / 1;background-size:cover;background-position:center;border-radius:10px;box-shadow:var(--shadow-medium);transition:transform var(--transition-medium),box-shadow var(--transition-medium)}.grid-image:hover{transform:scale(1.03);box-shadow:0 12px 30px rgba(0,0,0,0.15)}.highlight-quote{margin:var(--spacing-l) auto;padding:var(--spacing-l);border-left:5px solid var(--color-primary-accent);background-color:rgba(8,4,252,0.05);border-radius:0 8px 8px 0}.highlight-quote p{font-size:1.1rem;font-style:italic;font-weight:500;margin-bottom:var(--spacing-m)}.highlight-quote cite{display:block;text-align:right;font-style:normal;font-weight:600}.concluding-statement{text-align:center;padding:var(--spacing-l);margin:var(--spacing-xl) 0;border:1px solid var(--color-border);border-radius:8px;background-color:var(--color-white);box-shadow:var(--shadow-light)}.concluding-statement p{margin-bottom:0;font-size:1.1rem;line-height:1.8;text-transform:uppercase;letter-spacing:0.5px}.content-cta{text-align:center;margin-top:var(--spacing-xl)}.page-hero{padding:var(--spacing-l) 0;text-align:center;background-color:rgba(8,4,252,0.05);margin-bottom:var(--spacing-xl)}.page-hero .page-title{margin-bottom:var(--spacing-m)}.page-hero .page-subtitle{font-size:1.1rem;max-width:700px;margin:0 auto;color:#555;font-style:normal}.contact-details{background-color:rgba(221,226,229,0.2);padding:var(--spacing-l);border-radius:8px}.contact-info-item{margin-bottom:1.5rem}.contact-info-item .info-label{display:block;font-size:0.9rem;font-weight:600;color:#777;margin-bottom:var(--spacing-xs)}.contact-info-item .info-data{font-size:1.1rem;margin:0}.contact-info-item .info-data a{word-break:break-all}.map-placeholder{width:100%;height:300px;border-radius:8px;overflow:hidden;margin-top:var(--spacing-l);background-color:#e9e9e9;box-shadow:inset 0 2px 4px rgba(0,0,0,0.06)}.map-placeholder iframe{width:100%;height:100%;border:0}.animate-on-scroll{opacity:0;transform:translateY(30px);transition:opacity 0.6s ease-out,transform 0.6s ease-out}.animate-on-scroll.is-visible{opacity:1;transform:translateY(0)}@media (max-width:768px){}@media (min-width:768px){}@media (min-width:992px){.about-image{max-width:100%;position:sticky;top:calc(var(--spacing-l) + 80px);align-self:start}}.main-header{background-color:rgba(255,255,255,0.95);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:var(--shadow-light);border-bottom:1px solid var(--color-border);position:relative;z-index:1000}.header-container{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-m) var(--spacing-l);max-width:1600px;margin:0 auto}.logo a{font-family:var(--font-heading);font-weight:800;font-size:1.2rem;color:var(--color-text);letter-spacing:0.5px}.maLine truncated