Add mascot in peertube about page

[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 1d8579ec1cd18eb650ffa6671145cbe9b622645e..cd1364c142043797c95fc0e196fcf4e57fd2789f 100644 (file)
--- a/client/src/app/+about/about-peertube/about-peertube.component.scss
+++ b/client/src/app/+about/about-peertube/about-peertube.component.scss
@@ -2,21 +2,63 @@
 @import '_mixins';
 
 .about-peertube-title {
-  font-size: 20px;
-  font-weight: bold;
+  font-size: 25px;
+  text-align: center;
+  font-weight: $font-semibold;
   margin-bottom: 15px;
 }
 
-.section-title {
+.mascot {
+  display: block;
+  margin: 20px auto;
+}
+
+/deep/ .section-title {
   font-weight: $font-semibold;
   font-size: 20px;
   margin-bottom: 5px;
 }
 
 .description {
-  margin-bottom: 30px;
+  margin-bottom: 100px;
+  text-align: center;
+}
+
+.description,
+.p2p-privacy,
+my-about-peertube-contributors {
+  /deep/ {
+    p, li {
+      font-size: 15px;
+    }
+  }
 }
 
 .p2p-privacy-title {
   margin-top: 15px;
-}
\ No newline at end of file
+}
+
+.privacy-contributors {
+  display: flex;
+  flex-direction: row;
+
+  > div,
+  > my-about-peertube-contributors {
+    flex-basis: 100%;
+    display: block;
+  }
+
+  .p2p-privacy {
+    h6 {
+      font-size: 20px;
+    }
+  }
+
+  my-about-peertube-contributors {
+    margin: 0 40px 40px 0;
+  }
+
+  @media screen and (max-width: $small-view) {
+    flex-direction: column;
+  }
+}