csswizardry / csswizardry.github.com

My site.

csswizardry.com

This is CSS Wizardry’s uncompiled Jekyll source code.

CSS Wizardry is built on Jekyll and inuit.css, this repository houses the CSS Wizardry specific source code for both.

Despite being open sourced, all CSS Wizardry code and content remain copyright of Harry Roberts.

H

csswizardry.github.com's Issues

Tidy up markdown

Gradual process; tidy up the markdown generated by exitwp.

Includes:

• Remove whitespace between list items
• Remove code tags from rendered pre elements.

Some images still pointing to wp-content/uploads

Hello!,

I just want to report that in this article http://csswizardry.com/2011/08/good-developers-are-illusionists/ the images are still pointing to the uploads folder in wordpress.

Thank you!

OS X Firefox font smoothing is not working

@include vendor(font-smoothing, antialiased);

produces:

-moz-font-smoothing: antialiased;

Which is not valid firefox property (at the moment). The actual code is -moz-osx-font-smoothing: grayscale; (as per http://maximilianhoffmann.com/posts/better-font-rendering-on-osx)

Non-comment ways to discuss articles

Consider leaving a hashtag/tweet link to discuss articles on ye olde Twitter in lieu of comments.

Web Design+ is gone?

Where does the article on this url: http://csswizardry.com/web-design+/ - have gone?

It's 404 – not found now.

Finalise copy

The about page, sidebar and footer need some proper copy.

Empty div in home page

Hi Harry,

Nothing serious but there is an empty <div class="wrapper"></div> just after you .page-head--masthead.

Florian.

No favicon?

Just wondering if there was a reason for this or if it's on a to-do list.

Current Year date - broken with Ruby update.

Hi, after giving you the advice about how to get the current date, as 'now' - it looks like this is busted in the ruby 1.9.3.

So where you have: {{ 'now' | date: '%y' }} https://github.com/csswizardry/csswizardry.github.com/blob/master/_layouts/default.html#L106

I think you need to to try:
{{ site.time | date: '%y' }}

Jekyll without Gemfile?

Hi @csswizardry, If I am not wrong I just noticed are using jekyll to build your personal site. I have been using jekyll like for a week now, and I have lot of trouble getting my own personal website with the custom theme (just like one you have), actually jekyll uses Gemfile to build your website, right? So my question is how can your repository does not have Gemfile?

beginner here :)

Provide example for 'Improving CSS tooltips'

In https://github.com/csswizardry/csswizardry.github.com/blob/master/_posts/2010-11-30-improving-css-tooltips.markdown it'd be nice if you included an example on the page.

I added the code from the example to the page in Chrome Inspector and added a title attribute to a link without problems.

Add XML sitemap

Look at making a sitemap in Jekyll

View.html

view.html iframes could just point to /, and would therefore work in your local developer environment, and over on your site. Any reason you chose to use 0.0.0.0:4000 rather than just /?

Button large used in markup but is not enabled in scss

I just saw .btn--large being used in your html, but you did not enable it in your main scss file.

Amend link to http://inuitcss.com

the GH pages set up is out of date and now GH displays the misconfigured domain. Change either the sub-content.html file to point to inuit repo or amend the GH pages settings.

Loving your work Harry, don't want this to come across as nit-picking, just want to make sure everything is live linked.

csswizardry-grids classes in IE8

IE8 doesn't support media queries so on your example page at:
http://csswizardry.com/csswizardry-grids/

Your desktop classes: desk--one-third
etc won't work on IE8

consider renaming to: one-third

Ubunto font hard to read in Chrome (win)

Like the title says, Ubuntu is really hard to read on windows/chrome, as there are literally pixels missing on some characters.

Not equal space in promo section

Hi Harry,

I don't know if it's intentional or not.
In .promo section, space isn't equal around the "or" (between button) when you are in lap and up resolution.

I'm using Safari 7

Florian.

Update link in `Open Sourcesome`

In the Addendum section, please update the he reversed that decision to http://adamwhitcroft.com/post/on-batch/

Cheers!

Correct attribution link in `_components.feature-list.scss`.

Attribution link in comments here is dead. It might have changed since you posted that, now it's http://www.heydonworks.com/article/tetris-and-the-power-of-css.

Cursor type for CSS Wizardry logo

Hi Harry,

I wonder why you use cursor: default instead of cursor: pointer for .site-nav__home link ?

Thanks, Florian.

Future proof date in the footer

Just a little thing, I'm using this on my Jekyll blog in the footer:

© {{ 'now' | date: "%Y" }}

Order of partial imports

There is a bug (kind of) in order of imports for settings section. Inuit's settings.defaults should come last (to be double positive), not first in that section. Otherwise $inuit-base-spacing-unit always equals to 24px (which is default value for $inuit-base-line-height), no matter if you happen to set $inuit-base-line-height to a different value in your settings.global.

It believe it is because scss compile doesn't "go back" (so to say) when compiling.

So this line:
$inuit-base-spacing-unit: $inuit-base-line-height;

equals to this:

$inuit-base-spacing-unit: 24px;

because at the moment compiler got to $inuit-base-spacing-unit the value of $inuit-base-line-height was 24px, and it doesn't go back to fix it the next time it encounters $inuit-base-line-height (with a different value).

It makes sense actually if you read about how !default works and if you know SCSS compiler is a PREprocessor :)

I found out about this the hard way in one of the projects I'm using inuit but forgot to make an issue on inuit repo. As I said the solution is to first set all your project variables and then include framework default settings.

HTML tags in displayed code

Your article on creating a CSS dropdown menu is quite helpful and well-written, but it also lets some <code> and <span> tags show through in the preformatted code.

Missing pictures in NHS case study

Hi Harry,

There are missing images in your NHS case study (they were present the last time I went on this page).

Florian.

Got any neat Git tips?

As per my Git article, does anyone have any useful snippets they’d like to share?

Link to RSS

Make sure there’s a decent link to the RSS feed.

Retina?

Is retina worth the increased image-size overhead? Ponder it, Harry!

Using @extend within mixin grid-media-query

Disregard. It's been a long day and I wasn't thinking.

Page Missing: fluid grid calculator

Not so much a bug but would love to see the fluid grid calculator back in action :)

http://csswizardry.com/2011/06/fluid-grid-calculator/

http://csswizardry.com/fluid-grids/

Hide verification files

You should put the google verification file on .gitignore

This would clean up the repository and increase your google apps security.

Tidy up CSS

Document, comment and generally neaten and rationalise any (S)CSS files.

Mentions of Sky

In About and the sidebar, should probably be amended to reflect your new status. Good luck and keep making it count.

Flag in speaking page

Hi Harry,

I just saw that the flags are gone in your speaking and workshops list, bug ?

Florian.

Font Bug

Hey Harry,
found a small bug:

Cheers!

Centrally align the site

A lot of people have complained that the site looks weird left-aligned, so I’m gonna centre it.

More info on h1/svg choice

I was recently re-reading your logo is an image article and I noticed you've taken a different approach on your new site. I was wondering if you could walk us through this.

Wizard doesn't like playing nice?

I recently put this mod inside my personal modpack and it works flawless... except for 1-2 instances a day. It's always random when it happens, nothing scheduled.
I'm currently using build 1.1.4 of this mod

This is the time-out my server logs show me, it spams this over and over before it needs to be force restarted. During the times of the spam, the entire server is unresponsive.
https://pastebin.com/Vz8TaF6D
When it reaches the end of the spam, this is what it says:
https://gyazo.com/6bf478ecb89b2258261b77c189b4ce7d

Any chance you could help me out in figuring what's wrong here and how to fix it?

Pr.ofile.me announcment link is broke

I figured I would mention this in case someone else tries to follow the link or sees this post but the link on line 75 (if your viewing the source on your site) is broken and goes to http://csswizardry.com/pr.ofile.me instead of http://pr.ofile.me/. A simple 404. Cheers!

Body text color difficult to read

Hi Harry! I love the new design, but I find that as I read lengthier articles, my eyes have to strain to read the body text. The "font-weight: 300" and "color: #555" combination seems a bit too frail for long reading. I had to use Evernote's "Clearly" browser extension to read your latest one on front-end performance.

How would you feel about bumping up the font-weight to 400, or maybe changing the body text color to something a bit darker (say, #444)? Just a thought. Attached is the original, then two variations so you can see the difference.

Cheers!