111 lines
4.7 KiB
HTML
111 lines
4.7 KiB
HTML
<!DOCTYPE html>
|
|
<html class="{% if current_user.is_authenticated and current_user.theme_preference == 'dark' %}dark{% endif %}">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
|
<title>Function</title>
|
|
<link rel="icon" type="image/svg+xml"
|
|
href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='currentColor' class='w-6 h-6'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='m6.75 7.5 3 2.25-3 2.25m4.5 0h3m-9 8.25h13.5A2.25 2.25 0 0 0 21 18V6a2.25 2.25 0 0 0-2.25-2.25H5.25A2.25 2.25 0 0 0 3 6v12a2.25 2.25 0 0 0 2.25 2.25Z' /%3E%3C/svg%3E%0A" />
|
|
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900&display=swap" rel="stylesheet" />
|
|
<script src="/static/js/tailwindcss@3.2.4.js"></script>
|
|
<script>
|
|
tailwind.config = {
|
|
darkMode: 'class',
|
|
}
|
|
</script>
|
|
<script src="/static/js/htmx.min.js"></script>
|
|
<script src="/static/js/hyperscript.min.js"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.32.1/ace.min.js"
|
|
integrity="sha512-7QPOFYWq4euLbAVbG/o5YVgkotUdMiwFuFrVQc6lbqZuAcWnLp0sQ6JX2AIWqbm3wWrPuEfu9FqckItCgQzBWw=="
|
|
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.32.1/mode-javascript.min.js"
|
|
integrity="sha512-1OTGICMOnGWxRYfDZRUdv7qut0O8+9s7JPi6JNxlz1pdpHgDwPo1L0dzYKwftuIb0ossdBzWtkAlnyyYpIEp2A=="
|
|
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.32.1/theme-monokai.min.js"
|
|
integrity="sha512-g9yptARGYXbHR9r3kTKIAzF+vvmgEieTxuuUUcHC5tKYFpLR3DR+lsisH2KZJG2Nwaou8jjYVRdbbbBQI3Bo5w=="
|
|
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.32.1/theme-chrome.min.js" crossorigin="anonymous"
|
|
referrerpolicy="no-referrer"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.32.1/ext-language_tools.min.js"
|
|
referrerpolicy="no-referrer"></script>
|
|
|
|
<script src="/static/js/mithril.js"></script>
|
|
<script src="/static/js/mithril/editor.js"></script>
|
|
<script src="/static/js/mithril/responseView.js"></script>
|
|
<script src="/static/js/mithril/alert.js"></script>
|
|
<script src="/static/js/mithril/diffView.js"></script>
|
|
<script src="/static/js/mithril/FunctionHistory.js"></script>
|
|
<script src="{{ url_for('static', filename='js/mithril/TestRunner.js') }}"></script>
|
|
|
|
<script src="https://unpkg.com/ace-diff@^2"></script>
|
|
<link href="https://unpkg.com/ace-diff@^2/dist/ace-diff.min.css" rel="stylesheet">
|
|
|
|
<style>
|
|
@import url("https://rsms.me/inter/inter.css");
|
|
|
|
html {
|
|
font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI",
|
|
Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif,
|
|
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol",
|
|
"Noto Color Emoji";
|
|
}
|
|
|
|
/* Dark mode transition */
|
|
html.dark {
|
|
color-scheme: dark;
|
|
}
|
|
|
|
html,
|
|
body {
|
|
transition: background-color 0.3s ease, color 0.3s ease;
|
|
}
|
|
|
|
.gradient {
|
|
background-image: linear-gradient(-225deg, #cbbacc 0%, #2580b3 100%);
|
|
}
|
|
|
|
button,
|
|
.gradient2 {
|
|
background-color: #f39f86;
|
|
background-image: linear-gradient(315deg, #f39f86 0%, #f9d976 74%);
|
|
}
|
|
</style>
|
|
<script>
|
|
function toggleTheme() {
|
|
const html = document.documentElement;
|
|
const isDark = html.classList.contains('dark');
|
|
const newTheme = isDark ? 'light' : 'dark';
|
|
|
|
if (newTheme === 'dark') {
|
|
html.classList.add('dark');
|
|
} else {
|
|
html.classList.remove('dark');
|
|
}
|
|
|
|
// Dispatch event for components to listen to
|
|
window.dispatchEvent(new CustomEvent('themeChanged', { detail: { theme: newTheme } }));
|
|
|
|
// Send preference to backend
|
|
const formData = new FormData();
|
|
formData.append('theme', newTheme);
|
|
|
|
fetch('/settings/theme', {
|
|
method: 'POST',
|
|
body: formData
|
|
});
|
|
}
|
|
</script>
|
|
</head>
|
|
|
|
<body class="leading-relaxed tracking-wide flex flex-col bg-white dark:bg-gray-950 text-gray-900 dark:text-gray-50">
|
|
<div class="container mx-auto p-4 lg:p-1 min-h-screen h-full">
|
|
|
|
{% block content %}
|
|
|
|
{% endblock %}
|
|
</div>
|
|
</body>
|
|
|
|
</html> |