Skip to content

Instantly share code, notes, and snippets.

@wbadart
Created September 6, 2022 17:11
Show Gist options
  • Save wbadart/fd5435185a50261dff56780fcf2de290 to your computer and use it in GitHub Desktop.
Save wbadart/fd5435185a50261dff56780fcf2de290 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<!-- TODO: Main navigation links (Home, index, tags, ...) --><!-- DoNotFormat -->
<!-- DoNotFormat -->
<html lang='en'>
<head>
<meta charset='UTF-8' />
<meta name='viewport' content='width=device-width, initial-scale=1' />
<title>
A note – My Emanote Site
</title>
<meta property='og:description' content />
<meta property='og:site_name' content='My Emanote Site' />
<meta property='og:image' content />
<meta property='og:type' content='website' />
<meta property='og:title' content='A note' />
<base href='/' />
<link href='favicon.svg' rel='icon' />
<meta name='generator' content='Emanote' />
<link href='_emanote-live-server/tailwind/2.2.2/tailwind.min.css?t=1662480405' rel='stylesheet' type='text/css' />
<!-- Heist error element -->
<style>
strong.error {
color: lightcoral;
font-size: 90%;
font-family: monospace;
}
</style>
<!-- What goes in this file will appear on near the end of <head>--><link rel='preload' href='_emanote-static/fonts/Maven_Pro/WorkSans-VariableFont_wght.ttf' as='font' type='font/ttf' crossorigin />
<style>
@font-face {
font-family: 'WorkSans';
/* FIXME: This ought to be: ${ema:emanoteStaticLayerUrl}/fonts/Maven_Pro/WorkSans-VariableFont_wght.ttf */
src: url(_emanote-static/fonts/Work_Sans/WorkSans-VariableFont_wght.ttf) format(\"truetype\");
font-display: swap;
}
body {
font-family: 'WorkSans', sans-serif;
font-variation-settings: 'wght' 350;
}
a.mavenLinkBold {
font-variation-settings: 'wght' 400;
}
strong {
font-variation-settings: 'wght' 500;
}
h1,
h2,
h3,
h4,
h5,
h6,
header,
.header-font {
font-family: 'WorkSans', sans-serif;
}
h1 {
font-variation-settings: 'wght' 500;
}
h2 {
font-variation-settings: 'wght' 400;
}
h3 {
font-variation-settings: 'wght' 300;
}
</style>
<link rel='stylesheet' href='_emanote-static/inverted-tree.css' />
<link rel='stylesheet' href='https://files.stork-search.net/releases/v1.5.0/flat.css' />
<!-- Custom Stork-search styling for Emanote -->
<style>
#stork-search-container {
z-index: 1000;
background-color: rgb(15 23 42/.8);
}
.stork-overflow-hidden-important {
overflow: hidden !important;
}
</style>
<script src='https://files.stork-search.net/releases/v1.5.0/stork.js'></script>
<script data-emanote-base-url='/'>
window.emanote = {};
window.emanote.stork = {
searchShown: false,
toggleSearch: function () {
document.getElementById('stork-search-container').classList.toggle('hidden');
window.emanote.stork.searchShown = document.body.classList.toggle('stork-overflow-hidden-important');
if (window.emanote.stork.searchShown) {
document.getElementById('stork-search-input').focus();
}
},
clearSearch: function () {
document.getElementById('stork-search-container').classList.add('hidden');
document.body.classList.remove('stork-overflow-hidden-important');
window.emanote.stork.searchShown = false;
},
init: function () {
const indexName = 'emanote-search'; // used to match input[data-stork] attribute value
const baseUrl = document.currentScript.getAttribute('data-emanote-base-url') || '/';
const indexUrl = baseUrl + '-/stork.st';
if (document.readyState !== 'complete') {
window.addEventListener('load', function () {
stork.register(indexName, indexUrl);
});
document.addEventListener('keydown', event => {
if (window.emanote.stork.searchShown && event.key === 'Escape') {
window.emanote.stork.clearSearch();
event.preventDefault();
} else if ((event.key == 'k' || event.key == 'K') && (event.ctrlKey || event.metaKey)) {
window.emanote.stork.toggleSearch();
event.preventDefault();
}
});
} else {
// Override existing on Ema's hot-reload
stork.register(indexName, indexUrl, { forceOverwrite: true });
}
}
};
window.emanote.stork.init();
</script>
</head>
<!-- DoNotFormat -->
<!-- DoNotFormat -->
<body class='bg-gray-400 overflow-y-scroll'>
<div class='container mx-auto max-w-prose'>
<div class='mt-2 md:mt-4'>
<!-- DoNotFormat -->
<!-- DoNotFormat -->
<nav id='uptree' class='flipped tree' style='transform-origin: 50%;'>
<ul class='root'>
<li>
<ul>
<li>
<div class='text-gray-900 forest-link'>
<a href='kasten.html'>
kasten
</a>
</div>
<ul>
<li>
<div class='text-gray-900 forest-link'>
<a href=''>
Hello
</a>
</div>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</nav>
<div class='relative md:shadow-2xl md:mb-8'>
<div class='absolute -top-6 right-1 md:right-0 flex flex-row items-center justify-center'>
<a title='Search (Ctrl+K)' class='cursor-pointer' onclick='window.emanote.stork.toggleSearch()'>
<svg xmlns='http://www.w3.org/2000/svg' style='width: 1rem;' class='hover:text-blue-700' f
fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'>
<path stroke-linecap='round' stroke-linejoin='round' d='M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z'></path>
</svg>
</a>
</div>
<div class='flex-1 w-full overflow-x-auto bg-white'>
<main class='px-4 py-4'>
<h1 class='flex items-end justify-center mb-4 p-3 bg-blue-100 text-5xl font-extrabold text-black rounded'>
<a class='z-40 tracking-tighter '>
A note
</a>
</h1>
<article class='overflow-auto'>
<!-- What goes in this file will appear on top of note body-->
<!-- What goes in this file will appear below the note body-->
</article>
<div class='flex flex-col lg:flex-row lg:space-x-2'>
</div>
<section class='flex flex-wrap items-end justify-center my-4 space-x-2 space-y-2 font-mono text-sm'>
</section>
<!-- What goes in this file will at the very end of the main div -->
</main>
</div>
</div>
<footer class='flex items-center justify-center mt-2 mb-8 space-x-4 text-center text-gray-800'>
<div>
<a href='' title='Go to Home page'>
<svg xmlns='http://www.w3.org/2000/svg' class='w-6 h-6 hover:text-blue-700' fill='none' viewBox='0 0 24 24' stroke='currentColor'>
<path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6'></path>
</svg>
</a>
</div>
<div>
<a href='-/all.html' title='View Index'>
<svg class='w-6 h-6 hover:text-blue-700' fill='none' stroke='currentColor' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'>
<path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5l-5-5m5 5v-4m0 4h-4'>
</path>
</svg>
</a>
</div>
<div>
<a href='https://emanote.srid.ca' target='_blank' title='Generated by Emanote 0.7.8.2'>
<img class='w-6 h-6 hover:text-blue-700' src='_emanote-static/emanote-logo.svg' />
</a>
</div>
<div>
<a href='-/tags.html' title='View tags'>
<svg class='w-6 h-6 hover:text-blue-700' fill='none' stroke='currentColor' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'>
<path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M7 7h.01M7 3h5c.512 0 1.024.195 1.414.586l7 7a2 2 0 010 2.828l-7 7a2 2 0 01-2.828 0l-7-7A1.994 1.994 0 013 12V7a4 4 0 014-4z'>
</path>
</svg>
</a>
</div>
<div>
<a href='-/tasks.html' title='View tasks'>
<svg xmlns='http://www.w3.org/2000/svg' class='w-6 h-6 hover:text-blue-700' fill='none' viewBox='0 0 24 24' stroke='currentColor'>
<path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z'></path>
</svg>
</a>
</div>
</footer>
</div>
</div>
<div id='stork-search-container' class='hidden fixed w-screen h-screen inset-0 backdrop-filter backdrop-blur-sm'>
<div class='fixed w-screen h-screen inset-0' onclick='window.emanote.stork.toggleSearch()'></div>
<div class='container mx-auto p-10 mt-10'>
<div class='stork-wrapper-flat container mx-auto'>
<input id='stork-search-input' data-stork='emanote-search' class='stork-input' placeholder='Search (Ctrl+K) ...' />
<div data-stork='emanote-search-output' class='stork-output'></div>
</div>
</div>
</div>
</body>
</html><!--
The inline CSS here is roughly analogous to the ones generated by Tailwind.
See the original version based on Tailwind`: https://gist.github.com/srid/2471813953a6df9b24909b9bb1d3cd2b
-->
<div style=\"
display: none;
position: absolute;
top: 0px;
left: 0px;
padding: 0.5rem;
font-size: 12px;
line-height: 18px;
tab-size: 4;
text-size-adjust: 100%;
\" id=\"ema-indicator\">
<div style=\"
display: flex;
overflow: hidden;
font-size: 0.75rem;
align-items: center;
gap: 0.5rem;
padding: 0.5rem;
height: 2rem;
width: 2rem;
box-sizing: border-box;
border-style: solid;
border-width: 2px;
border-color: rgb(229 231 235);
background-color: rgb(255 255 255);
border-radius: 9999px;
box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
transition-property: width, height;
transition-duration: 500ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
\" onMouseOver=\"this.style.width='100%'\" onMouseOut=\"this.style.width='2rem'\" id=\"ema-status\" title=\"Ema Status\">
<div hidden style=\"
flex: none;
width: 0.75rem;
height: 0.75rem;
background-color: rgb(22 163 74);
border-radius: 9999px;
\" id=\"ema-connected\"></div>
<div hidden style=\"
flex: none;
width: 0.75rem;
height: 0.75rem;
border-radius: 9999px;
animation: spin 1s linear infinite;
background-image: linear-gradient(to right, var(--tw-gradient-stops));
--tw-gradient-from: #93c5fd;
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
--tw-gradient-to: #2563eb;
\" id=\"ema-reloading\">
<style>
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
</style>
</div>
<div hidden style=\"
flex: none;
width: 0.75rem;
height: 0.75rem;
border-radius: 9999px;
background-color: rgb(234 179 8);
\" id=\"ema-connecting\">
<div style=\"
flex: none;
width: 0.75rem;
height: 0.75rem;
border-radius: 9999px;
background-color: rgb(234 179 8);
animation: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
\">
<style>
@keyframes ping {
75%,
100% {
transform: scale(2);
opacity: 0;
}
}
</style>
</div>
</div>
<div hidden style=\"
flex: none;
width: 0.75rem;
height: 0.75rem;
border-radius: 9999px;
background-color: rgb(239 68 68);
\" id=\"ema-disconnected\"></div>
<p style=\"white-space: nowrap;\" id=\"ema-message\"></p>
</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment