Files
website-v2/templates/base.html
Greg Newman 3cedf1b45d 🐛 fixes font flicker from Google fonts
Uses the webfont loader to get the Google fonts which stops the flicker when jumping between system fonts and the Cairo Google font library.
2023-07-13 16:46:05 -04:00

98 lines
3.4 KiB
HTML

{% load static %}
<!DOCTYPE html>
<html>
<head>
<!-- Google fonts for Cairo -->
<script src="https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js"></script>
<script>
WebFont.load({
google: {
families: ['Cairo:200:latin', 'Cairo:300:latin', 'Cairo:400:latin', 'Cairo:500:latin', 'Cairo:600:latin', 'Cairo:700:latin', 'Cairo:800:latin']
}
});
</script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-1N51ZC252K"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-1N51ZC252K');
</script>
<title>{% block title %}Boost{% endblock %}</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="{% block description %}{% endblock %}">
<meta name="keywords" content="{% block keywords %}{% endblock %}">
<meta name="author" content="{% block author %}{% endblock %}">
<link rel="shortcut icon" href="{% static 'img/Boost_Symbol_Transparent.svg' %}" type="image/x-icon">
<link href="{% static 'css/styles.css' %}" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.css" />
<script src="//unpkg.com/alpinejs" defer></script>
<script src="https://unpkg.com/htmx.org@1.8.5" integrity="sha384-7aHh9lqPYGYZ7sTHvzP1t3BAfLhYSTy9ArHdP3Xsr9/3TlGurYgcPBoFmXX2TX/w" crossorigin="anonymous"></script>
<!-- TODO bring this local if we like it -->
<script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
<!-- detect dark or light mode -->
<script src="{% static 'js/DetectMode.js' %}"></script>
{% block extra_head %}{% endblock %}
</head>
<body x-init="() => {const m = localStorage.getItem('colorMode');
if (m !== 'dark' && m !== 'light') return;
mode = m;
}"
class="h-screen bg-gray-200 dark:bg-black font-cairo" {% block body_id %}{% endblock %}>
<div class="px-6 mx-auto md:mt-14">
{% include "includes/_header.html" %}
<div class="w-full">
{% block messages %}{% include "partials/messages.html" %}{% endblock messages %}
</div>
{% comment %}body block is for use in forums{% endcomment %}
{% block forum_body %}{% endblock %}
<div class="md:px-3 min-vh-110">
{% block content_wrapper %}
{% block subnav %}{% endblock %}
{% block content %}{% endblock %}
{% endblock %}
</div>
{% include "includes/_footer.html" %}
</div>
{% block footer_js %}{% endblock %}
<script>
function copyToClipboard() {
var text = document.getElementById("myText").innerText;
// Create a temporary textarea element
var tempTextArea = document.createElement("textarea");
tempTextArea.value = text;
document.body.appendChild(tempTextArea);
// Select and copy the text
tempTextArea.select();
document.execCommand("copy");
// Remove the temporary textarea
document.body.removeChild(tempTextArea);
alert("Text copied to clipboard");
}
</script>
</body>
</html>