styled invite and reg pages

members_lumbung_space/static/css/lumbung.css

@@ -134,10 +134,6 @@ nav strong{
   text-decoration: none;
 }
 
-.button.is-ghost {
-  padding-left: 0 !important;
-}
-
 footer {
   background-color: #AFAFAF !important; 
   padding: 1rem 1.5rem !important;
@@ -151,3 +147,59 @@ footer .content span {
   padding-bottom: 2rem !important;
 }
 
+#formlogo.logo{
+  background-color: white;
+  border: 1px solid black;
+  transform: rotate(5deg);
+  margin: 0 auto 2em auto !important;
+  width: 75%;
+  position: relative;
+  bottom: 1em;
+  padding: 0.8em
+}
+
+@media all and (min-width: 768px) {
+  #formlogo.logo{
+    width: 50%;
+  }
+  .signup-form-box {
+    max-width: 70%;
+    margin: auto;
+    margin-top: 4em;
+  }
+
+}
+
+.signup-form-box {
+  margin: auto;
+  margin-top: 4em;
+  border: #333 2px solid;
+}
+
+.form-header {
+  background-color: #BCE1D1;
+  height: 3.6em;
+}
+
+.form-body p,.form-body form  {
+  margin-left: 1em;
+}
+
+.form-body {
+  overflow-x: auto;
+}
+
+.form-body button{
+  margin-bottom: 1em;
+}
+
+.form-body .button {
+  padding: 0 4em !important;
+  color: white;
+  background-color: #AFAFAF;
+}
+
+.button {
+  font-family: "Gudea", "sans-serif" !important;
+
+}

members_lumbung_space/templates/invites.html

@@ -2,10 +2,21 @@
 
 {% block content %}
 {% include 'nav.html' %}
-<div class="logo">
+<!-- <div class="logo">
+  <img src="{{ url_for('static', path='svg/lumbung_space_logo.svg') }}" alt="lumbung.space logo">
+</div> -->
+<div class="center-table">
+
+  <div class="signup-form-box">
+    <div class="form-header">
+      <div id="formlogo" class="logo">
         <img src="{{ url_for('static', path='svg/lumbung_space_logo.svg') }}" alt="lumbung.space logo">
       </div>
-<div>
+    </div>
+    <div class="form-body">
+      <p>
+        Hello {{user.preferred_username}}. Here are links you can send to invite others to register.
+      </p>
       {% if user.preferred_username in invites and invites[user.preferred_username]|length > 0 %}
       <table>
         <tr>
@@ -25,10 +36,12 @@
           </tr>
         {% endfor %}
       </table>
-    {% endif %}
+      <div class="overflow-x:auto">
 
-  <p>
+      </div>
+      {% endif %}
       <button class="button is-ghost"><a href="{{ url_for('invite_keycloak_create') }}">Generate</a></button>
-  </p>
+    </div>
+  </div>
 </div>
 {% endblock %}

members_lumbung_space/templates/register.html

@@ -1,5 +1,12 @@
 {% extends "base.html" %}
 {% block content %}
+  <div class="signup-form-box">
+    <div class="form-header">
+      <div id="formlogo" class="logo">
+        <img src="{{ url_for('static', path='svg/lumbung_space_logo.svg') }}" alt="lumbung.space logo">
+      </div>
+    </div>
+    <div class="form-body">
       <p>
         You've been invited by {{ invited_by }} 🎉
       </p>
@@ -29,7 +36,13 @@
     
         <input type="hidden" name="invited_by" value="{{ invited_by }}"/>
 
-    <input type="submit" value="Register" />
+        <input class="button "type="submit" value="Register" />
+
+        
       </form>
+    </div>
+
+  </div>
+
 
 {% endblock %}