Merge pull request #31 from Nona-Creative/fix/update-topics-and-projects-list

Updating topics and projects lists

assets/styles/base/mixins.scss

@@ -11,3 +11,32 @@
     z-index: -1;
   }
 }
+
+@mixin tagsList() {
+  margin-bottom: calculateRem(32);
+
+  ul {
+    display: flex;
+    flex-wrap: wrap;
+  }
+
+  li {
+    font-size: calculateRem(14);
+    padding: 0 calculateRem(8) calculateRem(8) 0;
+    cursor: pointer;
+
+    a {
+      display: inline-block;
+      text-decoration: none;
+      background-color: $red;
+      padding: calculateRem(8) calculateRem(12);
+      border-radius: 4px;
+      color: #fff;
+      transition: background-color 0.5s ease;
+
+      &:hover {
+        background-color: $dark-red;
+      }
+    }
+  }
+}

components/pageHeader/style.scss

@@ -21,6 +21,10 @@
 
   h1 {
     margin-bottom: calculateRem(24);
+
+    @media (min-width: $desktop) {
+      margin-bottom: 0;
+    }
   }
 
   p {
@@ -28,7 +32,7 @@
 
     @media (min-width: $desktop) {
       width: calculateRem(336);
-      margin-left: calculateRem(224);
+      margin-left: calculateRem(204);
     }
   }
 }
@@ -41,7 +45,7 @@
   }
 
   @media (min-width: $desktop) {
-    padding: calculateRem(280) 0 calculateRem(140);
+    padding: calculateRem(180) 0 calculateRem(140);
 
     .logo,
     .page-header-nav {

components/projectsList/style.scss

@@ -1,30 +1,5 @@
 @import './assets/styles/global.scss';
 
 .projects-list {
-  margin-bottom: calculateRem(32);
+  @include tagsList;
-
-  ul {
-    display: flex;
-    flex-wrap: wrap;
-  }
-
-  li {
-    font-size: calculateRem(14);
-    padding: 0 calculateRem(8) calculateRem(8) 0;
-    cursor: pointer;
-
-    a {
-      display: inline-block;
-      text-decoration: none;
-      background-color: $red;
-      padding: calculateRem(8) calculateRem(12);
-      border-radius: 4px;
-      color: #fff;
-      transition: background-color 0.5s ease;
-
-      &:hover {
-        background-color: $dark-red;
-      }
-    }
-  }
 }

components/topicsList/style.scss

@@ -1,30 +1,5 @@
 @import './assets/styles/global.scss';
 
 .topics-list {
-  margin-bottom: calculateRem(32);
+  @include tagsList;
-
-  ul {
-    display: flex;
-    flex-wrap: wrap;
-  }
-
-  li {
-    font-size: calculateRem(14);
-    padding: 0 calculateRem(8) calculateRem(8) 0;
-    cursor: pointer;
-
-    a {
-      display: inline-block;
-      text-decoration: none;
-      background-color: $red;
-      padding: calculateRem(8) calculateRem(12);
-      border-radius: 4px;
-      color: #fff;
-      transition: background-color 0.5s ease;
-
-      &:hover {
-        background-color: $dark-red;
-      }
-    }
-  }
 }

data/archives/projects.js

@@ -1,14 +1,24 @@
 const data = [
-  'Ethereum Foundation',
+  'Ethereum',
-  'Ethereum Community Fund',
+  'Geth',
-  'Solidity',
+  'Truffle',
-  'Go-ethereum',
+  'Infura',
+  'MetaMask',
   'Parity',
   'Remix',
+  'Mythril',
+  'Casper',
+  'Plasma',
+  'Status',
+  'Embark',
   'Swarm',
-  'Vyper',
   'eWASM',
-  'Casper/PoS'
+  'Sharding',
+  'State channels',
+  'Gitcoin',
+  'Augur',
+  'Vyper',
+  'Bamboo',
 ];
 
 export default data;

data/archives/topics.js

@@ -1,17 +1,32 @@
 const data = [
-  'Tools',
+  'solidity',
-  'Solidity',
+  'gas',
-  'Truffle',
+  'protocol',
-  'Deploying',
+  'transaction',
-  'Concerns',
+  'event',
-  'Scalability',
+  'network',
-  'Evolution',
+  'documentation',
-  'Workflow',
+  'usability',
-  'Linting',
+  'blockchain',
-  'Casper',
+  'client',
-  'Testnet',
+  'bounty',
-  'Plasma',
+  'deployment',
-  'Testing'
+  'audit',
+  'contract',
+  'verification',
+  'token',
+  'governance',
+  'payment',
+  'consensus',
+  'NFT',
+  'compiler',
+  'protocol',
+  'signature',
+  'hash',
+  'testing',
+  'wallet',
+  'community',
+  'decentralized',
 ];
 
 export default data;