chor: implement vertical placement of two data-containers

Author: cronnoss

src/App.css

@@ -34,11 +34,16 @@
     }
 }
 
-.container {
-    display: grid;
-    grid-template-columns: 1fr 1fr;
-    gap: 40px;
-    text-align: start;
+.data-container {
+    border: 1px solid #494949;
+    padding: 15px;
+    border-radius: 5px;
+    background-color: rgb(243, 244, 245);
+    margin: 15px 0px;
+}
+
+.data-container:first-child {
+    padding-bottom: 0px;
 }
 
 .read-the-docs {

src/App.tsx

@@ -21,7 +21,7 @@ function App() {
         <div>
             <TonConnectButton/>
 
-            <div className="container">
+            <div className="data-container">
                 <div>
                     <h3>Contract Data:</h3>
                     <b>Our contract Address:</b>
@@ -53,6 +53,8 @@ function App() {
                         <div>{counter_value ?? "Loading..."}</div>
                     </>
                 </div>
+            </div>
+            <div className="data-container">
                 <div>
                     <h3>Contract actions: </h3>
                     {connected ? (