more visual updates

2 files changed, 10 insertions, 3 deletions

diff --git a/src/css/akn.css b/src/css/akn.css
index b7a03f1..c72c349 100644
--- a/src/css/akn.css
+++ b/src/css/akn.css
@@ -122,7 +122,7 @@ label {
 }
 
 input {
-    width: auto;
+    width: 100%;
     border: 0px;
     border-radius: 0px;
     padding: 1vh 1vw;
@@ -307,6 +307,12 @@ button {
     border: 1px solid #17392e;
     padding: 1vh 1vw;
     margin: 1px;
+    width: auto;
+    flex-shrink: 6;
+    flex-grow: 0;
+    text-align: center;
+    flex-flow: column;
+    word-break: normal;
 }
 
 button:hover {
diff --git a/src/index.html b/src/index.html
index f8de5d9..d07d4ce 100644
--- a/src/index.html
+++ b/src/index.html
@@ -70,20 +70,21 @@
                 <div id="welcome-section">
                     <h2>🏡 Home</h2>
                     <p>Welcome to Arching Kaos project.</p>
+                    <h3>Render explicit zblock</h3>
                     <div style="
                              padding: 1vh 1vw;
                              display: flex;
-                             flex-direction: column;
+                             flex-direction: row;
                              align-items: center;
                              gap: 10px;"
                         >
-                        <h3>Render explicit zblock</h3>
                         <input id="search-field" type="text" name="search" placeholder="Enter a zblock hash"/>
                         <button onclick="seekZblock(this.parentElement.querySelector('#search-field').value, ['search', false])">Render</button>
                     </div>
                     <div class="results-area">
                         <h3>Results</h3>
                     </div>
+                    <h3>Other options for loading</h3>
                     <div style="
                              display: flex;
                              flex-direction: row;