Portfolio & blog built with Jekyll, Liquid Markup, Docker, and HTML/SASS
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.sass-cache
_includes
_layouts
_posts
_sass
_songs
assets
css
.gitignore
404.html
CNAME
LICENCE
Makefile
README.md
Robots.txt
_config.yml
about.html
blog.html
c.html
contact.html
docker-compose.yml
elevation.html
experience.html
feed.xml
g.html
index.html
keybase.txt
l.html
projects.html
sitemap.xml
t.html
u.html
w.html
wi.html

README.md

ADRW Jekyll Theme

My portfolio & blog. Built in Waterloo with Jekyll, Ruby, Sass, and hosted on Github Pages.

Some of the features I've built out with this theme:

Mobile Friendly Menu

Menu that dynamically scales to all screen sizes and auto-hides on mobile.

Desktop Menu Closed Desktop Menu Mobile Menu

Cards

Built image grid to feature images from posts and projects for use on homepage, project, and blog pages. Displays all posts in a given category.

Cards

Card Sections

Extension of cards to allow for sections of posts by category with buttons to more related posts. See on /index, /projects, and /blog pages.

Card Sections

Resume Layout

Resume layout that pulls from work, hackathon, project, freelance, and volunteer categories and formats following meta data into well formated resume. Seen on /experience page.

  • date : end date of position
  • startdate : start date of position
  • position : job title/role , team
  • company : firm or organization
  • summary : markdown description of experience

Resume Layout

Tag and Category Clouds

Tags on category, page, project, & post layouts. Used { % for % } loops and conditional { % if % } statements in liquid markup to only show tags on categories when enabled in _config.yml.

Archive layout that pulls from categories and tags to create easy navigation of all categories and tags with their respective totals of posts. See on /c and /t pages.

Category Cloud

Modularized Footer and Social Bar

Footer was by default hard coded into page layouts. Now both footer and social bar is modularized with respective CSS so that both can easily be added to any page or section.

Better Schema SEO in Layouts

In page, post, and project layouts, I've added meta description HTML tags and Schema syntax with liquid markup. This will improve search engine crawl success and better populate sharing descriptions on Facebook and Twitter.

Improved Readability

Extra wide columns of text are difficult to read! Text columns are sized to make reading as easy as reading a book or newspaper.

Annotations for Embedded Media

By default, including alt text to your Markdown image tag [alt text](/path/to/image.jpg) shows a caption below the image. Now this functionality is extended using <figcaption>this is my caption</figcaption> tags so captions can be added to embedded media and HTML5 videos.

Super Fast, Mobile Optimized, Async CSS, & Font Loading

Transitioning from Wordpress was a huge undertaking but well worth it. According to Google Developer PageSpeed Insights, website performance has increased by more than 2.3x thanks to optimized images and asynchronous static loading of CSS and fonts.

  • 92/100 on mobile, previously 34/100
  • 78/100 on desktop, previously 39/100

Combined with a lightning fast Github Pages CDN, images are heavily optimized and resized for delivery. I've cut site size by over 80% using JPEGmini, ImageAlpha for pngs, Pixelmator, & Affinity Photo.

Resources