diff --git a/appcache.md b/appcache.md new file mode 100644 index 000000000..b431c3a3a --- /dev/null +++ b/appcache.md @@ -0,0 +1,17 @@ +--- +title: Appcache +layout: default +--- + +### Format + + CACHE MANIFEST + # version + + CACHE: + http://www.google.com/jsapi + /assets/app.js + /assets/bg.png + + NETWORK: + * diff --git a/bootstrap.md b/bootstrap.md new file mode 100644 index 000000000..9b49bb05d --- /dev/null +++ b/bootstrap.md @@ -0,0 +1,33 @@ +--- +title: Bootstrap +layout: default +--- + +### Media queries + + /* Small devices (tablets, 768px and up) */ + @media (min-width: @screen-sm-min) + + /* Medium devices (desktops, 992px and up) */ + @media (min-width: @screen-md-min) + + /* Large devices (large desktops, 1200px and up) */ + @media (min-width: @screen-lg-min) + +### Max + + /* mobile < 768px */ + @media (max-width: @screen-xs-max) + + /* tablets < 992px */ + @media (max-width: @screen-sm-max) + + /* desktop < 1200px */ + @media (max-width: @screen-md-max) + +### Columns + + .col-xs-1 + .col-sm-1 + .col-md-1 + .col-lg-1 diff --git a/css-flexbox.md b/css-flexbox.md new file mode 100644 index 000000000..7b6d4fe5d --- /dev/null +++ b/css-flexbox.md @@ -0,0 +1,56 @@ +--- +title: CSS flexbox +layout: default +--- + +Basic + + .container { + display: flex; + } + + .container > div { + flex: 0 1 auto; /* grow shrink basis */ + } + +Full + + .container { + display: flex; + display: inline-flex; + + flex-direction: row; /* ltr - default */ + flex-direction: row-reverse; /* rtl */ + + flex-direction: column; /* top-bottom */ + flex-direction: column-reverse; /* bottom-top */ + + flex-wrap: nowrap; /* one-line */ + flex-wrap: wrap; /* multi-line */ + + align-items: flex-start; /* vertical alignment - default */ + align-items: flex-end; + align-items: center; + + justify-content: flex-start; /* horizontal alignment - default */ + justify-content: flex-end; + justify-content: center; + } + + .container > div { + flex: 1 0 0; + order: 1; + flex-grow: 0; + } + +### Centering + + .container { + display: flex; + } + + .container > div { + width: 100px; + height: 100px; + margin: auto; + } diff --git a/email.md b/email.md new file mode 100644 index 000000000..529b48e22 --- /dev/null +++ b/email.md @@ -0,0 +1,25 @@ +--- +title: Email +layout: default +--- + +### Avoid these + + * position (Yahoo, Gmail) + * box-shadow (Yahoo, Gmail) + * height (Outlook) + * width in p/div (Outlook) + * padding in p/div (Outlook) + * data-URI (all webmail) + +### Basic layout + +
+ | + | + +### Responsive + + @media only screen and (max-device-width: 480px) diff --git a/express.md b/express.md index 8ae20b585..f4785ed6d 100644 --- a/express.md +++ b/express.md @@ -58,6 +58,12 @@ layout: default req.is('html') req.is('text/html') + req.headers + req.headers['host'] + req.headers['user-agent'] + req.headers['accept-encoding'] + req.headers['accept-language'] + ## Response diff --git a/ffmpeg.md b/ffmpeg.md index cdbe05090..9c3c9773a 100644 --- a/ffmpeg.md +++ b/ffmpeg.md @@ -34,9 +34,12 @@ layout: default ### To web + # no audio + ffmpeg -i input.mov -vcodec h264 -acodec null -strict -2 output.mp4 + ffmpeg -i input.mov -vcodec libvpx -acodec null output.webm + ffmpeg -i input.mov -vcodec h264 -acodec aac -strict -2 output.mp4 ffmpeg -i input.mov -vcodec libvpx -acodec libvorbis output.webm - # -acodec null |