Added csslint as a dev-dependency. Corrected css files in order to comply with csslint standards.

package-lock.json

@@ -2353,6 +2353,24 @@
       "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-0.1.0.tgz",
       "integrity": "sha1-yBSQPkViM3GgR3tAEJqq++6t27Q="
     },
+    "csslint": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/csslint/-/csslint-1.0.5.tgz",
+      "integrity": "sha1-Gcw+2jIhYP0/cjKvHLKjYOiYouk=",
+      "dev": true,
+      "requires": {
+        "clone": "2.1.1",
+        "parserlib": "1.1.1"
+      },
+      "dependencies": {
+        "clone": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.1.tgz",
+          "integrity": "sha1-0hfR6WERjjrJpLi7oyhVU79kfNs=",
+          "dev": true
+        }
+      }
+    },
     "cssnano": {
       "version": "3.10.0",
       "resolved": "https://registry.npmjs.org/cssnano/-/cssnano-3.10.0.tgz",
@@ -7836,6 +7854,12 @@
       "resolved": "https://registry.npmjs.org/parse5/-/parse5-1.5.1.tgz",
       "integrity": "sha1-m387DeMr543CQBsXVzzK8Pb1nZQ="
     },
+    "parserlib": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/parserlib/-/parserlib-1.1.1.tgz",
+      "integrity": "sha1-pkz6ckBiQ0/fw1HJpOwtkrlMBvQ=",
+      "dev": true
+    },
     "parseurl": {
       "version": "1.3.2",
       "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.2.tgz",

package.json

@@ -16,6 +16,7 @@
     "eject": "react-scripts eject"
   },
   "devDependencies": {
+    "csslint": "^1.0.5",
     "standard": "^11.0.1"
   }
 }

src/Website.css

@@ -1,16 +1,15 @@
 .Website {
-  display: flex;
-  justify-content: center;
-  flex-flow: column nowrap;
   color: white;
-  margin-bottom: 15%;
+  display: flex;
+  flex-flow: column nowrap;
+  justify-content: center;
 }
 
 .MainContainer {
+  margin: auto;
+  margin-bottom: 50px;
   max-width: 700px;
   min-width: 60%;
-  margin: auto;
-  padding-bottom: 10%;
   text-align: center;
 }
 

src/components/Navbar/Navbar.css

@@ -1,19 +1,19 @@
 .Navbar {
-  position: fixed;
-  bottom: 0px;
-  right: 0px;
-  left: 0px;
   background-color: rgb(59, 65, 82);
+  bottom: 0;
   box-shadow: -1px -1px 1px rgb(42, 46, 60);
+  left: 0;
+  position: fixed;
+  right: 0;
 }
 
 .Navbar-Button {
   background-color: rgb(126, 161, 187);
-  float: right;
   border-radius: 2px;
+  color: white;
+  float: right;
   margin: 5px;
   padding: 5px;
-  color: white;
 }
 
 .Navbar-Button:hover {
@@ -25,30 +25,33 @@
 }
 
 .Navbar-Menu {
-  width: 100%;
+  margin: 0 20%;
-  float: left;
+  width: 60%;
-  padding: 0 20%;
 }
 
 .Navbar-Menu div {
+  background-color: grey;
   border-radius: 2px;
   color: white;
   float: left;
-  width: 23%;
-  background-color: grey;
-  padding: 5px;
   margin: 1% 1%;
   overflow: hidden;
+  padding: 5px 0;
   text-overflow: ellipsis;
+  width: 23%;
 }
 
 @media screen and ( max-width: 500px ) {
+  .Navbar {
+    padding-bottom: 5px;
+  }
   .Navbar-Menu {
-    padding: 0 5% 3px 5%;
+    margin: 5%;
+    width: 90%;
   }
   .Navbar-Menu div {
-    width: 100%;
     margin: 5px 0;
+    width: 100%;
   }
 }
 

src/index.css

@@ -1,10 +1,6 @@
-* {
-  box-sizing: border-box;
-}
-
 body {
   @import url('https://fonts.googleapis.com/css?family=Roboto');
+  background-color: rgb(46, 51, 64);
   font-family: 'Roboto', sans-serif;
   font-size: 100%;
-  background-color: rgb(46, 51, 64);
 }

src/screens/Home/Home.css

@@ -1,14 +1,13 @@
 .HomeContainer p {
   text-align: left;
-  display: block;
 }
 
 .HomeContainer img {
-  float: left;
+  border-radius: 3px;
   display: block;
-  width: 40%;
+  float: left;
-  margin-right: 5px;
+  margin-right: 1%;
-  border-radius: 2px;
+  width: 39%;
 }
 
 .signature {
@@ -19,8 +18,7 @@
 
 @media screen and ( max-width: 500px ) {
   .HomeContainer img {
-    width: 100%;
+    margin: 5%;
-    padding: 5%;
+    width: 90%;
-    margin: auto;
   }
 }

src/screens/Projects/Projects.css

@@ -2,16 +2,16 @@
   display: flex;
   flex-flow: row wrap;
 }
+
 .ProjectsContainer div {
-  text-align: center;
-  padding: 5px;
-  margin: auto;
   flex: 1 0 100%;
-  max-width: 50%;
+  margin: auto;
+  max-width: 45%;
+  text-align: center;
 }
 
 @media screen and ( max-width: 500px ) {
   .ProjectsContainer div {
-    max-width: 100%;
+    max-width: 95%;
   }
 }