fixed up the navbar

_includes/header.html

@@ -1,7 +1,7 @@
 <div class="flex-header-container">
     <div class="flex-header-item one"><img class="logo" src="/images/dino.svg"></div>
     <div class="flex-header-item two"><h1><a href="/" {% if page.url == "/" %}class="selected-item"{% endif %}>Home</a></h1></div>
-    <div class="flex-header-item three"><h1><a href="/about" {% if page.url == "/about/"%}class="selected-item"{% endif %}>About</a></h1></div>
     <div class="flex-header-item four"><h1><a href="/posts" {% if page.url == "/posts/"%}class="selected-item"{% endif %}>Posts</a></h1></div>
+    <div class="flex-header-item three"><h1><a href="/about" {% if page.url == "/about/"%}class="selected-item"{% endif %}>About</a></h1></div>
     <div class="flex-header-item five"><h1><a href="/contact" {% if page.url == "/contact/"%}class="selected-item"{% endif %}>Contact</a></h1></div>
 </div>

about.md

@@ -6,16 +6,26 @@ title: About
 
 ### What's this website all about?
 
-Dinosaurscode is a website for programmers, coders, web developers, and web designers to learn new skills.
+Dinosaurscode was built to share helpful tips, tricks, and information to coders. 
 
-There are lots of new technologies popping up daily and this is the place to learn them all. 
+<br>
 
-### How is this website built?
+### Want to guest blog?
 
-It's built using the popular static site generator [Jekyll](https://jekyllrb.com/) and proudly hosted on [Github](https://github.com/xDinomode/DinosBlog). All blog posts are in the folder **_posts**.
+Hit **Contact** in the upper navigation bar and shoot us an email.
 
-### Want to guest blog?
+<br>
+
+### Buy me a coffee
+
+If you found anything on this blog useful then feel free to buy me a coffee.
 
-Go to contact in the navbar and submit an idea with an email to respond to.
+<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+<input type="hidden" name="cmd" value="_s-xclick">
+<input type="hidden" name="encrypted" value="-----BEGIN PKCS7-----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-----END PKCS7-----
+">
+<input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_donateCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
+<img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
+</form>
 
 

gulpcss/main.css

@@ -83,6 +83,9 @@ iframe{
     background-color: #E0E0E0;
     padding: 28px;
 }
+#indexwelcomelist {
+    text-align: center;
+}
 .home-introduction {
     font-size: 1.563em;
     text-align: center;
@@ -120,7 +123,9 @@ iframe{
   display: flex;
   flex-wrap: wrap;
   background: #333;
-  border-bottom: 4px solid #4DBCE9;
+  background: #e0e0e0;
+  border-bottom: 2px solid #4DBCE9;
+  border-bottom: 1px solid #333;
 }
 .flex-header-item{
   min-width: 80px;
@@ -155,13 +160,16 @@ iframe{
 .flex-header-item a{
   color: white;
   text-decoration: none;
+  color: #333;
 }
 .flex-header-item a:hover{
   color: #4DBCE9;
+  color: #4078c0;
 }
 .selected-item{
   padding: 10px;
-  border-bottom: 3px solid #4DBCE9;
+  color: #4DBCE9;
+  background: white;
 }
 
 /*end-flex-header*/
@@ -172,9 +180,8 @@ iframe{
   padding:40px;
   background-color: #151515;
   background-color: #2b2636;
+  background: #333;
   clear: both;
-  border-top: 8px solid #333;
-  border-top: 4px solid #4DBCE9; 
 }
 #social-footer-icons {
 	text-align:center;
@@ -290,6 +297,7 @@ iframe{
 .post-latest{
     list-style-type: none;
     background: #2B2636;
+    background: #333;
     text-align:center;
 }
 .post-latest li{
@@ -300,6 +308,7 @@ iframe{
 }
 .post-latest li a{
   color: #4DBCE9;
+  color: #4078c0;
 }
 .post-latest li a:hover{
 	color:white;

index.md

@@ -7,6 +7,7 @@ description: Learn new programming tips and tricks. Web design, Web development,
 
 <div id = "indexwelcome">      
 <p class="home-introduction" style="text-align:center;">A blog written for coders</p>
+<p id = "indexwelcomelist">Node.js &#10003; HTML5 &#10003; CSS3 &#10003; and much more...</p>
 <div class="home-button" class="home-button"><a href="/posts">Start Here</a></div>
 <br>
 </div>

package.json

@@ -18,13 +18,14 @@
   "homepage": "https://github.com/xDinomode/jekylltest#readme",
   "devDependencies": {
     "gulp": "^3.9.1",
-    "gulp-clean-css": "^2.0.5",
+    "gulp-clean-css": "^2.0.13",
     "gulp-concat": "^2.6.0",
     "gulp-htmlmin": "^1.3.0",
-    "gulp-imagemin": "^3.0.1",
+    "gulp-imagemin": "^3.1.0",
     "gulp-jshint": "^2.0.0",
     "gulp-rename": "^1.2.2",
-    "gulp-uglify": "^1.5.3",
+    "gulp-uglify": "^1.5.4",
+    "imagemin-pngquant": "^5.0.0",
     "jshint": "^2.9.1"
   }
 }