onEditor/index.html at main · hackclubiter/onEditor · GitHub

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
62
63
64
65
66
67
68
69
70
71
72
73
<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width,initial-scale=1" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <title>onEditor</title>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="" />
    <link rel="shortcut icon" href="https://avatars.githubusercontent.com/u/73450347?s=100&v=4" type="image/x-icon">
    <link rel="stylesheet" href="./CSS/desktop.css">
</head>
<body>
<main>
    <div class="error">
        <p class="message">Please use a larger device to open this else use our mobile version of this code editor.</p>
        <a class="error-btn" href="./mob.html"><button>Go here</button></a>
    </div>
    <div class="header">
        <div class="header-left">
            <div class="brand-logo">
                <img src="https://avatars.githubusercontent.com/u/73450347?s=100&v=4" alt="">
            </div>
            <h1 class="brand-title">onEditor</h1>
        </div>
        <div class="header-right">

            <div class="lang">
                <h4>Language</h4>
            </div>
            <div class="options">
                <select id="lang" style="width:100px; border-radius: 10px !important; height: 30px;">
                    <option selected="selected">Python</option>
                    <option>Java</option>
                    <option>C++</option>
                    <option>C</option>
                </select>
            </div>
        </div>
    </div>
    <div class="container">

        <div class="code">
            <div class="code-title title">Code</div>
            <textarea id="source" placeholder="Enter your code here" class="code-textarea"></textarea>
        </div>
        <div class="output">
            <div class="output-title title">Output</div>
            <textarea readonly="readonly" id="output"  placeholder="Output" class="output-textarea"></textarea>
        </div>
        <div class="button-container">
            <button id="run" onclick="run()" class="run-button button">Run</button>
            <button onclick="javascript:eraseText()" class="clear-button button">Clear All</button>
        </div>
        <div class="input">
            <div class="input-title title">Input</div>
            <textarea id="input" placeholder="Enter your input here" class="input-textarea"></textarea>
        </div>
    </div>
    <footer>

            <p>Copyright of Hack Club ITER 2021</p>
    </footer>
</main>
<script src="./JS/index.js"></script>
<script>
    function eraseText() {
    document.getElementById("source").value = "";
    document.getElementById("output").value = "";
    document.getElementById("input").value = "";
}
</script>
</body>
</html>