format login screen

IridiumIdentity · Aug 6, 2023 · b42c663 · b42c663
1 parent 72c5650
commit b42c663
Show file tree

Hide file tree

Showing 2 changed files with 52 additions and 16 deletions.
diff --git a/projects/iridium-ui/src/app/components/register/register.component.css b/projects/iridium-ui/src/app/components/register/register.component.css
@@ -1,41 +1,76 @@
 
-  .register-wrapper {
-    padding-top: 100px;
-    display: flex;
-    flex-direction: column;
-    width: 25%;
-    justify-content: center;
+
+
+  @media all and (max-width: 2500px) {
+
+    .register-wrapper {
+      padding-top: 100px;
+      display: flex;
+      flex-direction: column;
+      width: 25%;
+      min-width: 150px;
+      justify-content: center;
+    }
+
+    .logo-wrapper {
+      padding-top: 100px;
+      display: flex;
+      flex-direction: column;
+      width: 40%;
+      justify-content: center;
+
+    }
   }
 
-  .logo-wrapper {
-    padding-top: 100px;
-    display: flex;
-    flex-direction: column;
-    width: 40%;
-    justify-content: center;
+  @media all and (max-width: 400px) {
 
+    .register-wrapper {
+      padding-top: 100px;
+      display: flex;
+      flex-direction: column;
+      width: 75%;
+      min-width: 150px;
+      justify-content: center;
+    }
+
+    .logo-wrapper {
+      padding-top: 100px;
+      display: flex;
+      flex-direction: column;
+      width: 80%;
+      justify-content: center;
+
+    }
   }
 
+
   .register-container {
     display: flex;
+    flex-direction: column;
     align-items: center;
     justify-content: space-around;
   }
 
   .sign-in-button-container {
     margin-bottom: 15px;
   }
-
+  .divider-container{
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+  }
   .sign-in-button {
     background-color: #ff671d !important;
     color: #fafafa !important;
     width: 100%;
+    min-width: 100px;
   }
 
   .register-button {
     background-color:  #5b89b4 !important;
     color: #fafafa !important;
     width: 100%;
+    min-width: 100px;
   }
 
   .register-button-container {

diff --git a/projects/iridium-ui/src/app/components/register/register.component.html b/projects/iridium-ui/src/app/components/register/register.component.html
@@ -10,9 +10,10 @@
             Sign In
           </button>
         </div>
-        <mat-divider style="width: 40%; display: inline-block"></mat-divider>
-        <span style="padding: 20px; font-weight: 500">OR</span>
-        <mat-divider style="width: 40%; display: inline-block"></mat-divider>
+        <div class="divider-container">
+          <span style="font-weight: 500">OR</span>
+        </div>
+
         <div class="register-button-container">
           <button
             mat-raised-button