https://github.com/bertrandkeller/overkyll-jekyll-theme

A simple starter theme with an ITCSS Sass files organisation, a flexbox grid and modular typography
https://github.com/bertrandkeller/overkyll-jekyll-theme

jekyll jekyll-theme

Last synced: 28 days ago
JSON representation

A simple starter theme with an ITCSS Sass files organisation, a flexbox grid and modular typography

• Host: GitHub
• URL: https://github.com/bertrandkeller/overkyll-jekyll-theme
• Owner: bertrandkeller
• License: mit
• Created: 2016-09-22T14:16:54.000Z (about 8 years ago)
• Default Branch: gh-pages
• Last Pushed: 2018-12-11T16:04:57.000Z (almost 6 years ago)
• Last Synced: 2024-03-25T07:21:50.558Z (8 months ago)
• Topics: jekyll, jekyll-theme
• Language: CSS
• Homepage: https://bertrandkeller.github.io/overkyll-jekyll-theme/
• Size: 3.62 MB
• Stars: 53
• Watchers: 6
• Forks: 12
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-starred - bertrandkeller/overkyll-jekyll-theme - A simple starter theme with an ITCSS Sass files organisation, a flexbox grid and modular typography (jekyll-theme)

README

        
# Overkyll Jekyll Theme

![Screenshot of Overkyll](https://raw.githubusercontent.com/bertrandkeller/overkyll-jekyll-theme/gh-pages/screenshot.png

)

## Presentation

Fast and light, it can be use for a small blog or as a theme for starting a bigger site. Find the code of [overkyll on Github](https://github.com/bertrandkeller/overkyll-jekyll-theme)

It implements this differents technologies :

 1. [ITCSS](http://itcss.io/) architecture.

 2. [Modular scale](http://www.modularscale.com/) typography 

 3. [Unison JS](http://bjork24.github.io/Unison/) Unifying named breakpoints across CSS, JS, and HTML

 4. [LocalFont](https://jaicab.com/localFont/) Implement localStorage web font caching in seconds

 5. [LoadingCSS](https://github.com/filamentgroup/loadCSS) A function for loading CSS asynchronously

 6. [Overpass](http://overpassfont.org/) An open source webfont family inspired by Highway Gothic

 7. [Open Color](https://yeun.github.io/open-color/) Color optimized for UI like font, background, border, etc.

 8. [Css lock](https://fvsch.com/code/css-locks/) Progressive increasing fontsize - in canal and river navigation

## Install as Gem Theme

Jekyll requires Ruby so make sure Ruby is installed before you begin.

### Start a New Site

- Install Jekyll and Bundler

  - `gem install jekyll bundler`

- Create a New Site

  - `jekyll new mysite`

- Move into that directory

  - `cd mysite`

- Verify

  - Run `bundle exec jekyll serve`

  - Browse to [http://localhost:4000](http://localhost:4000)

- Download Overkyll Theme

  - Replace the line `gem "minima"` with this:

    - `gem "overkyll-jekyll-theme"`

  - Run `bundle install`

- Tell Jekyll to use Overkyll Theme

  - Open `_config.yml` and change the line `theme: minima` to this:

    - `theme: overkyll-jekyll-theme`

### Migrate an Existing Site

**NOTE** This requires you to be upgraded to at least Jekyll 3.3 which added support for themes and assets.

- Download Overkyll Theme

  - Replace the line `gem "minima"` with this:

    - `gem "overkyll-jekyll-theme"`

  - Run `bundle install`

- Tell Jekyll to use Overkyll Theme

  - Open `_config.yml` and change the line `theme: minima` to this:

    - `theme: overkyll-jekyll-theme`

## Jekyll 2.x Method

Jekyll requires Ruby so make sure Ruby is installed before you begin.

- Download this site

  - `git clone https://github.com/bertrandkeller/overkyll-jekyll-theme.git`

- Move into its directory

  - `cd overkyll-jekyll-theme`

- Install Required Gems

  - `bundle install`

- Verify

  - Run `bundle exec jekyll serve`

  - Browse to [http://localhost:4000](http://localhost:4000)