Add mute status in account and channel pages

[github/Chocobozzz/PeerTube.git] / client / src / app / +about / about-peertube / about-peertube.component.scss

diff --git a/client/src/app/+about/about-peertube/about-peertube.component.scss b/client/src/app/+about/about-peertube/about-peertube.component.scss
index cd1364c142043797c95fc0e196fcf4e57fd2789f..2a5ec08f53142cd0c7d7256aa03160e4e75cebc4 100644 (file)
--- a/client/src/app/+about/about-peertube/about-peertube.component.scss
+++ b/client/src/app/+about/about-peertube/about-peertube.component.scss
@@ -1,5 +1,10 @@
-@import '_variables';
-@import '_mixins';
+@use '_variables' as *;
+@use '_mixins' as *;
+
+.root {
+  max-width: 1200px;
+  margin: auto;
+}
 
 .about-peertube-title {
   font-size: 25px;
@@ -13,52 +18,61 @@
   margin: 20px auto;
 }
 
-/deep/ .section-title {
+::ng-deep .section-title {
   font-weight: $font-semibold;
   font-size: 20px;
   margin-bottom: 5px;
 }
 
 .description {
-  margin-bottom: 100px;
   text-align: center;
 }
 
+.documentation {
+  display: flex;
+  flex-wrap: wrap;
+  margin: 50px 0;
+  justify-content: center;
+
+  .card {
+    margin: 30px;
+    flex-basis: 300px;
+    font-size: 15px;
+  }
+}
+
 .description,
 .p2p-privacy,
 my-about-peertube-contributors {
-  /deep/ {
-    p, li {
+  ::ng-deep {
+    p,
+    li {
       font-size: 15px;
     }
   }
 }
 
-.p2p-privacy-title {
-  margin-top: 15px;
-}
-
 .privacy-contributors {
   display: flex;
-  flex-direction: row;
-
-  > div,
-  > my-about-peertube-contributors {
-    flex-basis: 100%;
-    display: block;
-  }
+  flex-direction: column;
 
   .p2p-privacy {
+    .section-title {
+      margin: 50px 0 20px;
+      text-align: center;
+    }
+
     h6 {
       font-size: 20px;
+      margin-top: 15px;
     }
   }
+}
 
-  my-about-peertube-contributors {
-    margin: 0 40px 40px 0;
-  }
+.card-title {
+  font-size: 1.25rem;
+}
 
-  @media screen and (max-width: $small-view) {
-    flex-direction: column;
-  }
+.p2p-privacy-title {
+  font-size: 20px;
 }