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