Explorar o código

modified the code to change the buttons alignment

rota3015 hai 8 meses
pai
achega
9e6236be4b
Modificáronse 1 ficheiros con 15 adicións e 12 borrados
  1. 15 12
      _includes/header.html

+ 15 - 12
_includes/header.html

@@ -175,24 +175,27 @@
       </div>
   </div>
 
-  <div id="navBar" class="modal">
-    <div id="emailCode" style="align-items: center;">
+    <div id="navBar" class="modal" style="width: 40%; height: 15%; padding-top: 1%; flex-direction: column; justify-content: center; align-items: center;">
+    <div id="emailCode" style="align-items: center; text-align: center;">
       <label for="emailInput">Enter your email:</label>
       <input type="email" id="emailInput" v-model="loginEmail" required>
-      <button class="btn_login_logout primary_login_logout is-large_login_logout" @click="sendOTP"
-        style="text-align:center;">Send Code</button>
+      <div style="display: flex; flex-direction: row; justify-content: center; margin-top: 20px;">
+        <button class="btn primary is-large" @click="sendOTP">Send Code</button>
+        <span style="margin: 0 10px;"></span> <!-- Spacer -->
+        <button class="btn primary is-large" @click="closeModal">Close</button>
+      </div>
     </div>
-    <div id="emailCodeVerify">
+    <div id="emailCodeVerify" style="text-align: center;">
       <label for="otpInput">Enter Code to Login:</label>
       <input type="text" id="otpInput" v-model="otpCode" required>
-      <button class="btn_login_logout primary_login_logout is-large_login_logout" @click="verifyOTP">Verify
-        Code</button>
-      <button class="btn_login_logout primary_login_logout is-large_login_logout" @click="sendOTPAagin"> Send Code
-        Again</button>
+      <div style="display: flex; flex-direction: row; justify-content: center; margin-top: 20px;">
+        <button class="btn primary is-large" @click="verifyOTP">Verify Code</button>
+        <span style="margin: 0 10px;"></span> <!-- Spacer -->
+        <button class="btn primary is-large" @click="sendOTPAagin">Send Code Again</button>
+        <span style="margin: 0 10px;"></span> <!-- Spacer -->
+        <button class="btn primary is-large" @click="closeModal">Close</button>
+      </div>
     </div>
-    <button class="btn_login_logout primary_login_logout is-large_login_logout" @click="closeModal">Close</button>
-  </div>
-  </div>
   </div>
   </nav>
   </div>