1
commit
8346b44c3c
@ -0,0 +1,39 @@
|
|||||||
|
body {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
height: 100vh;
|
||||||
|
margin: 0;
|
||||||
|
background-color: #f0f0f0;
|
||||||
|
}
|
||||||
|
.calculator {
|
||||||
|
background-color: white;
|
||||||
|
padding: 20px;
|
||||||
|
border-radius: 10px;
|
||||||
|
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
.display {
|
||||||
|
background-color: #222;
|
||||||
|
color: white;
|
||||||
|
text-align: right;
|
||||||
|
padding: 20px;
|
||||||
|
font-size: 2em;
|
||||||
|
border-radius: 5px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.buttons {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(4, 1fr);
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
button {
|
||||||
|
padding: 20px;
|
||||||
|
font-size: 1.5em;
|
||||||
|
border: none;
|
||||||
|
border-radius: 5px;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: background-color 0.3s;
|
||||||
|
}
|
||||||
|
button:hover {
|
||||||
|
background-color: #eee;
|
||||||
|
}
|
@ -0,0 +1,71 @@
|
|||||||
|
let display = document.getElementById('display');
|
||||||
|
let currentInput = '';
|
||||||
|
let previousInput = '';
|
||||||
|
let operation = null;
|
||||||
|
|
||||||
|
function appendNumber(number) {
|
||||||
|
currentInput += number;
|
||||||
|
display.textContent = currentInput;
|
||||||
|
}
|
||||||
|
|
||||||
|
function appendDecimal(dot) {
|
||||||
|
if (!currentInput.includes(dot)) {
|
||||||
|
currentInput += dot;
|
||||||
|
display.textContent = currentInput;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function chooseOperation(op) {
|
||||||
|
if (currentInput === '') return;
|
||||||
|
if (previousInput !== '') {
|
||||||
|
calculateResult();
|
||||||
|
}
|
||||||
|
operation = op;
|
||||||
|
previousInput = parseFloat(currentInput);
|
||||||
|
currentInput = '';
|
||||||
|
}
|
||||||
|
|
||||||
|
function clearDisplay(clear) {
|
||||||
|
if (clear === 'C') {
|
||||||
|
display.textContent = '0';
|
||||||
|
currentInput = '';
|
||||||
|
previousInput = '';
|
||||||
|
operation = null;
|
||||||
|
} else if (clear === 'AC') {
|
||||||
|
// Full reset (not implemented in basic example)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function calculateResult(equals) {
|
||||||
|
let result;
|
||||||
|
const prev = previousInput;
|
||||||
|
const curr = parseFloat(currentInput);
|
||||||
|
if (isNaN(prev) || isNaN(curr)) return;
|
||||||
|
|
||||||
|
switch (operation) {
|
||||||
|
case '+':
|
||||||
|
result = prev + curr;
|
||||||
|
break;
|
||||||
|
case '-':
|
||||||
|
result = prev - curr;
|
||||||
|
break;
|
||||||
|
case '*':
|
||||||
|
result = prev * curr;
|
||||||
|
break;
|
||||||
|
case '/':
|
||||||
|
result = prev / curr;
|
||||||
|
break;
|
||||||
|
case '%':
|
||||||
|
result = prev % curr;
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
display.textContent = result;
|
||||||
|
previousInput = result;
|
||||||
|
currentInput = '';
|
||||||
|
operation = null;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Bind equals button to calculate result
|
||||||
|
document.querySelector('button[onclick="calculateResult(\'=\')"]').addEventListener('click', calculateResult);
|
Loading…
Reference in new issue