Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums Design New portfolio built with Jekyll and inuitcss – check it out!

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #188993
    keithpickering
    Participant

    http://keithpickering.net/

    I’ve been working on this redesign for a few months on and off, so it’s really exciting to finally have it up.

    I basically wanted to be able to show off my work in the simplest way possible. I tried to make scrolling down each page a unique and fluid experience, while still focusing on the content.

    I still have some performance optimizations to do, but I’m happy with how it looks and works as of now. In a few days I’ll write a blog post (my tumblr will also be getting a makeover) detailing some of the biggest changes, along with some challenges I faced.

    One thing I can say: if you’re going to be using Ruby ANYTHING in Windows, be prepared to go and get a cup of coffee every time you’re waiting for an operation to finish. Compiling my relatively small site with Jekyll takes nearly a minute each time.

    I’d appreciate any comments you’re willing to give – thanks guys!

    #189123
    Netnak
    Participant

    Hey, i’m loving the site! I have a question, how did you install inuit into jekyll? I’m starting out with frameworks and have no idea what i’m doing.

    If you could run a quick step by step i’d appreciate it. No one else seems to be using this setup and in my eyes it’s a match made in heaven.

    Thanks

    #189134
    keithpickering
    Participant

    Here’s the getting started guide, it should come in handy.

    Jekyll and inuitcss are totally separate, so you don’t really install one “into” another. Jekyll is just a generator that makes it easier to maintain a static HTML site – it’s not doing anything special other than creating HTML pages from the Liquid templates you create.

    Inuitcss, as you know, is just a CSS framework, so it doesn’t care about Jekyll, and vice versa. It’s composed of various modules, each one allowing you access to a certain set of styles. Unlike something huge like Bootstrap, you only import the modules you need.

    First, install Bower if you don’t have it. Then you need to grab the Inuit starter kit, which contains the only modules actually required by Inuit. After that, you can (using Bower) download whichever other modules you need. All these modules are saved in a bower_components folder and can be imported into your main SASS file.

    The version of inuit I used for this site is a little older, and it works by just saving inuitcss to its own folder and importing everything from there. However, I highly recommend using the new version and method because it’s put together much better. There’s also a whole CSS organization system created by Harry Roberts (covered in the link), which you should totally consider looking into.

    Thanks for the reply!

    #189212
    Chris House
    Participant

    I have three suggestions, all of which pertain to the Projects section.

    1. Lose the horizontal auto scrolling of the Projects pane. Your site is a bit “noisy” as-is, which is fine, but the automatic movement throws one too many visual curveballs at the user.
    2. On the Projects page, when I hover over a project I’m seeing a glitchy border blinking between some of the squares. I’m using Chrome.

    3. Also involving hovering over the Projects pane – I think the way it fades the entire projects section is unnecessary. Only changing the currently-hovered item might appear less messy.

    But those are pretty small issues. Overall the design looks awesome. It’s obvious you really love this stuff. Keep up the good work.

    #189253
    Jimmy
    Participant

    Hey Keith,

    Like @caiman said, it’s pretty clear you enjoy this stuff because your site looks great. I am a particularly big fan of the live-feed twitter box. It would be cool to see that in action.

    I also do see on your projects page (when you hover over individual items) the border is indeed slightly off center on just a few of them at different media queries(Chrome, Opera, Safari). Then again this is just picking at tiny things.

    Btw, I was blown away by some of the stuff you showcased in your blog.

Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘Design’ is closed to new topics and replies.