miloignis/kraken
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add theming and a 'slick' theme based on Inter and JetBrains Mono

Browse Source
This commit is contained in:
Nathan Braswell
2023-03-25 16:59:24 -04:00
parent 049624a840
commit 70ac3e3633
6 changed files with 371 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

96
website/index.html
View File

@@ -2,93 +2,13 @@
<html lang="en-us">
<meta charset="UTF-8">
<head>
<style>
@font-face {
font-family: 'Recursive';
font-style: oblique 0deg 15deg;
font-weight: 300 1000;
font-display: swap;
src: url(./Recursive.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root {
--rec-wght: 400;
--rec-slnt: 0;
--rec-mono: 0;
--rec-casl: 0;
--rec-csrv: 0;
}
* {
font-variation-settings: "wght" var(--rec-wght),
"slnt" var(--rec-slnt),
"MONO" var(--rec-mono),
"CASL" var(--rec-casl),
"CRSV" var(--rec-csrv);
}
body {
max-width: 45em;
margin: 1em auto;
padding: 0 .62em;
font: 1.2em/1.62 'Recursive', sans-serif;
}
h1, h2, h3, h4 {
line-height:1.2;
--rec-wght: 700;
--rec-casl: 1;
--rec-crsv: 1;
}
h1 {
line-height:0.7;
font-size: 4em;
--rec-wght: 900;
--rec-slnt: -15;
text-decoration: underline;
text-decoration-thickness: 0.4rem;
//border-bottom: 0.08em solid;
//border-left: 0.1em solid;
//display: inline-block;
}
h2 { font-size: 3em; }
h3 { font-size: 1.5em; }
h4 { font-size: 1.2em; }
i { --rec-slnt: -14; }
b { --rec-wght: 600; }
.run_container { position: relative; }
.editor {
font-family: 'Recursive', monospace;
font-size: 1rem;
--rec-mono: 1;
border-radius: 6px;
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
height: 7em;
letter-spacing: normal;
tab-size: 4;
}
.output {
margin-block-start: 1rem;
font-family: 'Recursive', monospace;
font-size: 1rem;
--rec-mono: 1;
tab-size: 4;
height: 5em;
width: 100%;
}
.run_button {
font-family: 'Recursive', sans-serif;
font-size: 1em;
--rec-wght: 900;
--rec-slnt: -15;
--rec-casl: 1;
--rec-crsv: 1;
position: absolute;
top: 0;
right: 0;
}
</style>
<link id="theme" rel="stylesheet" type="text/css" href="slick.css"/>
<!--<link id="theme" rel="stylesheet" type="text/css" href="recursive.css"/>-->
</head>
<body>
<header><h1>Kraken</h1></header>
<i>FOSS Fexprs: <a title="Kraken on GitHub" href="https://github.com/limvot/kraken">https://github.com/limvot/kraken</a></i>
<button onclick="toggleTheme()" style="float: right;">Swap Theme</button>
<br>
<h3>Demo:</h3>
<div class="run_container">
@@ -103,7 +23,7 @@
<h3>Concept:</h3>
<ul>
<li> Minimal, purely functional Kernel/Scheme as core language, with Kernel/Vau calculus inspiration oblivating the need for non-reader macros (<a title="Kernel/Vau calculus thesis" href="https://web.wpi.edu/Pubs/ETD/Available/etd-090110-124904/unrestricted/jshutt.pdf">Kernel/Vau calculus thesis</a>)
<li> Partial evaluation to make fexprs fast (my PhD research!)
<li> Partial evaluation to make fexprs fast (my PhD research! First paper on <a href="https://arxiv.org/abs/2303.12254">arXiv</a>)
<li> Implement Type Systems as Macros (but using Fexprs instead of macros) (<a title="type systems as macros paper 1" href="http://www.ccs.neu.edu/home/stchang/pubs/ckg-popl2017.pdf">paper, up to System Fω</a>) (<a title="type systems as macros paper 2" href="https://www.ccs.neu.edu/home/stchang/pubs/cbtb-popl2020.pdf">second paper, up to dependent types</a>)
<li> Use fexprs to bootstrap more complex features, like delimited continuations
<li> Use above "type systems as fexprs" to add types and create a statically-typed language on top (with Algebraic Effects using the underlying delimited continuations, etc)
@@ -152,6 +72,14 @@
document.getElementById(new_output_name).value = "running...\n";
Module.callMain(["-C", code]);
}
function toggleTheme() {
let theme = document.getElementById('theme')
if (theme.getAttribute("href") == "recursive.css") {
theme.setAttribute("href", "slick.css");
} else {
theme.setAttribute("href", "recursive.css");
}
}
</script>
<script type="text/javascript" src="k_prime.js"></script>
</body>