-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
109 lines (105 loc) · 4.72 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
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<!DOCTYPE html>
<html>
<head>
<title>Calculator</title>
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/style.css">
<script src="script.js" defer></script>
</head>
<body>
<header>
<p>Instructions</p>
<img src="down-arrow.png" id="instructionsArrow">
</header>
<main id="calculator">
<div id="instructionsContainer">
<div id="instructionsTextContainer">
<div id="instructionsHeader">
<p>Usage = U</p>
<p>Keyboard = K</p>
</div>
<div id="instructionsContent">
<div class="instructionsItems">
<p class="instructionsDeletes">AC</p>
<p>U = CLEAR</p>
<p>K = ESCAPE</p>
</div>
<div class="instructionsItems">
<p class="instructionsDeletes">DEL</p>
<p>U = DELETE</p>
<p>K = BACKSPACE</p>
</div>
<div class="instructionsItems">
<p class="instructionsOperators">/</p>
<p>U = DIVIDE</p>
<p>K = /</p>
</div>
<div class="instructionsItems">
<p class="instructionsOperators">*</p>
<p>U = MULTIPLY</p>
<p>K = *</p>
</div>
<div class="instructionsItems">
<p class="instructionsOperators">-</p>
<p>U = SUBTRACT</p>
<p>K = -</p>
</div>
<div class="instructionsItems">
<p class="instructionsOperators">+</p>
<p>U = ADD</p>
<p>K = +</p>
</div>
<div class="instructionsItems">
<p class="instructionsOperators">x<sup>y</sup></p>
<p>U = EXPONENTIATION</p>
<p>K = SHIFT + N</p>
</div>
<div class="instructionsItems">
<p class="instructionsOperators">x!</p>
<p>U = FACTORIAL</p>
<p>K = SHIFT + !</p>
</div>
<div class="instructionsItems">
<p class="instructionsOthers">=</p>
<p>U = CALCULATE</p>
<p>K = ENTER</p>
</div>
<div class="instructionsItems">
<p class="instructionsOthers">.</p>
<p>U = DECIMAL</p>
<p>K = .</p>
</div>
</div>
</div>
</div>
<div id="display">
<p id="displayResult" class="displayText"></p>
<p id="displayInput" clasS="displayText">0</p>
</div>
<div id="clear" class="Escape button"><span>AC</span></div>
<div id="undo" class="Backspace button"><span>DEL</span></div>
<div id="divide" class="/ button operator"><span>/</span></div>
<div id="multiply" class="* button operator"><span>*</span></div>
<div id="subtract" class="- button operator"><span>-</span></div>
<div id="add" class="+ button operator"><span>+</span></div>
<div id="power" class="N button advancedOperator"><span>x<sup>y</sup></span></div>
<div id="factorial" class="! button advancedOperator"><span>x!</span></div>
<div id="equals" class="Enter button"><span>=</span></div>
<div id="decimal" class=". button"><span>.</span></div>
<div id="zero" class="0 button number"><span>0</span></div>
<div id="one" class="1 button number"><span>1</span></div>
<div id="two" class="2 button number"><span>2</span></div>
<div id="three" class="3 button number"><span>3</span></div>
<div id="four" class="4 button number"><span>4</span></div>
<div id="five" class="5 button number"><span>5</span></div>
<div id="six" class="6 button number"><span>6</span></div>
<div id="seven" class="7 button number"><span>7</span></div>
<div id="eight" class="8 button number"><span>8</span></div>
<div id="nine" class="9 button number"><span>9</span></div>
</main>
<footer>
<p id="codeWriter">Code written by: <a href='https://github.com/Godnoken' target='_blank'>Godnoken<img src='github.svg' id='githubIcon'></p>
</footer>
</body>
</html>