diff --git a/Calculator/saikrishna823/calculator.js b/Calculator/saikrishna823/calculator.js new file mode 100644 index 000000000..6b8a64f0e --- /dev/null +++ b/Calculator/saikrishna823/calculator.js @@ -0,0 +1,16 @@ +let inputBtn=document.getElementById("inputBtn") +let buttons=document.querySelectorAll(".button"); +const evalButton=document.getElementById("evalButton"); +const clearBtn=document.querySelector(".clearBtn"); +buttons.forEach((button)=>{ + button.onclick=()=>{ + inputBtn.value+=button.textContent; + } + }) +; +evalButton.onclick=()=>{ + inputBtn.value=eval(inputBtn.value); +} +clearBtn.onclick=()=>{ + inputBtn.value=" "; +} \ No newline at end of file diff --git a/Calculator/saikrishna823/index.html b/Calculator/saikrishna823/index.html new file mode 100644 index 000000000..5d8b34253 --- /dev/null +++ b/Calculator/saikrishna823/index.html @@ -0,0 +1,37 @@ + + + + + Calculator + + + + + +

Calculator

+
+ + +
+
+
1
+
2
+
3
+
/
+
4
+
5
+
6
+
-
+
7
+
8
+
9
+
+
+
.
+
0
+ +
*
+
+
+ + + \ No newline at end of file diff --git a/Calculator/saikrishna823/styles.css b/Calculator/saikrishna823/styles.css new file mode 100644 index 000000000..43d1942d0 --- /dev/null +++ b/Calculator/saikrishna823/styles.css @@ -0,0 +1,63 @@ +*,body,html{ + box-sizing: border-box; + margin:0px; + +} +h1{ + margin:5px; + color:brown; + text-transform: uppercase; + text-decoration:solid; + +} +body{ + background-color: beige; +} +#container{ + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; + margin:100px; +} +.input-buttons{ + margin:10px; + display: grid; + grid-template-columns:repeat(4,55px); + grid-template-rows:repeat(4,35px); + gap:10px; + +} +.button{ + padding:5px; + background-color: rgb(77, 10, 139); + text-align: center; + color: white; + border-radius: 10px; + font-size: x-large; +} +#evalButton{ + background-color:rgb(239, 14, 194); + text-align: center; + color: white; + border-color:greenyellow; + border-radius: 10px; + font-size:x-large; + +} +#evalButton:hover,focus,active{ + outline: none; +} +#inputBtn{ + border-radius:4px; + height:28px; + width:220px; +} +.clearBtn{ + border-radius:3px; + padding:2px; + text-align: center; + font-size: larger; + color: white; + background-color:rgb(239, 14, 194); +} \ No newline at end of file