Files
ptp/themes/hugo-theme-massively/layouts/partials/htmlhead.html
T
Kirik 6269d3323c Implement adaptive background images for mobile and desktop
- Add desktop.webp (2732x1535) for desktop devices and mobile.webp (556x1535) for mobile
- Create adaptive-background.css with media queries (max-width: 736px for mobile)
- Update config.toml to use desktop.webp as default background
- Modify htmlhead.html to include adaptive-background.css
- Update preload-images.html for responsive image preloading
- Optimize background loading based on device screen width

Both images include overlay.png and gradient overlay for consistent design.
Mobile version (124 KB) is 5.8x lighter than desktop version (716 KB).
2025-11-12 19:53:54 +01:00

41 lines
2.2 KiB
HTML

<!DOCTYPE HTML>
<!--
Massively by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html lang='{{ .Site.Language.Lang | default "en-us" }}'>
<head>
<title>{{ if eq (.Site.Title) (.Title) }}{{ .Site.Title }}{{ else }}{{ .Title }} &middot; {{ .Site.Title }}{{ end }}</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<!-- CSS -->
{{ if hugo.IsServer }}
{{ $style := resources.Get "scss/main.scss" | resources.ExecuteAsTemplate "main.scss" . | toCSS (dict "targetPath" "assets/css/main.css" "enableSourceMap" true) }}
<link rel="stylesheet" href="{{ ($style).RelPermalink }}">
{{ else }}
{{ $style := resources.Get "scss/main.scss" | resources.ExecuteAsTemplate "main.scss" . | toCSS (dict "targetPath" "assets/css/main.css" "enableSourceMap" false) }}
<link rel="stylesheet" href="{{ ($style | minify).RelPermalink }}">
{{ end }}
{{ with .Site.Params.favicon }}
<link rel="shortcut icon" href="/img/favicon.ico">
{{ end }}
{{ $noscript := resources.Get "scss/noscript.scss" | resources.ExecuteAsTemplate "noscript.scss" . | toCSS (dict "targetPath" "assets/css/noscript.css" "enableSourceMap" false) }}
<noscript><link rel="stylesheet" href='{{ $noscript.RelPermalink }}' /></noscript>
<link rel="stylesheet" href="/css/yandex-maps.css">
<link rel="stylesheet" href="/css/location-spacing.css">
<link rel="stylesheet" href="/css/footer-nav.css">
<link rel="stylesheet" href="/css/mobile-pagination.css">
<link rel="stylesheet" href="/css/back-to-top.css">
<link rel="stylesheet" href="/css/typography-improvements.css">
<link rel="stylesheet" href="/css/about-site.css">
<link rel="stylesheet" href="/css/copyright-visible.css">
<link rel="stylesheet" href="/css/nav-background.css">
<link rel="stylesheet" href="/css/pagination-info.css">
<link rel="stylesheet" href="/css/forms.css">
<link rel="stylesheet" href="/css/page-spacing.css">
<link rel="stylesheet" href="/css/mobile-menu.css">
<link rel="stylesheet" href="/css/adaptive-background.css">
{{ partial "htmlhead.custom.html" }}
</head>