mark
/
hermina
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Reduce CLS by adjusting font loading and typographic metrics
Deploy to Development and Production / deploy (push) Successful in 5s Details

This commit is contained in:
Mark Poljanšek 2025-11-03 15:58:33 +01:00
parent 6b5ebb37b9
commit dda4633ee1
13 changed files with 26 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
assets/css/base/_reset.css
View File

@ -17,9 +17,10 @@ body {
color: var(--color-text); color: var(--color-text);
background-color: var(--color-background); background-color: var(--color-background);
line-height: 1.7; line-height: 1.7;
font-size-adjust: 0.5;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
} }
/* Ta blok je bil odstranjen, ker je preprečeval drsenje. /* Ta blok je bil odstranjen, ker je preprečeval drsenje.
Nova, boljša logika je v datoteki pages/_homepage.css */ Nova, boljša logika je v datoteki pages/_homepage.css */

3
assets/css/base/_typography.css
View File

@ -6,6 +6,7 @@ h1, h2, h3 {
line-height: 1.2; line-height: 1.2;
margin-bottom: var(--spacing-m); margin-bottom: var(--spacing-m);
color: var(--color-primary-accent); /* SPREMEMBA: Vsi naslovi so sedaj v primarni barvi */ color: var(--color-primary-accent); /* SPREMEMBA: Vsi naslovi so sedaj v primarni barvi */
font-size-adjust: 0.45;
} }
p { p {
@ -26,4 +27,4 @@ a:hover {
.text-accent-uppercase { .text-accent-uppercase {
color: var(--color-primary-accent); color: var(--color-primary-accent);
text-transform: uppercase; text-transform: uppercase;
} }

4
blog/index.html
View File

@ -33,8 +33,8 @@
<!-- Google Fonts --> <!-- Google Fonts -->
<link href="https://fonts.googleapis.com" rel="preconnect"/> <link href="https://fonts.googleapis.com" rel="preconnect"/>
<link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/> <link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/>
<link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/><noscript> <link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/><noscript>
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" rel="stylesheet"/> <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" rel="stylesheet"/>
</noscript> </noscript>
<!-- CSS Stylesheet --> <!-- CSS Stylesheet -->

4
blog/psihofizicne-terapevtske-oblike/index.html
View File

@ -8,8 +8,8 @@
<!-- Google Fonts --> <!-- Google Fonts -->
<link href="https://fonts.googleapis.com" rel="preconnect"/> <link href="https://fonts.googleapis.com" rel="preconnect"/>
<link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/> <link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/>
<link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/><noscript> <link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/><noscript>
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" rel="stylesheet"/> <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" rel="stylesheet"/>
</noscript> </noscript>
<!-- CSS Stylesheet --> <!-- CSS Stylesheet -->

4
blog/psihoterapevtske-intervencije/index.html
View File

@ -8,8 +8,8 @@
<!-- Google Fonts --> <!-- Google Fonts -->
<link href="https://fonts.googleapis.com" rel="preconnect"/> <link href="https://fonts.googleapis.com" rel="preconnect"/>
<link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/> <link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/>
<link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/><noscript> <link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/><noscript>
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" rel="stylesheet"/> <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" rel="stylesheet"/>
</noscript> </noscript>
<!-- CSS Stylesheet --> <!-- CSS Stylesheet -->

4
blog/psihoterapija-in-svetovanje/index.html
View File

@ -8,8 +8,8 @@
<!-- Google Fonts --> <!-- Google Fonts -->
<link href="https://fonts.googleapis.com" rel="preconnect"/> <link href="https://fonts.googleapis.com" rel="preconnect"/>
<link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/> <link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/>
<link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/><noscript> <link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/><noscript>
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" rel="stylesheet"/> <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" rel="stylesheet"/>
</noscript> </noscript>
<!-- CSS Stylesheet --> <!-- CSS Stylesheet -->

4
blog/strokovna-pomoc-za-celovito-zdravje/index.html
View File

@ -8,8 +8,8 @@
<!-- Google Fonts --> <!-- Google Fonts -->
<link href="https://fonts.googleapis.com" rel="preconnect"/> <link href="https://fonts.googleapis.com" rel="preconnect"/>
<link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/> <link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/>
<link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/><noscript> <link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/><noscript>
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" rel="stylesheet"/> <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" rel="stylesheet"/>
</noscript> </noscript>
<!-- CSS Stylesheet --> <!-- CSS Stylesheet -->

4
cenik/index.html
View File

@ -8,8 +8,8 @@
<!-- Google Fonts --> <!-- Google Fonts -->
<link href="https://fonts.googleapis.com" rel="preconnect"/> <link href="https://fonts.googleapis.com" rel="preconnect"/>
<link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/> <link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/>
<link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/><noscript> <link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/><noscript>
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" rel="stylesheet"/> <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" rel="stylesheet"/>
</noscript> </noscript>
<!-- CSS Stylesheet --> <!-- CSS Stylesheet -->

4
index.html
View File

@ -8,9 +8,9 @@
<!-- Google Fonts --> <!-- Google Fonts -->
<link href="https://fonts.googleapis.com" rel="preconnect"/> <link href="https://fonts.googleapis.com" rel="preconnect"/>
<link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/> <link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/>
<link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/> <link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/>
<noscript> <noscript>
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" rel="stylesheet"/> <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" rel="stylesheet"/>
</noscript> </noscript>
<link as="image" fetchpriority="high" href="/assets/images/home-slider-01-morje.webp" rel="preload" type="image/webp"/> <link as="image" fetchpriority="high" href="/assets/images/home-slider-01-morje.webp" rel="preload" type="image/webp"/>
<!-- Kritični in razdeljeni CSS --> <!-- Kritični in razdeljeni CSS -->

4
kaj-je-psihoterapija/index.html
View File

@ -8,8 +8,8 @@
<!-- Google Fonts --> <!-- Google Fonts -->
<link href="https://fonts.googleapis.com" rel="preconnect"/> <link href="https://fonts.googleapis.com" rel="preconnect"/>
<link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/> <link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/>
<link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/><noscript> <link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/><noscript>
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" rel="stylesheet"/> <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" rel="stylesheet"/>
</noscript> </noscript>
<!-- CSS Stylesheet --> <!-- CSS Stylesheet -->

4
kontakt/index.html
View File

@ -8,8 +8,8 @@
<!-- Google Fonts --> <!-- Google Fonts -->
<link href="https://fonts.googleapis.com" rel="preconnect"/> <link href="https://fonts.googleapis.com" rel="preconnect"/>
<link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/> <link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/>
<link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/><noscript> <link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/><noscript>
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" rel="stylesheet"/> <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" rel="stylesheet"/>
</noscript> </noscript>
<!-- CSS Stylesheet --> <!-- CSS Stylesheet -->

4
o-meni/index.html
View File

@ -8,9 +8,9 @@
<!-- Google Fonts --> <!-- Google Fonts -->
<link href="https://fonts.googleapis.com" rel="preconnect"/> <link href="https://fonts.googleapis.com" rel="preconnect"/>
<link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/> <link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/>
<link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/> <link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/>
<noscript> <noscript>
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" rel="stylesheet"/> <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" rel="stylesheet"/>
</noscript> </noscript>
<!-- CSS Stylesheet --> <!-- CSS Stylesheet -->
<style> <style>

4
storitve/index.html
View File

@ -8,9 +8,9 @@
<!-- Google Fonts --> <!-- Google Fonts -->
<link href="https://fonts.googleapis.com" rel="preconnect"/> <link href="https://fonts.googleapis.com" rel="preconnect"/>
<link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/> <link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/>
<link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/> <link as="style" href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" onload="this.onload=null;this.rel='stylesheet'" rel="preload"/>
<noscript> <noscript>
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=swap" rel="stylesheet"/> <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&amp;family=Montserrat:ital,wght@0,100..900;1,100..900&amp;display=optional" rel="stylesheet"/>
</noscript> </noscript>
<!-- CSS Stylesheet --> <!-- CSS Stylesheet -->
<style> <style>