stopped number from exceeding bounds of screen
This commit is contained in:
parent
03f6a7b8af
commit
adf5215e16
32
src/App.css
32
src/App.css
|
@ -43,6 +43,7 @@ background: linear-gradient(351deg, rgba(68,64,64,1) 0%, rgba(156,150,150,1) 100
|
|||
|
||||
#calculator-content > header{
|
||||
grid-area: header;
|
||||
align-self: center;
|
||||
font-family: 'Roboto', sans-serif;
|
||||
|
||||
}
|
||||
|
@ -88,7 +89,6 @@ background: linear-gradient(351deg, rgba(68,64,64,1) 0%, rgba(156,150,150,1) 100
|
|||
#display-container > p {
|
||||
margin:auto 0;
|
||||
text-align: right;
|
||||
line-height:1em;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
|
@ -141,11 +141,35 @@ background: linear-gradient(351deg, rgba(68,64,64,1) 0%, rgba(156,150,150,1) 100
|
|||
|
||||
|
||||
button{
|
||||
background: linear-gradient(351deg, rgba(92,92,92,0.9) 0%, rgba(224,224,224,0.9) 100%);
|
||||
background-blend-mode: multiply;
|
||||
|
||||
background: rgb(92,92,92);
|
||||
background: linear-gradient(351deg, rgba(92,92,92,1) 0%, rgba(224,224,224,1) 100%);
|
||||
font-size: 30px;
|
||||
font-size: 3rem;
|
||||
place-self: stretch;
|
||||
border-radius: 1.5rem;
|
||||
}
|
||||
|
||||
.num-pad > button{
|
||||
background-color: lightblue;
|
||||
|
||||
}
|
||||
|
||||
.operator-pad > button{
|
||||
font-size: 3.5em;
|
||||
}
|
||||
|
||||
.function-pad > button{
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
#off{
|
||||
background-color: #FF9B9B;
|
||||
}
|
||||
|
||||
#on{
|
||||
background-color: #CBFFA9;
|
||||
}
|
||||
|
||||
#clear{
|
||||
background-color: #FFD6A5;
|
||||
}
|
|
@ -9,12 +9,13 @@ export default function Calculator(props) {
|
|||
|
||||
const map = {
|
||||
conc: (numberString) => {
|
||||
if(main.length<=9){
|
||||
if (main[0] === "0") {
|
||||
setMain(prev => prev.slice(1) + numberString)
|
||||
} else {
|
||||
setMain(prev => prev + numberString)
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
zero: function () { this.conc("0") },
|
||||
|
@ -92,7 +93,8 @@ export default function Calculator(props) {
|
|||
setOperation("")
|
||||
},
|
||||
calculate: function (a, b) {
|
||||
return this.operations[operation](parseFloat(a), parseFloat(b)).toString()
|
||||
const string = this.operations[operation](parseFloat(a), parseFloat(b)).toString()
|
||||
return string.length<=9?string:string.slice(0,10)
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue