404 update

This commit is contained in:
Micah Cowell 2016-03-14 19:49:04 -07:00
parent 72fbfc1666
commit 1e29336a33
9 changed files with 28 additions and 16 deletions

View File

@ -26,7 +26,6 @@
<body> <body>
<div class="wrapper"> <div class="wrapper">
{% include main.html %}
{{ content }} {{ content }}
</div> </div>

View File

@ -3,6 +3,7 @@ layout: default
--- ---
<div class="post"> <div class="post">
<a class="post__back" href="/">&lt;-- back</a>
<h1 class="post__title">{{ page.title }}</h1> <h1 class="post__title">{{ page.title }}</h1>
<p class="post__date">{{ page.date | date: '%B %-d, %Y' }}</p> <p class="post__date">{{ page.date | date: '%B %-d, %Y' }}</p>
<div class="post__content"?> <div class="post__content"?>

View File

@ -3,20 +3,17 @@ layout: post
title: Why I Switched from Ghost to Jekyll title: Why I Switched from Ghost to Jekyll
--- ---
I made a new blog! **TL;DR** Use [Jekyll and Github Pages](https://help.github.com/articles/about-github-pages-and-jekyll/) for a cheap and maintainable blog.
**TL;DR** Use [jekyll and Github Pages](https://help.github.com/articles/about-github-pages-and-jekyll/) for a cheap and maintainable blog. I made a new blog! For the past few months I had been content with [Ghost](https://ghost.org), the publishing platform for professional bloggers. I enjoyed its simplicity and even made a couple themes for it (check them out on my [Github](https://github.com/getmicah)), but as time went on I got tired of paying for server time every month. With all the buzz about "static blogs" I decided to give it a try. Inevitably, I came across Github Pages and Jekyll. Free hosting and a static site blog? Yes, Please.
Before this I was content with [Ghost](https://ghost.org), a fun and easy to use blogging platform. I enjoyed the simplicity an even made a couple themes for it (check them out on my [Github](https://github.com/getmicah)), but what it lacked is that feeling of complete control over your blog. Also, I was getting tired of paying for my Digital Ocean hosting, even with the discount I got with the [Github Student](https://education.github.com/pack) discount. After hearing about the wonders of a "static" blog, I decided to do some hunting around for a new way to blog. Inevitably, I came across Github Pages and Jekyll. Free hosting and a static site blog? Yes, Please.
It wasn't like there was anything wrong with Ghost. I was just tired of paying to host it on a server. There are quite a few things that I didn't even realize I would appreciate before using jekyll.
It wasn't like there was anything wrong with Ghost. I was just tired of paying to host it on a server. There are quite a few things that I didn't even realize I would appreciate before using Jekyll.
# Static Site # Static Site
One of those being the idea of a static website being generated and no need for a backend. This just makes sense and everything is very fast. Jekyll also automatically generates your Sass files into css which is very handy (no need setting up gulp every project). One of those being the idea of a static website being generated and no need for a backend. This just makes sense and everything is very fast. Jekyll also automatically generates your Sass files into css which is very handy (no need setting up gulp every project).
# Local Posts # Local Posts
Another thing I especially appreciate about jekyll is how all your posts are stored locally. You just type out your post in markdown in your editor and push to Github to post. Also, its implementation of templates is extremely useful when constructing posts. Another thing I especially appreciate about Jekyll is how all your posts are stored locally. You just type out your post in markdown in your editor and push to Github to post. Also, its implementation of templates is extremely useful when constructing posts.
# Variables # Variables
The use of variables has to be my favorite feature. It splits variables up between site and page variables. Site variables would include the name of your blog and the description while page variables would be the name of the post or the date. You can include your own site variables inside the &#95;config.yml file, such as a Google Analytics code or something of the nature. The use of variables has to be my favorite feature. It splits variables up between site and page variables. Site variables would include the name of your blog and the description while page variables would be the name of the post or the date. You can include your own site variables inside the &#95;config.yml file, such as a Google Analytics code or something of the nature.

View File

@ -1,6 +1,7 @@
// COLORS // COLORS
$color-primary: #272727; $color-primary: #272727;
$color-background: #FFFFFF; $color-background: #FFFFFF;
$color-link: #1A0DAB;
// FONT // FONT
$font-url: "https://fonts.googleapis.com/css?family=Ubuntu+Mono:400,700,400italic"; $font-url: "https://fonts.googleapis.com/css?family=Ubuntu+Mono:400,700,400italic";

View File

@ -15,18 +15,18 @@ h1, h2 {
margin-bottom: 5px; margin-bottom: 5px;
} }
a { a {
color: #1A0DAB; color: $color-link;
text-decoration: none; text-decoration: none;
&:visited { &:visited {
color: #1A0DAB; color: $color-link;
text-decoration: none; text-decoration: none;
} }
&:hover { &:hover {
color: #1A0DAB; color: $color-link;
text-decoration: underline; text-decoration: underline;
} }
&:active { &:active {
color: #1A0DAB; color: $color-link;
text-decoration: none; text-decoration: none;
} }
} }
@ -95,21 +95,25 @@ ul {
&__title { &__title {
font-size: 1.4em; font-size: 1.4em;
font-weight: 700; font-weight: 700;
text-decoration: underline;
margin-top: 20px;
margin-bottom: 10px; margin-bottom: 10px;
} }
&__date { &__date {
font-size: 1em; font-size: 0.8em;
} }
&__content { &__content {
padding-top: 30px; padding-top: 40px;
h1 { h1 {
font-size: 1.4em; font-size: 1.2em;
font-weight: 700;
margin-top: 20px;
margin-bottom: 5px; margin-bottom: 5px;
} }
p { p {
font-size: 1em; font-size: 1em;
line-height: 150%; line-height: 150%;
margin-bottom: 12px; margin-bottom: 15px;
} }
strong { strong {
font-weight: 700; font-weight: 700;
@ -117,6 +121,14 @@ ul {
em { em {
font-style: italic; font-style: italic;
} }
img {
margin-top: 10px;
margin-bottom: 10px;
@media screen and (max-width: 570px) {
width: 100%;
margin: auto;
}
}
} }
} }

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

View File

Before

Width:  |  Height:  |  Size: 200 KiB

After

Width:  |  Height:  |  Size: 200 KiB

View File

@ -2,6 +2,7 @@
layout: default layout: default
--- ---
{% include main.html %}
<div class="work"> <div class="work">
<h1>Web Design:</h1> <h1>Web Design:</h1>

View File

@ -2,6 +2,7 @@
layout: default layout: default
--- ---
{% include main.html %}
<div class="about"> <div class="about">