You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
140 lines
5.4 KiB
140 lines
5.4 KiB
{% set _theme_dark_cfg = website_theme_stylesheet_dark|default('')|trim %} |
|
{% set _color_scheme_site_default = _theme_dark_cfg != '' ? 'dark' : 'light' %} |
|
<!DOCTYPE html> |
|
<html |
|
lang="en" |
|
data-theme="{{ website_theme }}" |
|
data-color-scheme-default="{{ _color_scheme_site_default }}" |
|
> |
|
<head> |
|
{# Apply saved color scheme before first paint; site default is dark when a dark magazine sheet is configured. #} |
|
<script> |
|
(function () { |
|
var def = document.documentElement.getAttribute('data-color-scheme-default') || 'dark'; |
|
var p = def; |
|
try { |
|
var s = localStorage.getItem('unfold-color-scheme'); |
|
if (def === 'light' && s === 'dark') { |
|
p = 'light'; |
|
} else if (s === 'light' || s === 'dark') { |
|
p = s; |
|
} |
|
} catch (e) {} |
|
document.documentElement.setAttribute('data-color-scheme', p); |
|
})(); |
|
</script> |
|
<meta charset="UTF-8"> |
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
<title>{% block title %}{{ website_name }}{% endblock %}</title> |
|
{# Unfurlers often use the first meta description; pages override this block. #} |
|
{% block meta_description %} |
|
<meta name="description" content="{{ website_description|e('html_attr') }}"> |
|
{% endblock %} |
|
<link rel="icon" type="image/png" href="{{ asset('icons/favicon-96x96.png') }}" sizes="96x96" /> |
|
<link rel="icon" type="image/x-icon" href="{{ asset('icons/favicon.ico') }}" /> |
|
<link rel="shortcut icon" href="{{ asset('icons/favicon.ico') }}" /> |
|
<link rel="apple-touch-icon" href="{{ asset('icons/apple-touch-icon.png') }}"> |
|
<meta name="apple-mobile-web-app-title" content="{{ website_short_name }}" /> |
|
|
|
<link rel="manifest" href="{{ path('pwa_manifest') }}"> |
|
|
|
{% block ogtags %} |
|
{% set _pubkey_hex = pubkey_hex_from_npub(publisher_npub|default('')) %} |
|
{% set _og = article_og_image(null, _pubkey_hex) %} |
|
{% set _og_image = _og.href %} |
|
{% set _og_default_dims = _og.use_default_dimensions %} |
|
<meta property="og:type" content="website"> |
|
<meta property="og:description" content="{{ website_description|e('html_attr') }}"> |
|
<meta property="og:image" content="{{ _og_image|e('html_attr') }}"> |
|
{% if _og_image starts with 'https://' %} |
|
<meta property="og:image:secure_url" content="{{ _og_image|e('html_attr') }}"> |
|
{% endif %} |
|
{% if _og_default_dims %} |
|
<meta property="og:image:width" content="1200"> |
|
<meta property="og:image:height" content="630"> |
|
{% endif %} |
|
<meta property="og:site_name" content="{{ website_name|e('html_attr') }}"> |
|
{% endblock %} |
|
{% block javascripts %} |
|
{% block importmap %}{{ importmap('app') }}{% endblock %} |
|
{% endblock %} |
|
{% block stylesheets %} |
|
{% set _theme_light = website_theme_stylesheet_light|default('theme.css') %} |
|
{% set _theme_dark = _theme_dark_cfg %} |
|
<link |
|
rel="stylesheet" |
|
id="theme-magazine-stylesheet" |
|
href="{{ _theme_dark != '' ? asset(_theme_dark) : asset(_theme_light) }}" |
|
data-href-light="{{ asset(_theme_light)|e('html_attr') }}" |
|
{% if _theme_dark != '' %} |
|
data-href-dark="{{ asset(_theme_dark)|e('html_attr') }}" |
|
{% endif %} |
|
> |
|
{% if _theme_dark != '' %} |
|
<script> |
|
(function () { |
|
var el = document.getElementById('theme-magazine-stylesheet'); |
|
if (!el) { |
|
return; |
|
} |
|
var scheme = document.documentElement.getAttribute('data-color-scheme') |
|
|| document.documentElement.getAttribute('data-color-scheme-default') |
|
|| 'dark'; |
|
var dark = el.getAttribute('data-href-dark'); |
|
var light = el.getAttribute('data-href-light'); |
|
if (scheme === 'light') { |
|
el.setAttribute('href', light); |
|
} else if (dark) { |
|
el.setAttribute('href', dark); |
|
} else { |
|
el.setAttribute('href', light); |
|
} |
|
})(); |
|
</script> |
|
{% endif %} |
|
{% endblock %} |
|
</head> |
|
<body data-controller="service-worker"> |
|
|
|
<twig:Header /> |
|
|
|
|
|
<div class="layout"> |
|
<nav> |
|
<twig:UserMenu /> |
|
{% set _sidebar_fa = sidebar_featured_author_rows(12) %} |
|
{% if _sidebar_fa is not empty %} |
|
{% include 'components/Organisms/SidebarFeaturedAuthors.html.twig' with { rows: _sidebar_fa } only %} |
|
{% endif %} |
|
{% set _top_topics = top_topic_labels(10) %} |
|
{% if _top_topics is not empty %} |
|
{% include 'components/Organisms/SidebarTopTopics.html.twig' with { labels: _top_topics } only %} |
|
{% endif %} |
|
{% block nav %}{% endblock %} |
|
</nav> |
|
<main> |
|
{% block body %}{% endblock %} |
|
</main> |
|
<aside> |
|
{% block aside %}{% endblock %} |
|
</aside> |
|
</div> |
|
|
|
<div data-controller="install-prompt"> |
|
<div |
|
class="install-prompt-box hidden" |
|
data-install-prompt-target="promptBox" |
|
> |
|
<p>Install this app on your device for quick access?</p> |
|
<button data-action="click->install-prompt#install">Yes, install</button> |
|
<button data-action="click->install-prompt#dismiss">No thanks</button> |
|
</div> |
|
</div> |
|
|
|
|
|
<footer> |
|
<twig:Footer /> |
|
</footer> |
|
|
|
</body> |
|
</html>
|
|
|