Improve font loading and add fallback for better display

Updates client/index.html and client/src/index.css to improve Oswald font loading with preconnect hints and adds a fallback font stack for desktop users in the .oswald-text class.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2eb1084e-b728-4449-9231-f1665924c8d5
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2eb1084e-b728-4449-9231-f1665924c8d5/kdQ95gE
This commit is contained in:
sebastjanartic 2025-08-29 20:22:20 +00:00
parent 5564863b27
commit 44a070668e
2 changed files with 14 additions and 5 deletions

View File

@ -26,10 +26,18 @@
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="theme-color" content="#3b82f6" />
<!-- Oswald Google Font -->
<!-- Oswald Google Font z improved loading -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Oswald:wght@200;300;400;500;600;700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&display=swap" rel="stylesheet">
<style>
/* Fallback font za desktop če se Oswald ne naloži */
@font-face {
font-family: 'Oswald-fallback';
src: local('Arial Black'), local('Helvetica');
font-weight: 600;
}
</style>
</head>
<body>

View File

@ -392,12 +392,13 @@ input[data-testid*="search"]::placeholder {
z-index: 2147483647 !important;
}
/* Oswald font povsod */
/* Oswald font povsod z fallback za desktop */
.oswald-text {
font-family: 'Oswald', sans-serif;
font-weight: 500;
font-family: 'Oswald', 'Arial Black', 'Helvetica', sans-serif;
font-weight: 600;
letter-spacing: 0.05em;
text-transform: uppercase;
font-display: swap;
}
/* Hide picture-in-picture button on all video elements */