From 61a3c3b929db0ad7d7b4fd9484ff98cac019afa4 Mon Sep 17 00:00:00 2001
From: lolabird <octavia@octavianichols.com>
Date: Wed, 27 Dec 2023 13:52:37 -0700
Subject: [PATCH] Move initial calculations to top screen

---
 script.js | 11 +++++++----
 style.css |  7 ++++---
 2 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/script.js b/script.js
index c38048b..88e142c 100644
--- a/script.js
+++ b/script.js
@@ -1,4 +1,5 @@
 const mainScreen = document.querySelector(".main-screen");
+const topScreen = document.querySelector(".top-screen");
 const buttons = document.querySelectorAll("button");
 const operators = ["+", "-", "*", "/"];
 
@@ -10,8 +11,9 @@ buttons.forEach((button) => {
 function displayToScreen() {
     if (this.className == "equal") {
         let calc = new Calculator;
+        topScreen.textContent += mainScreen.textContent;
 
-        mainScreen.textContent = calc.calculate(mainScreen.textContent);
+        mainScreen.textContent = calc.calculate(topScreen.textContent);
     } else if (this.classList.contains("all")) {
         mainScreen.textContent = "0";
     } else if (this.classList.contains("error") && mainScreen.textContent !== "0") {
@@ -27,7 +29,7 @@ function displayToScreen() {
             }
     } else {
         if (this.className == "operator") {
-            let screenContent = mainScreen.textContent;
+            let screenContent = topScreen.textContent;
 
             // Add some logic for handling negatives with -
             // Add key support
@@ -37,13 +39,14 @@ function displayToScreen() {
                 if (operators.includes(screenContent[i])) {
                     let calc = new Calculator;
 
-                    result = calc.calculate(mainScreen.textContent);
+                    result = calc.calculate(topScreen.textContent);
                     mainScreen.textContent = result;
                     break;
                 }
             } 
 
-            mainScreen.textContent += " " + this.textContent + " ";
+            topScreen.textContent += mainScreen.textContent + " " + this.textContent + " ";
+            mainScreen.textContent = "0";
 
         } else if (mainScreen.textContent === "0" && this.className == "num") {
             mainScreen.textContent = this.textContent;
diff --git a/style.css b/style.css
index 8d4dcd3..789a1bd 100644
--- a/style.css
+++ b/style.css
@@ -39,15 +39,16 @@ main {
     background: #eee;
     color: #111;
     text-align: right;
-    font-size: 80px;
     display: flex;
     flex-direction: column;
 }
 .top-screen {
-    height: 20%;
+    height: 40%;
+    font-size: 20px;
 }
 .main-screen {
-    height: 80%;
+    height: 60%;
+    font-size: 50px;
 }
 
 button {