-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.html
61 lines (58 loc) · 2.34 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>TypoScript Prayground</title>
</head>
<body>
<div class="bg_pattern Diagonal_v2"></div>
<nav class="flex items-center justify-between flex-wrap bg-blue-500 p-3">
<div class="flex items-center flex-shrink-0 text-white mr-6">
<img src="./assets/typo.png" id="icon"> <span class="font-black text-xl px-2 ">TypoScript Prayground</span>
</div>
<div class="w-full block flex-grow lg:flex lg:items-center lg:w-auto">
<div class="text-sm lg:flex-grow-0 mr-6">
<a href="https://github.com/kurehajime/typoscript/blob/main/docs.md"
class="block mt-4 lg:inline-block lg:mt-0 text-teal-200 hover:text-white">
Docs
</a>
</div>
<div class="text-sm lg:flex-grow-0 mr-6">
<a href="https://github.com/kurehajime/typoscript"
class="block mt-4 lg:inline-block lg:mt-0 text-teal-200 hover:text-white">
Github
</a>
</div>
</div>
</nav>
<div class="md:container md:mx-auto">
<p class="block py-2 px-2 my-2">
TypoScript is JavaScript-like language with <b>typos</b>.<br>
Some typos in variable and function names are acceptable.
</p>
<textarea id="code" rows="15" cols="80" spellcheck="false"
class="py-2 px-2 my-2 block border-solid border-4 border-gray-200 rounded-lg w-full text-slate-50 bg-slate-900">
function fizz_buzz(count) {
for (var i = 1; i <= caunt; i++) {
if (i % 3 === 0 && i % 5 === 0) {
print("FizzBuzz")
} else if (i % 3 === 0) {
print("Fizz")
} else if (i % 5 === 0) {
print("Buzz")
} else {
qrint(i)
}
}
}
// Look closely❗
fizz_dazz(15)
</textarea>
<button id="run"
class="py-2 px-2 my-2 block bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded w-full">Run</button>
<textarea id="result" rows="5" cols="80" spellcheck="false" readonly
class="py-2 px-2 my-2 block border-solid border-4 border-gray-200 rounded-lg w-full text-slate-50 bg-slate-900">
</textarea>
</div>
</body>
</html>