olakara / jekyllmetro

A Metro based theme for Jekyll

Jekyll Metro

Jekyll Metro is a metro inspired theme for Jekyll.

Summary

Jekyll Metro is a theme built on top of bootstrap and other freely available libraries. Its aimed to provide a fully furnished Jekyll theme for personal sites with blog.

Version 1.0 Development (Beta 2 Released!)

New features include:

• Light box feature
• Social media share widget
• New colors

Currently I am busy with other project and will devote less time in developing this theme forward. Updates and enhancements are welcome.

Features

• Responsive Jekyll theme
• Metro style Homepage
  • Configurable tiles with different size
  • Configurable colors for tiles
  • Display of Latest and Recent articles as tiles
• Pages for About Me, Resume with configurable color themes
• Blog home page with listing of articles in pagination
• Blog article page with configurable color themes
• Easy integration with Google Analytics
• Easy integration with Disqus for comments
• Easy integration with txtpen for highlights

Demo

You can see the live demo of this theme at http://blog-olakara.rhcloud.com

Author

Abdel Raoof Olakara

Contributors

Stilyan Kongalov

• https://github.com/Stilyan-Kangalov

Peter Zhu

• https://github.com/ZhuFengdaaa

License

Open sourced under the MIT license.

<3

jekyllmetro's Issues

Bug In FireFox! ( version 0.7.8 )

Look over this screenshot, after your commit:

The same thing will see every second user with Firefox in my country ... when he/she downloads the theme. Can you guess what happend or to explane it?

Pull Req: Added new icons and classes.

• YouTube yt_ico / yt_ico_sm
• Vimeo vm_ico / vm_ico_sm
• GitHub gh_ico / gh_ico_sm
• Stackoverflow sto_ico / sto_ico_sm
• Behance bh_ico / bh_ico_sm
• DeviantArt da_ico / da_ico_sm
• Metacafe mc_ico / mc_ico_sm

Starting tests with JS libraries and applying animation effects.

• Running offline tests.

Changing the tile position and colors in the index to get 3 rows.

It must be done after the new tiles are ready.

• + + + + + = capital tiles
• + + + = important tiles
• + = feed tile + less inportant tiles
  In that way the negative space will be smaller and the layout - a lot more cooler!

Tile to display featured content on the home page

Introduce a tile of double size that can display featured content from the blog post. The content can be possibly found in two ways:

1. Set "featured" variable in Front Matter
2. Set variables ( Title, URL and summary ) in _config.yml

problem when jekyll converts JekyllMetro site

I forked your site and I tested to change the url and baseurl options into _config.yml file because I'd like to use your theme for a non-profits organization site.
The test is into bilardi/JekyllMetroTest and I'd like to visualize it in https://bilardi.github.io/JekyllMetroTest.
Does your theme work with the github page and the jekyll automation?
Can you help me find where am I wrong?
Thank you.

Social share feature in blog posts

Introduce feature to share articles on social media from the blog post's page

Demo page at http://blog-olakara.rhcloud.com/ is not up anymore

Mini-Tiles : Almost Finished!

I wasn't ready to abandon them ... and after two hours they 're almost done! I've used your current code from http://blog-olakara.rhcloud.com/
Tomorrow I'll make new update in my forked repo and then you'll see the changes :)

Btw, can I include info about the mini tiles in the read.me file? ( instructions in small tutorial )

Enhancement of Blog page's layout

the blog home page's (http://blog-olakara.rhcloud.com/blog/) layout needs to be enhanced. rather than showing the articles completely, summary or just the basic info of the article is enough. Refer most of the Jekyll blogs.. they have a simple listing of articles.

Enhancement of Left navigation

Provide better layout of the left navigation:

1. Needs better alignment
2. show selected menu as active
3. provide better UI/UX

how to add more tiles?

can I add more tiles? or editing the icon used?

Enhancement of Article control

Provide better control buttons to move between pages, articles and jump to different sections on the page

Complete the Search model

Complete the Site Search Function

"Back To Top" button overlapping the button

Back to top button overlapping the button when scroll bar at the end:

Updated repo, code refactoring and responsive mini-tiles.

Here is my lattest commit: Stilyan-Kangalov@087b8ff

• Code refactoring ( the "nav" element in the index was outside the div container ).
• Fixed bug ( with duplicated links ) .
• Responsive mini-tiles.
  

<< In the next update I'll make more icons and layout rearrangement with new colors. >>

• 

CSS does not apply in mobile view

Hey great theme, but viewing the site on mobile doesn't show any applied css.

Here's my repo:
https://github.com/aliyeysides/aliyeysides.github.io

Search does not seem to work with Jekyll 3.0.0

When using the search page, a search.son document is requested, which does not seem to get generated, as the server returns a 404 error and the document does exist in the generated tree (nor somewhere else).

Maybe this is my fault, since I do not have taken any additional steps to create it.

Problem Resolved - My reso it's OK > different paddings on the blog.

I've opened 2 tabs and stated to compare them by fast switching. And here is what I found:

As you can see, there's different padding on the left side and this is the reason for the error! (in the mini-tile) You must fix it manually in your blog. My repo is OK, so you can merge without a problem :)

Custom Font Use

I'm trying to use Google Fonts, and I added this to my head.html:
CSS selector { font-family: 'Font Name', serif; }
But now I don't know where to put this:
font-family: 'Source Sans Pro', sans-serif;
I assume its in another CSS file, but I don't know. Anyone know?

configure error

Jekyll stops processing Metro with TypeError

The environment is set up as follows:

• OS: Mac OSX El Capitan
• Ruby: 2.2.3 via rvm
• Jekyll 3.0.0
• JekyllMetro 0.9x beta 2, dependencies from Gemfile installed via bundler

When calling either jekyll build or jekyll serve, the processing stops with default_proc=': wrong default_proc type NilClass (expected Proc) (TypeError).

Admittedly, I am totally new to jekyll, but since other themes seem to work (currently investigating which one to use), I thought it might be a problem specific to JekyllMetro.

Here is the output of -t for a pristine _config.yml:

Configuration file: /Users/markus/Downloads/JekyllMetro-master/_config.yml
/Users/markus/.rvm/gems/ruby-2.2.3/gems/jekyll-3.0.0/lib/jekyll/utils.rb:38:in `default_proc=': wrong default_proc type NilClass (expected Proc) (TypeError)
from /Users/markus/.rvm/gems/ruby-2.2.3/gems/jekyll-3.0.0/lib/jekyll/utils.rb:38:in `deep_merge_hashes!'
from /Users/markus/.rvm/gems/ruby-2.2.3/gems/jekyll-3.0.0/lib/jekyll/utils.rb:15:in `deep_merge_hashes'
from /Users/markus/.rvm/gems/ruby-2.2.3/gems/jekyll-3.0.0/lib/jekyll/configuration.rb:181:in `block in read_config_files'
from /Users/markus/.rvm/gems/ruby-2.2.3/gems/jekyll-3.0.0/lib/jekyll/configuration.rb:179:in `each'
from /Users/markus/.rvm/gems/ruby-2.2.3/gems/jekyll-3.0.0/lib/jekyll/configuration.rb:179:in `read_config_files'
from /Users/markus/.rvm/gems/ruby-2.2.3/gems/jekyll-3.0.0/lib/jekyll.rb:103:in `configuration'
from /Users/markus/.rvm/gems/ruby-2.2.3/gems/jekyll-3.0.0/lib/jekyll/command.rb:42:in `configuration_from_options'
from /Users/markus/.rvm/gems/ruby-2.2.3/gems/jekyll-3.0.0/lib/jekyll/commands/build.rb:29:in `process'
from /Users/markus/.rvm/gems/ruby-2.2.3/gems/jekyll-3.0.0/lib/jekyll/commands/build.rb:18:in `block (2 levels) in init_with_program'
from /Users/markus/.rvm/gems/ruby-2.2.3/gems/mercenary-0.3.5/lib/mercenary/command.rb:220:in `call'
from /Users/markus/.rvm/gems/ruby-2.2.3/gems/mercenary-0.3.5/lib/mercenary/command.rb:220:in `block in execute'
from /Users/markus/.rvm/gems/ruby-2.2.3/gems/mercenary-0.3.5/lib/mercenary/command.rb:220:in `each'
from /Users/markus/.rvm/gems/ruby-2.2.3/gems/mercenary-0.3.5/lib/mercenary/command.rb:220:in `execute'
from /Users/markus/.rvm/gems/ruby-2.2.3/gems/mercenary-0.3.5/lib/mercenary/program.rb:42:in `go'
from /Users/markus/.rvm/gems/ruby-2.2.3/gems/mercenary-0.3.5/lib/mercenary.rb:19:in `program'
from /Users/markus/.rvm/gems/ruby-2.2.3/gems/jekyll-3.0.0/bin/jekyll:17:in `<top (required)>'
from /Users/markus/.rvm/gems/ruby-2.2.3/bin/jekyll:23:in `load'
from /Users/markus/.rvm/gems/ruby-2.2.3/bin/jekyll:23:in `<main>'
from /Users/markus/.rvm/gems/ruby-2.2.3/bin/ruby_executable_hooks:15:in `eval'
from /Users/markus/.rvm/gems/ruby-2.2.3/bin/ruby_executable_hooks:15:in `<main>'

Standardize the tile and background color to correct metro color palette & introduce new colors

The colors used correctly are not the standard. May be we can use the standard metro palette. Also, currently the theme supports only 5 colors. Need to the whole metro palette.

Possible reference:

1. http://colorlib.com/etc/metro-colors#m-red
2. http://flatuicolors.com/
3. http://stackoverflow.com/questions/11578867/is-there-a-list-of-standard-tile-colors-for-metro-style-windows-8-apps/11579376#11579376
4. https://onedrive.live.com/view.aspx?resid=40CFFDE85F1AB56A!1284

Search Feature for Jekyll Metro

Implement searching functionality for the sites using Jekyll Metro. There are many possible solution out there:

1. Google custom search
2. lunr.js index search
3. static json file search

Some tags give 404

For example: http://blog-olakara.rhcloud.com/tags/Design/

Provide a simple Lightbox for images

Provide a simple Lightbox for images

Tags links is broken

On some tags when I click it gives me 404 error.

Tile with latest blog post details on the home page

Introduce a tile of double size that display the latest post on the home page.

Creating and adding more icons for "ready-to-use" tiles.

• YouTube ;
• Metacafe ;
• DeviantArt ;
• Vimeo ;
• GitHub ;

Bug detected and fixed: Duplicated links.

Accidently I ran into a small bug with duplicated links under every tile with image. It wasn't easy to remove with CSS, so I make some code refactoring with the index page. Now the problem is solved.

Merge artifacts in index.html and _includes/svg-icons.html

In both files, there are unresolved merge conflicts committed.

• Line#s in index.html: 111,113 and 117
• Line#s in _includes/svg-icons.html: 1,14,27

Since I am not sure which parts are intended to include and exclude, I could not fix that and send a pull request.