Yannick Albert yckart

Bugs - Mobile (iOS 8)

Navigation closes immediately

Description
Menu opens (for less than ~100ms) and closes immediately again.

Reproduce
Click on the upper left menu icon, scroll a bit down (~10px), click menu icon again. Try to open the menu.

Here's a incomplete list with helpful things to help you with your work on something typography-related ;)

Articles

https://gist.github.com/yckart/c00df74ba685d5209bdb #vertical-rhythm
https://gist.github.com/yckart/03698c4c2c635fd4853b #typescale

Frameworks

Base font size

Most users won’t adjust their browser’s font settings, so the most common default font-size – the one to generally design against – is 16px. For some texts, this size works well, for others, something larger or smaller might be more suitable.

Regardless, the font-size of the <body> should be declared using the % unit of measure, even if the value is 100%. For example, to set the main text, on average, to 12px, use the following expression (keeping in mind that 12px is 75% of 16px)

Base line height

Whenever possible, line-height values should be set as a number, without any units. Applied to the <body> element, this will insure consistency in the proportion of line-height throughout the document, regardless of variations to font-size.

For example, if the <body> line-height is set to 1.25, then the computed line-height will always be 1.25 × the font-size of the element, unless stated otherwise. If the <body> font-size is set to 100%, it will typically have a computed siz

I had the need for some simplicity, to work with methods like push, pop, shift, unshift from Arrays prototype, that do not change itself.

Concept

The basic concept would look like something like this. I just implemented some basic methods to illustrate my thoughts. However, there are more possibilities. Read the note below.

Array#pop

array = array.slice(0, -1);

Try to rename these properties, right in this kind of fashion:

this._x = this.x;  =>  this.x = this._x;
this._y = this.y;  =>  this.y = this._y;
this._w = this.w;  =>  this.w = this._w;
this._h = this.h;  =>  this.h = this._h;

Read and sort horizontal, as usually.

var array = [1, 2, 3, 4, 5, 6, 7, 8];
var iterator = 0;

console.log( array.slice(iterator, iterator += 1) ); // => [1]
console.log( array.slice(iterator, iterator += 2) ); // => [2, 3]
console.log( array.slice(iterator, iterator += 3) ); // => [4, 5, 6]

The usage, with the utility-function below, is quite simple:

<div>0</div>
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>

function take (item, array, context) {

	@function BEMBEMBEM($property, $value) {
	$props: ();

	$props: append($props, #{$property}, comma);
	$props: append($props, #{$property}--#{$value}, comma);
	$props: append($props, #{$property}__#{$value}, comma);

	@return $props;
	}

	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>JS Bin</title>
	</head>
	<body>
	<a class="button button--gold">Pushy</a>
	<a class="button button--crimson">Hazey</a>
	<hr>

	DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
	Version 2, December 2004

	Copyright (C) 2015 Yannick Albert <http://yannick-albert.com>

	Everyone is permitted to copy and distribute verbatim or modified
	copies of this license document, and changing it is allowed as long
	as the name is changed.

	DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE