make pastebin page a bit better

socraticDevBlog · Jan 2, 2024 · ecf9b23 · ecf9b23
1 parent e2f3c4f
commit ecf9b23
Showing 1 changed file with 38 additions and 3 deletions.
diff --git a/pastebin.html b/pastebin.html
@@ -1,13 +1,46 @@
 <sergey-import src="header">
   <title>dailybuild pastebin;#dailybuild</title>
 </sergey-import>
-<div class="project row slider-text align-items-center justify-content-center" style="padding-top: 80px;"></div>
 
-<h1 style="color: orange;">poor man cloud-native pastebin</h1>
+<style>
+  pastebin-body {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      height: 50vh; /* Set the body to full height of the viewport */
+      margin: 0; /* Remove default margin */
+  }
+
+  .centered-div {
+      text-align: center; /* Optional: Align content within the centered div */
+      padding: 5em; /* Optional: Add padding for better visual appearance */
+  }
+
+  #textInput {
+            width: 70%;
+            height: 10em;
+            padding: 10px;
+            margin-top: 2em;
+            box-sizing: border-box;
+            margin-bottom: 10px;
+        }
+
+        .green-button {
+            background-color: green;
+            color: white;
+            padding: 1em;
+            border: none;
+            cursor: pointer;
+        }
+</style>
+
+<div class="project pastebin-body row slider-text align-items-center justify-content-center" style="padding-top: 80px;"></div>
+<div class="centered-div">
+<h1 style="color: orange">poor man cloud-native pastebin</h1>
 <div style="margin-left: 10em">
         <p>You can either upload some text pasted to the textbox area or a file</p>
     <textarea id="textInput" placeholder="Paste text here (keep empty if you woona upload a file)"></textarea>
-    <button onclick="uploadData()">Upload Data to Pastebin</button>
+    <button class="green-button" onclick="uploadData()">Upload Data to Pastebin</button>
     <p style="margin-top: 5em">
     ... or upload a text file (kode?)    
     <input type="file" id="fileInput" />
@@ -18,6 +51,8 @@ <h1 style="color: orange;">poor man cloud-native pastebin</h1>
     <div id="responseContainer"></div>
     </p>
 </div>
+</div>
+<div class="col-xs-3"></div>
 
     <script>
       async function uploadData() {