fix substrate logo

Fair-Squares · Aug 29, 2023 · f90b871 · f90b871
1 parent d4b9452
commit f90b871
Show file tree

Hide file tree

Showing 3 changed files with 45 additions and 18 deletions.
diff --git a/.DS_Store b/.DS_Store
diff --git a/_layouts/about.html b/_layouts/about.html
@@ -75,7 +75,7 @@ <h3>Fair Squares Team</h3>
 
   <section class="collab contentBlock-light">
     <div class="inner">
-    <h3>Our choice of technology</h3>
+      <h3>Our choice of technology</h3>
       <p>
       Substrate is the perfect framework for us to build our protocol on. It allows us full control over our runtime and the ability to customize it to our needs. 
       Furthermore it offers a lot of standardized building blocks in terms of governance,asset standards and interoperability we can use in the future. 

diff --git a/_sass/basically-basic/_sections.scss b/_sass/basically-basic/_sections.scss
@@ -97,35 +97,62 @@
 }
 
 .collab {
-  color:$charcoal;
+  color: $charcoal;
+
   h3 {
-    position:relative; padding:0 32% 0 0; text-align:left; 
+    position: relative; 
+    padding: 0 32% 0 0; 
+    text-align: left; 
+
     &:before {
-      content:'';
-      background: url('https://github.com/substrate-developer-hub/substrate-docs/raw/main/static/img/sub.gif') no-repeat; position: absolute;
-      right: 0; top: -.4rem; width: 28%; height: 100%;
-      min-height: 100px; min-width: 150px;
-      background-size: 100%; display: block;
+      content: '';
+      background: url('https://github.com/substrate-developer-hub/substrate-docs/raw/main/static/img/sub.gif');
+      position: absolute;
+      right: 0; 
+      top: -.4rem; 
+      width: 28%; 
+      height: 100%;
+      min-height: 100px; 
+      min-width: 150px;
+      background-size: contain;
+      background-repeat: no-repeat;
+      background-position: center;
+      display: block;
+      z-index: 2;
     }
-    @media screen and (max-width:$small) {
+
+    @media screen and (max-width: $small) {
       padding: 5rem 0 0 0;
-      &:before {right:unset; left:0;}
+      &:before {
+        right: unset; 
+        left: 0;
+      }
     }
   }
+
   ul {
-    list-style:none; display:flex; justify-content:start; padding:0; margin:3rem 0 0;
-    li {width:46%;}
-    li:first-child {margin-right:3rem;}
-    a {width:100%; padding-left:0; padding-right:0;}
-    @media screen and (max-width:600px){
-      flex-direction:column;
-      li {width:100%; margin:0 0 2rem 0;}
-
+    list-style: none; 
+    display: flex; 
+    justify-content: start; 
+    padding: 0; 
+    margin: 3rem 0 0;
+
+    li {width: 46%;}
+    li:first-child {margin-right: 3rem;}
+    a {width: 100%; padding-left: 0; padding-right: 0;}
+
+    @media screen and (max-width: 600px) {
+      flex-direction: column;
+      li {
+        width: 100%; 
+        margin: 0 0 2rem 0;
+      }
     }
   }
 }
 
 
+
 .timeline {
   background: url('/assets/images/colorkit.png') no-repeat; background-size:cover;
   position:relative;