Skip to content

Commit

Permalink
Add files via upload
Browse files Browse the repository at this point in the history
  • Loading branch information
@dinduoweh
dinduoweh authored Aug 28, 2023
1 parent 8de667a commit c307354
Show file tree
Hide file tree
Showing 2 changed files with 122 additions and 0 deletions.
64 changes: 64 additions & 0 deletions index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,64 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Calculator using javasript -Easy Tutorials</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container">
<div class=" calculator">
<form >
<div class="display">
<input type="text" name="display" id="">
</div>
<div>
<input type="button" value=" mc" onclick="display.value += 'mc'">
<input type="button" value=" m+" onclick="display.value += 'm+'">
<input type="button" value=" m-" onclick="diplay.value += 'm-'">
<input type="button" value=" mr" onclick="display.value += 'mr'">

</div>
<div>
<input type="button" value=" c" onclick=" display.value += 'c' ">
<input type="button" value=" " >
<input type="button" value=" x" onclick="diplay.value += 'x'">
<input type="button" value=" del" onclick="display.value += 'del'">

</div>
<div>
<input type="button" value="7" onclick="diplay.value += '7' ">
<input type="button" value="8" onclick=" display.value += '8' ">
<input type="button" value="9" onclick=" display.value += '9' " >
<input type="button" value="-" onclick="display.value += '-' " >

</div>
<div>
<input type="button" value="4" onclick="display.value += '4' " >
<input type="button" value="5" onclick=" display.value += '5' ">
<input type="button" value="6" onclick=" display.value += '6' ">
<input type="button" value=" +" onclick="display.value += '+' ">

</div>
<div>
<input type="button" value=" 1" onclick="display.value += '1' ">
<input type="button" value=" 2" onclick=" display.value += '2' ">
<input type="button" value=" 3" onclick=" display.value += '3' ">
<input type="button" value=" =" onclick=" display.value += '=' ">

</div>
<div>
<input type="button" value=" %" onclick="diplay.value += '%'">
<input type="button" value=" 0" onclick="diplay.value += '0'">
<input type="button" value=" ." onclick="diplay.value += '.'">
<input type="button" value="00" onclick="diplay,value += '00'">


</div>
</form>
</div>
</div>

</body>
</html>
58 changes: 58 additions & 0 deletions style.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
*{
margin: o;
padding: 0;
font-family: 'poppins', sans-serif;
box-sizing: border-box;

}

.container{
width: 100%;
height: 100vh;
background:darkcyan;
display: flex;
align-items: center;
justify-content:center ;
}


.calculator{
background:dimgrey;
padding: 20px;
border-radius: 10px;
}


.calculator form input{
border: 0;
outline: 0;
width: 60px;
height: 60px;
border-radius: 10px;
box-shadow: -8px -8px 15px rgba(225, 225, 225, 0.1),5px 5px 15px rgba(0, 0, 0, 0.2);
/* background: transparent; */
font-size: 20px;
color: darkolivegreen;
cursor: pointer;
margin: 10px;

}


form .display {
display: flex;
justify-content: flex-end;
margin: 20px 0;
}

form .display input {
text-align: right;
flex: 1;
font-size: 45px;
box-shadow: none;
}

/*
form input.equal{
width: 145px;
} */

1 comment on commit c307354

@dinduoweh
Copy link
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@owehjeremy1234456 nice one

Please sign in to comment.