hj: January 2015

Tuesday, January 27, 2015

requirejs throws cannot find module [component/selector/abc] error

The file was there, but requirejs kept saying cannot find module
then I did a http request test to directly point to the javascript file and found it was 403 error permission. It turned out requirejs cannot access the file due to file permission issue.

The solution is to chmod or (On OS X) right click the file and 'Get Info' to change Everyone to READ in "Sharing and permissions" section.

Wednesday, January 14, 2015

CSS colors

http://sixrevisions.com/css/css-colors/ is an awesome post to explain the basics of CSS colors.

There are six ways to declare CSS colors:

Hexadecimal notation
RGB
RGBA
HSL (Hue, Saturation and Lightness)
HSLA
Color keywords

transparent Color Keyword
The transparent color keyword is simply a way to say that the color has 0% opacity.

currentColor Color Keyword
The currentColor color keyword is a convenience keyword that just means the color being declared is equal to the CSS color property value.

As we write SASS for CSS, I think it is best practice to use variable and hex color definition.

Tuesday, January 13, 2015

word-wrap vs word-break

word-wrap vs word-break

word-wrap property
word-wrap: normal | break-word
Specifies whether to break words when the content exceeds the boundaries of its container.

1. will wrap long words onto the next line.
2. adjusts different words so that they do not break in the middle.

The spec has changed again with regards to word-wrap. It’s now considered still valid, but is an “alternate name” for overflow-wrap. Browsers are required to continue to support it, so it seems pointless to use overflow-wrap.

word-break property
word-break: normal | break-all | keep-all
Specifies line-breaking behavior within words, particularly where multiple languages appear in the object.

Irrespective of whether it’s a continuous word or many words, breaks them up at the edge of the width limit. (i.e. even within the characters of the same word). It is frequently used for CJK characters.

So if you have many fixed-size spans which get content dynamically, you might just prefer using word-wrap: break-word, as that way only the continuous words are broken in between, and in case it’s a sentence comprising many words, the spaces are adjusted to get intact words (no break within a word).

hj