Move abuse-list details into its own component

[github/Chocobozzz/PeerTube.git] / client / src / app / +signup / +register / register.component.scss

diff --git a/client/src/app/+signup/+register/register.component.scss b/client/src/app/+signup/+register/register.component.scss
index 6f61b78f719df5a3c04eb7e6cbfc5461e7016327..cc60ef524785571dce799812feb7b88bd89dd12a 100644 (file)
--- a/client/src/app/+signup/+register/register.component.scss
+++ b/client/src/app/+signup/+register/register.component.scss
@@ -1,5 +1,9 @@
 @import '_variables';
 @import '_mixins';
+@import "./_bootstrap-variables";
+
+@import '~bootstrap/scss/functions';
+@import '~bootstrap/scss/variables';
 
 .alert {
   font-size: 15px;
@@ -13,18 +17,37 @@
 
   & > div {
     margin-bottom: 40px;
-    width: 450px;
 
-    @media screen and (max-width: 500px) {
-      width: auto;
+    &.register-form {
+      width: 450px;
     }
-  }
-}
 
-my-instance-features-table {
-  display: block;
+    &.instance-information {
+      width: 600px;
+      margin-bottom: 40px;
+
+      .block {
+        font-size: 15px;
+        margin-bottom: 15px;
+        padding: 0 $btn-padding-x;
+      }
+
+      @media screen and (max-width: 1500px) {
+        width: 450px;
+      }
 
-  margin-bottom: 40px;
+      ngb-accordion ::ng-deep {
+        .btn {
+          font-weight: $font-semibold !important;
+          color: var(--mainForegroundColor) !important;
+        }
+      }
+    }
+
+    @media screen and (max-width: $mobile-view) {
+      width: auto;
+    }
+  }
 }
 
 .form-group-terms {
@@ -35,10 +58,6 @@ my-instance-features-table {
   @include peertube-input-group(400px);
 }
 
-.input-group-append {
-  height: 30px;
-}
-
 input:not([type=submit]) {
   @include peertube-input-text(400px);
 
@@ -56,3 +75,26 @@ button {
   @include peertube-button;
   @include orange-button;
 }
+
+.name-information {
+  margin-top: 10px;
+}
+
+.done-loader {
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  align-items: center;
+
+  my-loader {
+    margin-bottom: 20px;
+
+    ::ng-deep .loader div {
+      border-color: var(--mainColor) transparent transparent transparent;
+    }
+
+    & + div {
+      font-size: 15px;
+    }
+  }
+}