2023-07-05 13:43:09 +01:00
<!DOCTYPE html>
<html lang=" {{ @ site .locale }} ">
<head>
{{!-- Basic meta - advanced meta is output with {{ghost_head}} below --}}
<title> {{ meta_title }} </title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
{{!-- Preload main styles and scripts for better performance --}}
<link rel="preload" as="style" href=" {{ asset "built/screen.css" }} ">
<link rel="preload" as="script" href=" {{ asset "built/casper.js" }} ">
2023-07-10 09:13:01 +01:00
<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=EB+Garamond:wght@400;600&family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:ital,wght@0,400;0,700;0,800;1,400;1,700&family=Roboto+Slab:wght@400;600;700&display=swap" rel="stylesheet">
2023-07-05 13:43:09 +01:00
{{!-- Theme assets - use the {{asset}} helper to reference styles & scripts, this will take care of caching and cache-busting automatically --}}
<link rel="stylesheet" type="text/css" href=" {{ asset "built/screen.css" }} ">
2023-07-10 08:44:09 +01:00
{{!-- Custom background color --}}
<style>
:root {
--background-color: {{ @ custom .page_background_color }}
}
</style>
<script>
/* The script for calculating the color contrast has been taken from
https://gomakethings.com/dynamically-changing-the-text-color-based-on-background-color-contrast-with-vanilla-js/ */
var accentColor = getComputedStyle(document.documentElement).getPropertyValue('--background-color');
accentColor = accentColor.trim().slice(1);
var r = parseInt(accentColor.substr(0, 2), 16);
var g = parseInt(accentColor.substr(2, 2), 16);
var b = parseInt(accentColor.substr(4, 2), 16);
var yiq = ((r * 299) + (g * 587) + (b * 114)) / 1000;
var textColor = (yiq >= 128) ? 'dark' : 'light';
document.documentElement.className = `has-$ { textColor}-text`;
</script>
2023-07-05 13:43:09 +01:00
{{!-- This tag outputs all your advanced SEO meta, structured data, and other important settings, it should always be the last tag before the closing head tag --}}
{{ ghost_head }}
</head>
2023-07-10 09:13:01 +01:00
<body class=" {{ body_class }} has- {{ # match @ custom .title_font "Elegant serif" }} serif {{ else match @ custom .title_font "Clean slab" }} slab {{ else }} sans {{ / match }} -title has- {{ # match @ custom .body_font "Elegant serif" }} serif {{ else }} sans {{ / match }} -body">
2023-07-05 13:43:09 +01:00
<div class="gh-viewport">
{{ > "components/navigation" navigationLayout = @ custom .navigation_layout }}
2023-07-10 04:58:34 +01:00
{{ > "components/header" headerStyle = @ custom .header_style }}
2023-07-10 06:31:23 +01:00
{{ > "components/featured" showFeatured = @ custom .show_featured }}
2023-07-10 04:58:34 +01:00
{{ > "components/post-list" postListStyle = @ custom .post_list_style }}
2023-07-10 07:12:45 +01:00
{{ > "components/footer" }}
2023-07-05 13:43:09 +01:00
{{{ body }}}
</div>
{{!-- Scripts - handle responsive videos, infinite scroll, and navigation dropdowns --}}
<script src=" {{ asset "built/casper.js" }} "></script>
{{!-- Ghost outputs required functional scripts with this tag, it should always be the last thing before the closing body tag --}}
{{ ghost_foot }}
</body>
</html>