diff --git a/Gemfile b/Gemfile index 7be3779d5..304bf182f 100644 --- a/Gemfile +++ b/Gemfile @@ -1,7 +1,6 @@ source "https://rubygems.org" group :jekyll_plugins do - gem "jekyll-paginate" gem "jekyll-sitemap" gem "octopress-autoprefixer" end diff --git a/README.md b/README.md index 19595cc80..239e9c6c3 100644 --- a/README.md +++ b/README.md @@ -1 +1,97 @@ -# 🏆 – A Jekyll Theme +# 🏆 – A Blog Theme for Jekyll +Trophy is a blog theme for Jekyll built using HTML, Sass, and JavaScript (no jQuery). External stylesheets and libraries included are Google Fonts, Font Awesome, Normalize.CSS, and WOW.js. + +## Screenshots + +## Installation +All dependencies are saved in the ````Gemfile````. Run ````bundle install```` (Install [Bundler](http://bundler.io/) if it is not already) after cloning the repo. + +## Edit Theme +I made everything as easy as possible to edit. Most things can be found in the ````_config.yml````, but if more editing is required digging through the code will be required. The ````head.html```` file is in the ````_includes```` folder and the Sass variables are found in the ````_base.scss```` file in the ````_sass```` folder. + +### _config.yml + +#### Site Settings + email: + baseurl: "" + paginate: 5 + paginate_path: "/blog/page-:num" + +* ````email```` - Your email for the contact card and the footer +* ````baseurl```` - Path of blog if adding this on to another website +* ````paginate```` - Number of blog posts per page +* ````paginate_path```` - URL structure of paginated pages + +#### SEO Settings + title: + description: + url: "" + twitter_username: + default_img: + +* ````title```` - Title of blog +* ````description```` - Description of blog (recommended to not go over 160 characters) +* ````url```` - URL of main website +* ````twitter_username```` - Twitter username +* ````default_img```` - Image that will appear when posting links on social networks + +#### Profile Settings + name: + profile_img: + profile: + social: + github: + +* ````name```` - Full name for SEO purposes +* ````profile_img```` - Image for the profile card (size to 2000x1200px) +* ````profile```` - Short description that will be in the profile card +* ````social```` - List of social networks for icons in the contact card and the footer ([Font Awesome](http://fontawesome.io/) is used, so only match the name of the icon, but do not include ````fa-````) + + +#### Build Settings + include: ["_categories"] + permalink: /:year/:month/:day/:title/ + +* ````include```` - Folders that are not automatically included in Jekyll +* ````permalink```` - URL structure of blog posts + +### _posts + --- + layout: post + title: "" + date: + categories: + description: + image: + image-sm: + --- + +This is the YAML front matter block for blog posts. +* ````layout```` - This field will always be post +* ````title```` - The title of the blog post +* ````date```` - The date that will appear on the blog post +* ````categories```` - Optional field that can be entered as an array or a list +* ````description```` - Optional field for SEO (recommended to not go over 160 characters) +* ````image```` - The blog theme was designed for 2000x1200px images (optimize your images because this is a picture heavy theme) +* ````image-sm```` - Optional field for card layouts for image optimization and page speed (designed for 500x300px images) + +### _categories + --- + layout: default + title: New Category + description: + permalink: /category/new-category/ + --- + {% include category.html %} + +Jekyll does not have anything built in for categories, so I made making new categories as simple as possible. +* ````layout```` - This field will always be default +* ````title```` - Name of the category +* ````description```` - Optional field for SEO (recommended to not go over 160 characters) +* ````permalink```` - URL for the category + +## Issues + + +## License +Trophy is licensed under the MIT License. diff --git a/_config.yml b/_config.yml index e81a7e189..fcb44842f 100644 --- a/_config.yml +++ b/_config.yml @@ -1,11 +1,10 @@ # Site settings -headline: A Jekyll Blog Theme email: thomas.vaeth@gmail.com baseurl: "/trophy" paginate: 5 paginate_path: "/blog/page-:num" -# SEO +# SEO settings title: Trophy description: Trophy is a Jekyll blog theme by Thomas Vaeth in Seattle, Washington. url: "http://thomasvaeth.com" @@ -34,4 +33,4 @@ sass: style: compressed # Gems -gems: [jekyll-paginate, jekyll-sitemap, octopress-autoprefixer] +gems: [jekyll-sitemap, octopress-autoprefixer] diff --git a/_includes/head.html b/_includes/head.html index 11a90ebb5..5d406475d 100644 --- a/_includes/head.html +++ b/_includes/head.html @@ -15,7 +15,7 @@ - + diff --git a/_layouts/post.html b/_layouts/post.html index 5ea3d746f..62695cbb0 100644 --- a/_layouts/post.html +++ b/_layouts/post.html @@ -4,6 +4,10 @@
+ + + Back to Posts +
diff --git a/_sass/_base.scss b/_sass/_base.scss index 2a17cbcc6..592dfbb90 100644 --- a/_sass/_base.scss +++ b/_sass/_base.scss @@ -84,7 +84,9 @@ a { text-decoration: none; transition: color 0.4s ease-in-out; - &:hover { + &:hover, + &:active, + &:focus { color: $color-alpha; } } diff --git a/_sass/_components.scss b/_sass/_components.scss index 7a7a97eff..968283f0b 100644 --- a/_sass/_components.scss +++ b/_sass/_components.scss @@ -295,6 +295,54 @@ } } +/** + * Navigation + */ +.nav { + @extend %letter-spacing; + + position: absolute; + top: 1em; + left: 2em; + z-index: 99; + + display: flex; + align-items: center; + + font-family: $font-body; + transition: left 0.4s ease-in-out; + + &:hover, + &:active, + &:focus { + left: 1em; + } + + i { + margin-right: 0.5em; + } + + &--black { + color: $color-black; + + &:hover, + &:active, + &:focus { + color: $color-black; + } + } + + &--white { + color: $color-white; + + &:hover, + &:active, + &:focus { + color: $color-white; + } + } +} + /** * Post */ diff --git a/archive.html b/archive.html index 90609278d..002ed00f5 100644 --- a/archive.html +++ b/archive.html @@ -5,6 +5,10 @@ permalink: /archive/ ---
+ + + Back to Posts +
Archive