-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
52 lines (43 loc) · 1.94 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
<!DOCTYPE html>
<html lang="en">
<head>
<title>divjot</title>
<meta charset="UTF-8">
<link rel="stylesheet" href="divjot.css">
<script defer src="divjot.js"></script>
</head>
<body>
<div id="divjot-markup"> <!-- This is where users' html is 'sent'--> </div>
<div id="divjot-wrapper" spellcheck="false">
<section class="top-ui-section">
<label>Load Content</label>
<input id="user-fileinput" type="file"
title="Load HTML or other files from your computer into the HTML editor.">
</input>
<label>Import</label>
<input id="import-fileinput" type="text"
title="Import JS & CSS file resources. Links are appended to the document <head>">
</input>
<button id="import-button"> + </button>
</section>
<section class="editor-section">
<textarea class="divjot-editors" id="divjot-html" placeholder=" HTML "></textarea>
<textarea class="divjot-editors" id="divjot-css" placeholder=" CSS "></textarea>
<textarea class="divjot-editors" id="divjot-js" placeholder=" JS "></textarea>
</section>
<div class="divjot-controls">
<input id="opacity-control" type ="range" min="0.1" max="1" step="0.1" ></input>
<button class="control-buttons" id="dark-button"> dark </button>
<button class="control-buttons" id="light-button">light</button>
<button class="control-buttons" id="fsize-smaller-button"> - </button>
<button class="control-buttons" id="fsize-bigger-button"> + </button>
<button class="control-buttons" id="html-button"> html </button>
<button class="control-buttons" id="css-button"> css </button>
<button class="control-buttons" id="js-button"> js </button>
<button class="control-buttons" id="run-button">run</button>
</div>
</div> <!-- end div id: divjot-wrapper -->
<!-- This is where users' css is sent -->
<style id = "divjot-style"></style>
</body>
</html>