2022-09-12 05:59:12 -04:00
<!DOCTYPE html>
<html lang=" {{ @ site .locale }} ">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title> {{ meta_title }} </title>
<link rel="stylesheet" href=" {{ asset "built/screen.css" }} ">
{{ # is "home" }}
{{ # if @ site .cover_image }}
<link rel="preload" as="image" href=" {{ @ site .cover_image }} ">
{{ / if }}
{{ / is }}
<style>
:root {
--background-color: {{ @ custom .background_color }}
}
</style>
<script>
/* The script for calculating the color contrast was 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>
{{ ghost_head }}
</head>
2022-11-10 23:02:51 -05:00
<body class=" {{ body_class }} {{{ block "body_class" }}} is-head- {{ # match @ custom .navigation_layout "Logo on the left" }} left-logo {{ else match @ custom .navigation_layout "Logo in the middle" }} middle-logo {{ else }} stacked {{ / match }} {{ # match @ custom .typography "Elegant serif" }} has-serif-font {{ / match }} {{ # match @ custom .typography "Consistent mono" }} has-mono-font {{ / match }} {{ # match @ custom .post_feed_layout "Classic" }} has-classic-feed {{ / match }} {{ # match @ custom .post_feed_layout "Typographic" }} has-typographic-feed {{ / match }} {{ # match @ custom .post_feed_layout "Parallax" }} has-parallax-feed {{ / match }} ">
<div class="gh-site">
<header id="gh-head" class="gh-head gh-outer">
<div class="gh-head-inner gh-inner">
<div class="gh-head-brand">
<div class="gh-head-brand-wrapper">
<a class="gh-head-logo" href=" {{ @ site .url }} ">
{{ # if @ site .logo }}
<img src=" {{ @ site .logo }} " alt=" {{ @ site .title }} ">
{{ else }}
{{ @ site .title }}
{{ / if }}
</a>
2022-09-12 05:59:12 -04:00
</div>
2022-11-10 23:02:51 -05:00
<button class="gh-search gh-icon-btn" data-ghost-search> {{ > "icons/search" }} </button>
<button class="gh-burger"></button>
</div>
2022-09-12 05:59:12 -04:00
2022-11-10 23:02:51 -05:00
<nav class="gh-head-menu">
{{ navigation }}
{{ # unless @ site .members_enabled }}
{{ # match @ custom .navigation_layout "Stacked" }}
<button class="gh-search gh-icon-btn" data-ghost-search> {{ > "icons/search" }} </button>
{{ / match }}
{{ / unless }}
</nav>
<div class="gh-head-actions">
{{ # unless @ site .members_enabled }}
{{ ^ match @ custom .navigation_layout "Stacked" }}
<button class="gh-search gh-icon-btn" data-ghost-search> {{ > "icons/search" }} </button>
{{ / match }}
{{ else }}
2022-09-12 05:59:12 -04:00
<button class="gh-search gh-icon-btn" data-ghost-search> {{ > "icons/search" }} </button>
2022-11-10 23:02:51 -05:00
{{ # unless @ member }}
{{ # unless @ site .members_invite_only }}
<a class="gh-head-btn gh-btn gh-primary-btn" href="#/portal/signup" data-portal="signup">Subscribe</a>
2022-09-12 05:59:12 -04:00
{{ else }}
2022-11-10 23:02:51 -05:00
<a class="gh-head-btn gh-btn gh-primary-btn" href="#/portal/signin" data-portal="signin">Login</a>
2022-09-12 05:59:12 -04:00
{{ / unless }}
{{ else }}
2022-11-10 23:02:51 -05:00
<a class="gh-head-btn gh-btn gh-primary-btn" href="#/portal/account" data-portal="account">Account</a>
2022-09-12 05:59:12 -04:00
{{ / unless }}
2022-11-10 23:02:51 -05:00
{{ / unless }}
</div>
</div>
</header>
{{{ body }}}
<footer class="gh-foot gh-outer">
<div class="gh-foot-inner gh-inner">
<nav class="gh-foot-menu">
{{ navigation type = "secondary" }}
</nav>
<div class="gh-copyright">
{{ # unless @ custom .footer_text }}
{{ @ site .title }} © {{ date format = "YYYY" }} . Powered by <a href="https://ghost.org/" target="_blank" rel="noopener">Ghost</a>
{{ else }}
{{ @ custom .footer_text }}
{{ / unless }}
2022-09-12 05:59:12 -04:00
</div>
2022-11-10 23:02:51 -05:00
</div>
</footer>
2022-09-12 05:59:12 -04:00
2022-11-10 23:02:51 -05:00
</div>
{{ # is "post, page" }}
{{ > "pswp" }}
{{ / is }}
<script src=" {{ asset "built/main.min.js" }} "></script>
2022-09-12 05:59:12 -04:00
2022-11-10 23:02:51 -05:00
{{ ghost_foot }}
2022-09-12 05:59:12 -04:00
</body>
2022-09-19 05:04:07 -04:00
</html>
