├── robots.txt ├── .nojekyll ├── CNAME ├── assets ├── 2015 │ └── style.css ├── favicon.png ├── print.css ├── script.js ├── style.css └── packed │ └── app.css ├── powerline.txt ├── redirects.json ├── jade.html ├── sh.html ├── jinja2.html ├── docker-compose.yml ├── package.html ├── phoenix-ecto@1.3.html ├── _redirects ├── LICENSE ├── netlify.toml ├── express.html ├── rails.html ├── 404.html ├── sitemap.xml ├── perl-pie.html └── cidr.html /robots.txt: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /.nojekyll: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /CNAME: -------------------------------------------------------------------------------- 1 | mirror.devhints.io 2 | -------------------------------------------------------------------------------- /assets/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rstacruz/devhints-mirror/gh-pages/assets/favicon.png -------------------------------------------------------------------------------- /powerline.txt: -------------------------------------------------------------------------------- 1 | Powerline: 2 | ⮂ 3 | ⮀ 4 | ⮃ 5 | ⮁ 6 | ⭤ 7 | ⭡ 8 | ⭠ 9 | 10 | 11 | ┌─┐ 12 | └─ 13 | ✈ 14 | ⋅ 15 | -------------------------------------------------------------------------------- /redirects.json: -------------------------------------------------------------------------------- 1 | {"/jade.html":"https://devhints.io/pug","/jinja2.html":"https://devhints.io/jinja","/package.html":"https://devhints.io/package.json","/phoenix-ecto@1.3.html":"https://devhints.io/phoenix-ecto","/sh.html":"https://devhints.io/bash"} -------------------------------------------------------------------------------- /jade.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Redirecting… 6 | 7 | 8 |

Redirecting...

9 | Click here if you are not redirected. 10 | 11 | 12 | -------------------------------------------------------------------------------- /sh.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Redirecting… 6 | 7 | 8 |

Redirecting...

9 | Click here if you are not redirected. 10 | 11 | 12 | -------------------------------------------------------------------------------- /jinja2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Redirecting… 6 | 7 | 8 |

Redirecting...

9 | Click here if you are not redirected. 10 | 11 | 12 | -------------------------------------------------------------------------------- /docker-compose.yml: -------------------------------------------------------------------------------- 1 | version: '3.8' 2 | services: 3 | web: 4 | build: . 5 | volumes: 6 | - .:/app 7 | - rubygems:/usr/local/bundle 8 | - ./node_modules:/app/node_modules 9 | - yarn_cache:/root/.cache/yarn 10 | ports: 11 | - '4001:4001' 12 | - '35729:35729' 13 | command: > 14 | bash -c 'yarn; bundle; env PORT=4001 HOST=0.0.0.0 yarn run dev' 15 | 16 | volumes: 17 | rubygems: 18 | node_modules: 19 | yarn_cache: 20 | -------------------------------------------------------------------------------- /package.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Redirecting… 6 | 7 | 8 |

Redirecting...

9 | Click here if you are not redirected. 10 | 11 | 12 | -------------------------------------------------------------------------------- /phoenix-ecto@1.3.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Redirecting… 6 | 7 | 8 |

Redirecting...

9 | Click here if you are not redirected. 10 | 11 | 12 | -------------------------------------------------------------------------------- /_redirects: -------------------------------------------------------------------------------- 1 | /brew /homebrew 301 2 | /commander-js /commander.js 301 3 | /css-animation /css#animation 301 4 | /css-background /css#background 301 5 | /css-font /css#fonts 301 6 | /css-selectors /css#selectors 301 7 | /date /datetime 301 8 | /es2015 /es6 301 9 | /es2016 /es6 301 10 | /es2017 /es6 301 11 | /es2018 /es6 301 12 | /expect.js /expectjs 301 13 | /factory_girl /factory_bot 301 14 | /fetch /js-fetch 301 15 | /flexbox /css-flexbox 301 16 | /flowtype /flow 301 17 | /gpgconf /gnupg 301 18 | /gpg /gnupg 301 19 | /gutom /ph-food-delivery 301 20 | /handlebars-js /handlebars.js 301 21 | /harvey-js /harvey.js 301 22 | /immutable-js /immutable.js 301 23 | /jade /pug 301 24 | /jinja2 /jinja 301 25 | /package.json /package-json 301 26 | /package /package-json 301 27 | /phoenix-ecto@1.3 /phoenix-ecto 301 28 | /sh /bash 301 29 | -------------------------------------------------------------------------------- /assets/print.css: -------------------------------------------------------------------------------- 1 | .site-header, .social-list, .about-the-site, 2 | #see-also, #see-also+ul { 3 | display: none; 4 | } 5 | /*.post-headline.-cheatsheet .prelude span:before { 6 | content: 'cheatsheet for' 7 | }*/ 8 | .post-list { 9 | margin: 0; 10 | padding-top: 0; 11 | padding-bottom: 0; 12 | } 13 | .post-item { 14 | max-width: 100%; 15 | } 16 | .post-headline.-cheatsheet .prelude { 17 | max-width: 300px; 18 | } 19 | .post-headline, p.prelude { 20 | margin-top: 0; 21 | } 22 | .post-headline.-cheatsheet .prelude { 23 | font-size: 0.6em; 24 | letter-spacing: 1px; 25 | } 26 | .post-headline { 27 | margin-bottom: 1.5em; 28 | } 29 | .post-headline.-cheatsheet .prelude span { 30 | padding: 0.75em 20px; 31 | border-bottom: solid 1.5px #111; 32 | } 33 | .post-headline.-cheatsheet h1 { 34 | font-size: 1.75em; 35 | text-shadow: none; 36 | } 37 | pre { 38 | border-top: solid 1px #ddd; 39 | border-bottom: solid 1px #ddd; 40 | background: none; 41 | } 42 | h3 { 43 | margin: 1em 0; 44 | } 45 | pre { 46 | margin-top: 1.1em; 47 | margin-bottom: 1.1em; 48 | } 49 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2021 Rico Sta. Cruz and contributors 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /assets/script.js: -------------------------------------------------------------------------------- 1 | (function () { 2 | var tags = document.querySelectorAll('h1,h2,h3,h4,h5,h6,li,p,span'); 3 | 4 | for (var i=0, len=tags.length; i') || 7 | (!tag.innerHTML.match(/https?:\/\//)))) 8 | continue; 9 | tag.innerHTML = tag.innerHTML.replace(/https?:\/\/[^ ]*/g, function (url) { 10 | url = url.replace(/[\.\),!]*$/, ''); 11 | var label = url; 12 | label = label.replace(/^https?:\/\//, '') 13 | .replace(/\/$/, ''); 14 | return ""+label+""; 15 | }); 16 | } 17 | })(); 18 | 19 | /* unorphan */ 20 | (function () { 21 | var els = document.querySelectorAll('h1 a, h1, h2, p.brief-intro, .pull-quote'); 22 | for (var i = 0, len = els.length; i < len; i++) { 23 | var el = els[i]; 24 | var last = el.lastChild; 25 | 26 | if (last && last.nodeType === 3) { 27 | console.log('=>', last.nodeValue, last.nodeValue.replace(/\s+([^\s]+\s*)$/g, '\xA0$1')); 28 | last.nodeValue = last.nodeValue.replace(/\s+([^\s]+\s*)$/g, '\xA0$1'); 29 | } 30 | } 31 | })(); 32 | 33 | /* loaded */ 34 | document.documentElement.className += ' loaded'; 35 | 36 | /* hljs */ 37 | (function () { 38 | var codes = document.querySelectorAll('pre > code'); 39 | for (var i = 0, len = codes.length; i < len; i++) { 40 | var block = codes[i]; 41 | hljs.highlightBlock(block); 42 | } 43 | })(); 44 | -------------------------------------------------------------------------------- /netlify.toml: -------------------------------------------------------------------------------- 1 | [build] 2 | command = "yarn build" 3 | publish = "_site/" 4 | environment = { NODE_VERSION = "20.9.0", RUBY_VERSION = "3.2.3", PYTHON_VERSION = "3.8" } 5 | 6 | [[redirects]] 7 | force = true 8 | from = "/flexbox" 9 | to = "/css-flexbox" 10 | 11 | [[redirects]] 12 | force = true 13 | from = "/flowtype" 14 | to = "/flow" 15 | 16 | [[redirects]] 17 | force = true 18 | from = "/gpgconf" 19 | to = "/gnupg" 20 | 21 | [[redirects]] 22 | force = true 23 | from = "/gpg" 24 | to = "/gnupg" 25 | 26 | [[redirects]] 27 | force = true 28 | from = "/gutom" 29 | to = "/ph-food-delivery" 30 | 31 | [[redirects]] 32 | force = true 33 | from = "/handlebars-js" 34 | to = "/handlebars.js" 35 | 36 | [[redirects]] 37 | force = true 38 | from = "/harvey-js" 39 | to = "/harvey.js" 40 | 41 | [[redirects]] 42 | force = true 43 | from = "/immutable-js" 44 | to = "/immutable.js" 45 | 46 | [[redirects]] 47 | force = true 48 | from = "/jade" 49 | to = "/pug" 50 | 51 | [[redirects]] 52 | force = true 53 | from = "/package" 54 | to = "/package-json" 55 | 56 | [[redirects]] 57 | force = true 58 | from = "/package.json" 59 | to = "/package-json" 60 | 61 | [[redirects]] 62 | force = true 63 | from = "/phoenix-ecto@1.3" 64 | to = "/phoenix-ecto" 65 | 66 | [[redirects]] 67 | force = true 68 | from = "/sh" 69 | to = "/bash" 70 | 71 | [[redirects]] 72 | force = true 73 | from = "/commander-js" 74 | to = "/commander.js" 75 | 76 | [[redirects]] 77 | force = true 78 | from = "/es2015" 79 | to = "/es6" 80 | 81 | [[redirects]] 82 | force = true 83 | from = "/es2016" 84 | to = "/es6" 85 | 86 | [[redirects]] 87 | force = true 88 | from = "/es2017" 89 | to = "/es6" 90 | 91 | [[redirects]] 92 | force = true 93 | from = "/es2018" 94 | to = "/es6" 95 | 96 | [[redirects]] 97 | force = true 98 | from = "/expect.js" 99 | to = "/expectjs" 100 | 101 | [[redirects]] 102 | force = true 103 | from = "/factory_girl" 104 | to = "/factory_bot" 105 | 106 | [[redirects]] 107 | force = true 108 | from = "/css-animation" 109 | to = "/css#animation" 110 | 111 | [[redirects]] 112 | force = true 113 | from = "/css-background" 114 | to = "/css#background" 115 | 116 | [[redirects]] 117 | force = true 118 | from = "/css-font" 119 | to = "/css#fonts" 120 | 121 | [[redirects]] 122 | force = true 123 | from = "/css-selectors" 124 | to = "/css#selectors" 125 | 126 | [[redirects]] 127 | force = true 128 | from = "/brew" 129 | to = "/homebrew" 130 | 131 | [[redirects]] 132 | force = true 133 | from = "/date" 134 | to = "/datetime" 135 | 136 | [[redirects]] 137 | force = true 138 | from = "/fetch" 139 | to = "/js-fetch" 140 | -------------------------------------------------------------------------------- /assets/style.css: -------------------------------------------------------------------------------- 1 | /* 2 | * pages list 3 | */ 4 | 5 | .pages-list { 6 | font-size: 0.9em; 7 | max-width: 800px; 8 | margin: 60px auto; 9 | overflow: hidden; 10 | } 11 | 12 | .pages-list a { 13 | display: block; 14 | padding: 6px 0; 15 | text-align: left; 16 | float: left; 17 | width: 44%; 18 | margin: 0 3%; 19 | box-shadow: none; 20 | transition: all 100ms linear; 21 | } 22 | 23 | .pages-list a .title, 24 | .pages-list a .date { 25 | display: block; 26 | } 27 | 28 | .pages-list a .title { 29 | font-weight: bold; 30 | color: #111; 31 | float: left; 32 | } 33 | 34 | .pages-list a .date { 35 | color: #aaa; 36 | font-size: 0.9em; 37 | float: right; 38 | } 39 | 40 | .pages-list a:hover .title, 41 | .pages-list a:focus .title { 42 | color: dodgerblue; 43 | } 44 | 45 | /* 46 | * post headline 47 | */ 48 | 49 | .post-headline.-cheatsheet .prelude { 50 | color: #111; 51 | font-size: 0.85em; 52 | text-transform: uppercase; 53 | letter-spacing: 2px; 54 | margin-bottom: 0; 55 | font-weight: bold; 56 | } 57 | 58 | .post-headline.-cheatsheet .prelude span:before { 59 | content: 'Cheatsheet for'; 60 | } 61 | 62 | @media (min-width: 769px) { 63 | .post-headline.-cheatsheet .prelude { 64 | max-width: 230px; 65 | margin-left: auto; 66 | margin-right: auto; 67 | } 68 | .post-headline.-cheatsheet .prelude span { 69 | display: inline-block; 70 | } 71 | } 72 | 73 | .post-headline.-cheatsheet h1 { 74 | color: #111; 75 | font-size: 3.5em; 76 | text-shadow: 2px 2px 0 white, 3px 3px 0 #ddd; 77 | margin-top: 20px; 78 | } 79 | 80 | /* 81 | * about the site 82 | */ 83 | 84 | .about-the-site { 85 | margin-top: 8em; 86 | } 87 | 88 | .about-the-site .back { 89 | margin-right: 0; 90 | } 91 | 92 | /* 93 | * markdown 94 | */ 95 | 96 | @media (min-width: 768px) { 97 | h2 { 98 | margin-top: 3em; 99 | } 100 | } 101 | 102 | /* 103 | * grey code 104 | */ 105 | 106 | .greycode td:first-child code, 107 | .greycode th:first-child code { 108 | background: white; 109 | padding: 6px 8px 5px 8px; 110 | border-radius: 3px; 111 | } 112 | 113 | .greycode td:first-child code + em, 114 | .greycode th:first-child code + em { 115 | color: #808890; 116 | font-size: 0.9em; 117 | margin: 0 5px; 118 | } 119 | 120 | .greycode a { 121 | margin: 0 5px; 122 | } 123 | 124 | @media (min-width: 768px) { 125 | table.greycode { 126 | background: #fcfcfc; 127 | border-radius: 4px; 128 | border-top: 0; 129 | border-bottom: solid 1px #c7d7ee; 130 | } 131 | 132 | table.greycode:not(.wide) { 133 | width: calc(620px + 100px); 134 | margin-left: -50px; 135 | } 136 | 137 | table.greycode thead:first-child > tr:first-child > th, 138 | table.greycode thead:first-child > tr:first-child > td, 139 | table.greycode tbody:first-child > tr:first-child > th, 140 | table.greycode tbody:first-child > tr:first-child > td, 141 | table.greycode.no-head thead:nth-child(2) > tr:first-child > th, 142 | table.greycode.no-head thead:nth-child(2) > tr:first-child > td, 143 | table.greycode.no-head tbody:nth-child(2) > tr:first-child > th, 144 | table.greycode.no-head tbody:nth-child(2) > tr:first-child > td { 145 | border-top: 0; 146 | } 147 | 148 | table.greycode thead > tr:first-child > th, 149 | table.greycode thead > tr:first-child > td, 150 | table.greycode tbody > tr:first-child > th, 151 | table.greycode tbody > tr:first-child > td { 152 | border-top: solid 1px #c7d7ee; 153 | } 154 | 155 | table.greycode td:first-child, 156 | table.greycode th:first-child { 157 | padding-left: 50px; 158 | } 159 | 160 | table.greycode td:last-child, 161 | table.greycode th:last-child { 162 | padding-right: 50px; 163 | } 164 | } 165 | 166 | .hljs-comment { 167 | font-style: normal; 168 | } 169 | 170 | .key-codes code { 171 | background: #fdfdff; 172 | padding: 3px 8px 3px 8px; 173 | border-radius: 3px; 174 | box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1); 175 | margin: 0 5px; 176 | } 177 | 178 | .key-codes code + code { 179 | margin-left: 0; 180 | } 181 | 182 | .key-codes pre code { 183 | background: transparent; 184 | padding: 0; 185 | box-shadow: none; 186 | margin: 0; 187 | } 188 | 189 | .social-list.-collapse { 190 | margin-top: 0; 191 | position: absolute; 192 | top: 40vh; 193 | left: 30px; 194 | width: 32px; 195 | } 196 | 197 | @media (max-width: 480px) { 198 | .social-list.-collapse { 199 | display: none; 200 | } 201 | } 202 | -------------------------------------------------------------------------------- /express.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | Express.js cheatsheet 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 |
99 | 100 | 105 | 106 | 107 | 108 | 121 | 142 | 143 | 144 |
145 |
146 |
147 |

148 |

Express.js

149 | 150 |
151 | 158 | 159 |
160 |
161 | 162 |
163 |

Settings

164 | 165 |
app.set('x', 'yyy')
166 | app.get('x') //=> 'yyy'
167 | 
168 | app.enable('trust proxy')
169 | app.disable('trust proxy')
170 | 
171 | app.enabled('trust proxy') //=> true
172 | 
173 | 174 |

Env

175 | 176 |
app.get('env')
177 | 
178 | 179 |

Config

180 | 181 |
app.configure('production', function() {
182 |   app.set...
183 | })
184 | 
185 | 186 |

Wares

187 | 188 |
app.use(express.static(__dirname + '/public'))
189 | app.use(express.logger())
190 | 
191 | 192 |

Helpers

193 | 194 |
app.locals({
195 |   title: "MyApp",
196 | })
197 | 
198 | 199 |

Request & response

200 | 201 |

Request

202 | 203 |
// GET  /user/tj
204 | req.path         //=> "/user/tj"
205 | req.url          //=> "/user/tj"
206 | req.xhr          //=> true|false
207 | req.method       //=> "GET"
208 | req.params
209 | req.params.name  //=> "tj"
210 | req.params[0]
211 | 
212 | 213 |
// GET /search?q=tobi+ferret
214 | req.query.q // => "tobi ferret"
215 | 
216 | 217 |
req.cookies
218 | 
219 | 220 |
req.accepted
221 | // [ { value: 'application/json', quality: 1, type: 'application', subtype: 'json' },
222 | //   { value: 'text/html', quality: 0.5, type: 'text',subtype: 'html' } ]
223 | 
224 | 225 |
req.is('html')
226 | req.is('text/html')
227 | 
228 | 229 |
req.headers
230 | req.headers['host']
231 | req.headers['user-agent']
232 | req.headers['accept-encoding']
233 | req.headers['accept-language']
234 | 
235 | 236 |

Response

237 | 238 |
res.redirect('/')
239 | res.redirect(301, '/')
240 | 
241 | 242 |
res.set('Content-Type', 'text/html')
243 | 
244 | 245 |
res.send('hi')
246 | res.send(200, 'hi')
247 | 
248 | 249 |
res.json({ a: 2 })
250 | 
251 | 252 |
253 | 254 | 255 | 260 | 261 |
262 |
263 | 264 |
265 |
266 |

267 | Devhints.io cheatsheets is a collection of cheatsheets I've written over the years. 268 | Suggestions and corrections? Send them in. 269 | 270 | I'm Rico Sta. Cruz. 271 | Check out my Today I learned blog for more. 272 |

273 | 274 | 275 |

276 | 277 |

278 | 279 | 280 |

281 |

282 |
283 |
284 | 285 | 286 | 287 | 288 | 289 | 290 | 291 | 292 | 293 | 294 | 295 | 296 | 297 | -------------------------------------------------------------------------------- /assets/packed/app.css: -------------------------------------------------------------------------------- 1 | pre[data-line]{position:relative;padding:1em 0 1em 3em}.line-highlight{position:absolute;left:0;right:0;padding:inherit 0;margin-top:1em;background:hsla(24,20%,50%,.08);background:linear-gradient(90deg,hsla(24,20%,50%,.1) 70%,hsla(24,20%,50%,0));pointer-events:none;line-height:inherit;white-space:pre}@media print{.line-highlight{-webkit-print-color-adjust:exact;color-adjust:exact}}.line-highlight:before,.line-highlight[data-end]:after{content:attr(data-start);position:absolute;top:.4em;left:.6em;min-width:1em;padding:0 .5em;background-color:hsla(24,20%,50%,.4);color:#f5f2f0;font:700 65%/1.5 sans-serif;text-align:center;vertical-align:.3em;border-radius:999px;text-shadow:none;box-shadow:0 1px #fff}.line-highlight[data-end]:after{content:attr(data-end);top:auto;bottom:.4em}.line-numbers .line-highlight:after,.line-numbers .line-highlight:before{content:none}pre[id].linkable-line-numbers span.line-numbers-rows{pointer-events:all}pre[id].linkable-line-numbers span.line-numbers-rows>span:before{cursor:pointer}pre[id].linkable-line-numbers span.line-numbers-rows>span:hover:before{background-color:hsla(0,0%,50.2%,.2)}/*! Hint.css - v2.7.0 - 2021-10-01 2 | * https://kushagra.dev/lab/hint/ 3 | * Copyright (c) 2021 Kushagra Gour */[class*=hint--]{position:relative;display:inline-block}[class*=hint--]:after,[class*=hint--]:before{position:absolute;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);transform:translateZ(0);visibility:hidden;opacity:0;z-index:1000000;pointer-events:none;-webkit-transition:.3s ease;-moz-transition:.3s ease;transition:.3s ease;-webkit-transition-delay:0s;-moz-transition-delay:0s;transition-delay:0s}[class*=hint--]:hover:after,[class*=hint--]:hover:before{visibility:visible;opacity:1;-webkit-transition-delay:.1s;-moz-transition-delay:.1s;transition-delay:.1s}[class*=hint--]:before{content:"";position:absolute;background:0 0;border:6px solid transparent;z-index:1000001}[class*=hint--]:after{background:#383838;color:#fff;padding:8px 10px;font-size:12px;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;line-height:12px;white-space:nowrap;text-shadow:0 -1px 0 #000;box-shadow:4px 4px 8px rgba(0,0,0,.3)}[class*=hint--][aria-label]:after{content:attr(aria-label)}[class*=hint--][data-hint]:after{content:attr(data-hint)}[aria-label=""]:after,[aria-label=""]:before,[data-hint=""]:after,[data-hint=""]:before{display:none!important}.hint--top-left:before,.hint--top-right:before,.hint--top:before{border-top-color:#383838}.hint--bottom-left:before,.hint--bottom-right:before,.hint--bottom:before{border-bottom-color:#383838}.hint--top:after,.hint--top:before{bottom:100%;left:50%}.hint--top:before{margin-bottom:-11px;left:calc(50% - 6px)}.hint--top:after{-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);transform:translateX(-50%)}.hint--top:hover:before{-webkit-transform:translateY(-8px);-moz-transform:translateY(-8px);transform:translateY(-8px)}.hint--top:hover:after{-webkit-transform:translateX(-50%) translateY(-8px);-moz-transform:translateX(-50%) translateY(-8px);transform:translateX(-50%) translateY(-8px)}.hint--bottom:after,.hint--bottom:before{top:100%;left:50%}.hint--bottom:before{margin-top:-11px;left:calc(50% - 6px)}.hint--bottom:after{-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);transform:translateX(-50%)}.hint--bottom:hover:before{-webkit-transform:translateY(8px);-moz-transform:translateY(8px);transform:translateY(8px)}.hint--bottom:hover:after{-webkit-transform:translateX(-50%) translateY(8px);-moz-transform:translateX(-50%) translateY(8px);transform:translateX(-50%) translateY(8px)}.hint--right:before{border-right-color:#383838;margin-left:-11px;margin-bottom:-6px}.hint--right:after{margin-bottom:-14px}.hint--right:after,.hint--right:before{left:100%;bottom:50%}.hint--right:hover:after,.hint--right:hover:before{-webkit-transform:translateX(8px);-moz-transform:translateX(8px);transform:translateX(8px)}.hint--left:before{border-left-color:#383838;margin-right:-11px;margin-bottom:-6px}.hint--left:after{margin-bottom:-14px}.hint--left:after,.hint--left:before{right:100%;bottom:50%}.hint--left:hover:after,.hint--left:hover:before{-webkit-transform:translateX(-8px);-moz-transform:translateX(-8px);transform:translateX(-8px)}.hint--top-left:after,.hint--top-left:before{bottom:100%;left:50%}.hint--top-left:before{margin-bottom:-11px;left:calc(50% - 6px)}.hint--top-left:after{-webkit-transform:translateX(-100%);-moz-transform:translateX(-100%);transform:translateX(-100%);margin-left:12px}.hint--top-left:hover:before{-webkit-transform:translateY(-8px);-moz-transform:translateY(-8px);transform:translateY(-8px)}.hint--top-left:hover:after{-webkit-transform:translateX(-100%) translateY(-8px);-moz-transform:translateX(-100%) translateY(-8px);transform:translateX(-100%) translateY(-8px)}.hint--top-right:after,.hint--top-right:before{bottom:100%;left:50%}.hint--top-right:before{margin-bottom:-11px;left:calc(50% - 6px)}.hint--top-right:after{-webkit-transform:translateX(0);-moz-transform:translateX(0);transform:translateX(0);margin-left:-12px}.hint--top-right:hover:after,.hint--top-right:hover:before{-webkit-transform:translateY(-8px);-moz-transform:translateY(-8px);transform:translateY(-8px)}.hint--bottom-left:after,.hint--bottom-left:before{top:100%;left:50%}.hint--bottom-left:before{margin-top:-11px;left:calc(50% - 6px)}.hint--bottom-left:after{-webkit-transform:translateX(-100%);-moz-transform:translateX(-100%);transform:translateX(-100%);margin-left:12px}.hint--bottom-left:hover:before{-webkit-transform:translateY(8px);-moz-transform:translateY(8px);transform:translateY(8px)}.hint--bottom-left:hover:after{-webkit-transform:translateX(-100%) translateY(8px);-moz-transform:translateX(-100%) translateY(8px);transform:translateX(-100%) translateY(8px)}.hint--bottom-right:after,.hint--bottom-right:before{top:100%;left:50%}.hint--bottom-right:before{margin-top:-11px;left:calc(50% - 6px)}.hint--bottom-right:after{-webkit-transform:translateX(0);-moz-transform:translateX(0);transform:translateX(0);margin-left:-12px}.hint--bottom-right:hover:after,.hint--bottom-right:hover:before{-webkit-transform:translateY(8px);-moz-transform:translateY(8px);transform:translateY(8px)}.hint--large:after,.hint--medium:after,.hint--small:after{white-space:normal;line-height:1.4em;word-wrap:break-word}.hint--small:after{width:80px}.hint--medium:after{width:150px}.hint--large:after{width:300px}.hint--error:after{background-color:#b34e4d;text-shadow:0 -1px 0 #592726}.hint--error.hint--top-left:before,.hint--error.hint--top-right:before,.hint--error.hint--top:before{border-top-color:#b34e4d}.hint--error.hint--bottom-left:before,.hint--error.hint--bottom-right:before,.hint--error.hint--bottom:before{border-bottom-color:#b34e4d}.hint--error.hint--left:before{border-left-color:#b34e4d}.hint--error.hint--right:before{border-right-color:#b34e4d}.hint--warning:after{background-color:#c09854;text-shadow:0 -1px 0 #6c5328}.hint--warning.hint--top-left:before,.hint--warning.hint--top-right:before,.hint--warning.hint--top:before{border-top-color:#c09854}.hint--warning.hint--bottom-left:before,.hint--warning.hint--bottom-right:before,.hint--warning.hint--bottom:before{border-bottom-color:#c09854}.hint--warning.hint--left:before{border-left-color:#c09854}.hint--warning.hint--right:before{border-right-color:#c09854}.hint--info:after{background-color:#3986ac;text-shadow:0 -1px 0 #1a3c4d}.hint--info.hint--top-left:before,.hint--info.hint--top-right:before,.hint--info.hint--top:before{border-top-color:#3986ac}.hint--info.hint--bottom-left:before,.hint--info.hint--bottom-right:before,.hint--info.hint--bottom:before{border-bottom-color:#3986ac}.hint--info.hint--left:before{border-left-color:#3986ac}.hint--info.hint--right:before{border-right-color:#3986ac}.hint--success:after{background-color:#458746;text-shadow:0 -1px 0 #1a321a}.hint--success.hint--top-left:before,.hint--success.hint--top-right:before,.hint--success.hint--top:before{border-top-color:#458746}.hint--success.hint--bottom-left:before,.hint--success.hint--bottom-right:before,.hint--success.hint--bottom:before{border-bottom-color:#458746}.hint--success.hint--left:before{border-left-color:#458746}.hint--success.hint--right:before{border-right-color:#458746}.hint--always:after,.hint--always:before{opacity:1;visibility:visible}.hint--always.hint--top:before{-webkit-transform:translateY(-8px);-moz-transform:translateY(-8px);transform:translateY(-8px)}.hint--always.hint--top:after{-webkit-transform:translateX(-50%) translateY(-8px);-moz-transform:translateX(-50%) translateY(-8px);transform:translateX(-50%) translateY(-8px)}.hint--always.hint--top-left:before{-webkit-transform:translateY(-8px);-moz-transform:translateY(-8px);transform:translateY(-8px)}.hint--always.hint--top-left:after{-webkit-transform:translateX(-100%) translateY(-8px);-moz-transform:translateX(-100%) translateY(-8px);transform:translateX(-100%) translateY(-8px)}.hint--always.hint--top-right:after,.hint--always.hint--top-right:before{-webkit-transform:translateY(-8px);-moz-transform:translateY(-8px);transform:translateY(-8px)}.hint--always.hint--bottom:before{-webkit-transform:translateY(8px);-moz-transform:translateY(8px);transform:translateY(8px)}.hint--always.hint--bottom:after{-webkit-transform:translateX(-50%) translateY(8px);-moz-transform:translateX(-50%) translateY(8px);transform:translateX(-50%) translateY(8px)}.hint--always.hint--bottom-left:before{-webkit-transform:translateY(8px);-moz-transform:translateY(8px);transform:translateY(8px)}.hint--always.hint--bottom-left:after{-webkit-transform:translateX(-100%) translateY(8px);-moz-transform:translateX(-100%) translateY(8px);transform:translateX(-100%) translateY(8px)}.hint--always.hint--bottom-right:after,.hint--always.hint--bottom-right:before{-webkit-transform:translateY(8px);-moz-transform:translateY(8px);transform:translateY(8px)}.hint--always.hint--left:after,.hint--always.hint--left:before{-webkit-transform:translateX(-8px);-moz-transform:translateX(-8px);transform:translateX(-8px)}.hint--always.hint--right:after,.hint--always.hint--right:before{-webkit-transform:translateX(8px);-moz-transform:translateX(8px);transform:translateX(8px)}.hint--rounded:after{border-radius:4px}.hint--no-animate:after,.hint--no-animate:before{-webkit-transition-duration:0s;-moz-transition-duration:0s;transition-duration:0s}.hint--bounce:after,.hint--bounce:before{-webkit-transition:opacity .3s ease,visibility .3s ease,-webkit-transform .3s cubic-bezier(.71,1.7,.77,1.24);-moz-transition:opacity .3s ease,visibility .3s ease,-moz-transform .3s cubic-bezier(.71,1.7,.77,1.24);transition:opacity .3s ease,visibility .3s ease,transform .3s cubic-bezier(.71,1.7,.77,1.24)}.hint--no-shadow:after,.hint--no-shadow:before{text-shadow:none;box-shadow:none}.hint--no-arrow:before{display:none} -------------------------------------------------------------------------------- /rails.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | Rails cheatsheet 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 |
99 | 100 | 105 | 106 | 107 | 108 | 121 | 142 | 143 | 144 |
145 |
146 |
147 |

148 |

Rails

149 | 150 |
151 | 158 | 159 |
160 |
161 | 162 |
163 |

Helpers

164 | 165 |
class ApplicationController
166 |   helper_method :logged_in?
167 | 
168 |   def logged_in?
169 |     "Something"
170 |   end
171 | end
172 | 
173 | 174 |

CSS/JS packages

175 | 176 |
stylesheet_link_tag :monkey
177 | javascript_link_tag :monkey
178 | 
179 | 180 |

Forms

181 | 182 |
# http://api.rubyonrails.org/classes/ActionView/Helpers/FormHelper.html
183 | 
184 | - form_for @person do |f|
185 |   = f.label :first_name
186 |   = f.label :first_name, "First name"
187 |   = f.text_field :first_name
188 | 
189 |   = f.label :last_name>
190 |   = f.text_field :last_name>
191 | 
192 |   - fields_for @person.permission do |fields|
193 |     = fields.checkbox :admin
194 | 
195 |   -# name="person[admin]"
196 |   - fields_for :person, @client do |fields|
197 |     = fields.checkbox :admin
198 | 
199 |   = f.submit
200 | 
201 | # Also: check_box, email_field, fields_for
202 | # file_field, hidden_field, label, number_field, password_field
203 | # radio_button, range_field, search_field, telephonen_field,
204 | # text_area, text_field, url_field
205 | 
206 | 207 |

Controllers

208 | 209 |

http://apidock.com/rails/ActionController/Base

210 | 211 |
class ProjectsController
212 |   layout 'project'   # Actually defaults to `projects` based
213 |                      # on the controller name
214 | 
215 |   def save
216 |   end
217 | 
218 |   def edit
219 |   end
220 | end
221 | 
222 | 223 |

Before filter

224 | 225 |
class ApplicationController < ActionController::Base
226 |   before_filter :validate, only: [:save, :edit]
227 |   before_filter :ensure_auth, except: [:logout]
228 | 
229 |   before_filter :require_login
230 |  
231 |   private
232 |  
233 |   def require_login
234 |     unless logged_in?
235 |       flash[:error] = "You must be logged in to access this section"
236 |       redirect_to new_login_url # halts request cycle
237 |     end
238 |   end
239 | end
240 | 
241 | 242 |

Default URL options

243 | 244 |
class ApplicationController < ActionController::Base
245 |   # The options parameter is the hash passed in to 'url_for'
246 |   def default_url_options(options)
247 |     {:locale => I18n.locale}
248 |   end
249 | end
250 | 
251 | 252 |

Hashes

253 | 254 |
session[:what]
255 | flash[:notice] = "Your session expired"
256 | params[:id]
257 | 
258 | 259 |

XML and JSON

260 | 261 |
class UsersController < ApplicationController
262 |   def index
263 |     @users = User.all
264 |     respond_to do |format|
265 |       format.html # index.html.erb
266 |       format.xml  { render :xml => @users}
267 |       format.json { render :json => @users}
268 |     end
269 |   end
270 | end
271 | 
272 | 273 |

Redirection

274 | 275 |
redirect_to action: 'show', id: @entry.id
276 | redirect_to root_url          # a path
277 | 
278 | 279 |

Render

280 | 281 |
render nothing: true
282 | render template: 'products/show'
283 | render status: 500
284 | render status: :forbidden
285 | render text: '...'
286 | render layout: 'special_layout'
287 | render layout: false
288 | render action: 'something'    # same as `file: 'my/something'`
289 |                               # Renders the template only, does not execute
290 |                               # the action
291 | 
292 | render json: object
293 | render xml: object
294 | 
295 | render location: photo_url(photo)
296 | 
297 | 298 |

Head-only responses

299 | 300 |
head :bad_request
301 | head :created, location: photo_path(@photo)
302 | 
303 | 304 |

Layouts

305 | 306 |
# app/views/layouts/application.html.erb
307 | <%= content_for?(:content) ? yield :content : yield %>
308 | 
309 | # app/views/layouts/news.html.erb
310 | <% content_for :content do %>
311 |    ...
312 | <% end %>
313 | <% render template: :'layouts/application' %>
314 | 
315 | 316 | 317 |
318 | 319 | 320 | 325 | 326 |
327 |
328 | 329 |
330 |
331 |

332 | Devhints.io cheatsheets is a collection of cheatsheets I've written over the years. 333 | Suggestions and corrections? Send them in. 334 | 335 | I'm Rico Sta. Cruz. 336 | Check out my Today I learned blog for more. 337 |

338 | 339 | 340 |

341 | 342 |

343 | 344 | 345 |

346 |

347 |
348 |
349 | 350 | 351 | 352 | 353 | 354 | 355 | 356 | 357 | 358 | 359 | 360 | 361 | 362 | -------------------------------------------------------------------------------- /404.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | Devhints.io cheatsheets 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 104 | 108 | 109 | 110 | 111 | 112 | 113 | 128 | 129 | 130 |
131 | 156 |
157 | 158 | 173 | 174 | 175 | 176 | 177 | 178 | 179 | -------------------------------------------------------------------------------- /sitemap.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | https://devhints.io/ 4 | https://devhints.io/101 5 | https://devhints.io/absinthe 6 | https://devhints.io/activeadmin 7 | https://devhints.io/adb 8 | https://devhints.io/analytics.js 9 | https://devhints.io/analytics 10 | https://devhints.io/angularjs 11 | https://devhints.io/animated_gif 12 | https://devhints.io/ansi 13 | https://devhints.io/ansible-examples 14 | https://devhints.io/ansible-guide 15 | https://devhints.io/ansible-modules 16 | https://devhints.io/ansible-roles 17 | https://devhints.io/ansible 18 | https://devhints.io/appcache 19 | https://devhints.io/applescript 20 | https://devhints.io/applinks 21 | https://devhints.io/arel 22 | https://devhints.io/atom 23 | https://devhints.io/awesome-redux 24 | https://devhints.io/awscli 25 | https://devhints.io/backbone 26 | https://devhints.io/bash 27 | https://devhints.io/blessed 28 | https://devhints.io/bluebird 29 | https://devhints.io/bolt 30 | https://devhints.io/bookshelf 31 | https://devhints.io/bootstrap 32 | https://devhints.io/deprecated/bower-api 33 | https://devhints.io/browser-sync 34 | https://devhints.io/browserify 35 | https://devhints.io/bulma 36 | https://devhints.io/bundler 37 | https://devhints.io/c_preprocessor 38 | https://devhints.io/camp 39 | https://devhints.io/canvas 40 | https://devhints.io/capybara 41 | https://devhints.io/cask-index 42 | https://devhints.io/chai 43 | https://devhints.io/cheatsheet-styles 44 | https://devhints.io/chef 45 | https://devhints.io/chunky_png 46 | https://devhints.io/cidr 47 | https://devhints.io/circle 48 | https://devhints.io/clip 49 | https://devhints.io/co 50 | https://devhints.io/command_line 51 | https://devhints.io/commander.js 52 | https://devhints.io/composer 53 | https://devhints.io/cordova 54 | https://devhints.io/cron 55 | https://devhints.io/csharp7 56 | https://devhints.io/css-antialias 57 | https://devhints.io/css-flexbox 58 | https://devhints.io/css-grid 59 | https://devhints.io/css-system-font-stack 60 | https://devhints.io/css-tricks 61 | https://devhints.io/css 62 | https://devhints.io/cssnext 63 | https://devhints.io/curl 64 | https://devhints.io/datetime 65 | https://devhints.io/deis 66 | https://devhints.io/deku 67 | https://devhints.io/deku@1 68 | https://devhints.io/devise 69 | https://devhints.io/divshot 70 | https://devhints.io/do 71 | https://devhints.io/docker-compose 72 | https://devhints.io/docker 73 | https://devhints.io/dockerfile 74 | https://devhints.io/dom-range 75 | https://devhints.io/dom-selection 76 | https://devhints.io/editorconfig 77 | https://devhints.io/elixir-metaprogramming 78 | https://devhints.io/elixir 79 | https://devhints.io/emacs 80 | https://devhints.io/ember 81 | https://devhints.io/emmet 82 | https://devhints.io/enzyme 83 | https://devhints.io/enzyme@2 84 | https://devhints.io/es6 85 | https://devhints.io/ets 86 | https://devhints.io/expectjs 87 | https://devhints.io/express 88 | https://devhints.io/exunit 89 | https://devhints.io/factory_bot 90 | https://devhints.io/fastify 91 | https://devhints.io/ffaker 92 | https://devhints.io/ffmpeg 93 | https://devhints.io/figlet 94 | https://devhints.io/find 95 | https://devhints.io/firebase 96 | https://devhints.io/firefox 97 | https://devhints.io/fish-shell 98 | https://devhints.io/flashlight 99 | https://devhints.io/flow 100 | https://devhints.io/flux 101 | https://devhints.io/flynn 102 | https://devhints.io/freenode 103 | https://devhints.io/frequency-separation-retouching 104 | https://devhints.io/fitness/general 105 | https://devhints.io/gh-pages 106 | https://devhints.io/git-branch 107 | https://devhints.io/git-extras 108 | https://devhints.io/git-log-format 109 | https://devhints.io/git-log 110 | https://devhints.io/git-revisions 111 | https://devhints.io/git-tricks 112 | https://devhints.io/gnupg 113 | https://devhints.io/go 114 | https://devhints.io/goby 115 | https://devhints.io/google-webfonts 116 | https://devhints.io/google_analytics 117 | https://devhints.io/graphql 118 | https://devhints.io/gremlins 119 | https://devhints.io/grep 120 | https://devhints.io/gulp 121 | https://devhints.io/haml 122 | https://devhints.io/handlebars.js 123 | https://devhints.io/harvey.js 124 | https://devhints.io/heroku 125 | https://devhints.io/hledger 126 | https://devhints.io/homebrew 127 | https://devhints.io/html-email 128 | https://devhints.io/html-input 129 | https://devhints.io/html-meta 130 | https://devhints.io/html-microformats 131 | https://devhints.io/html-share 132 | https://devhints.io/html 133 | https://devhints.io/http-status 134 | https://devhints.io/httpie 135 | https://devhints.io/ie 136 | https://devhints.io/ie_bugs 137 | https://devhints.io/imagemagick 138 | https://devhints.io/immutable.js 139 | https://devhints.io/inkscape 140 | https://devhints.io/wip/intl-datetime 141 | https://devhints.io/ios-provision 142 | https://devhints.io/jade 143 | https://devhints.io/jasmine 144 | https://devhints.io/jekyll-github 145 | https://devhints.io/jekyll 146 | https://devhints.io/jest 147 | https://devhints.io/jinja 148 | https://devhints.io/jinja2 149 | https://devhints.io/jquery-cdn 150 | https://devhints.io/jquery 151 | https://devhints.io/js-appcache 152 | https://devhints.io/js-array 153 | https://devhints.io/js-date 154 | https://devhints.io/js-fetch 155 | https://devhints.io/js-lazy 156 | https://devhints.io/js-model 157 | https://devhints.io/js-speech 158 | https://devhints.io/jscoverage 159 | https://devhints.io/jsdoc 160 | https://devhints.io/jshint 161 | https://devhints.io/knex 162 | https://devhints.io/koa 163 | https://devhints.io/kotlin 164 | https://devhints.io/kramdown 165 | https://devhints.io/layout-thrashing 166 | https://devhints.io/ledger-csv 167 | https://devhints.io/ledger-examples 168 | https://devhints.io/ledger-format 169 | https://devhints.io/ledger-periods 170 | https://devhints.io/ledger-query 171 | https://devhints.io/ledger 172 | https://devhints.io/less 173 | https://devhints.io/licenses 174 | https://devhints.io/linux 175 | https://devhints.io/lodash 176 | https://devhints.io/lua 177 | https://devhints.io/machinist 178 | https://devhints.io/macos-mouse-acceleration 179 | https://devhints.io/make-assets 180 | https://devhints.io/makefile 181 | https://devhints.io/mako 182 | https://devhints.io/man 183 | https://devhints.io/markdown 184 | https://devhints.io/meow 185 | https://devhints.io/meta-tags 186 | https://devhints.io/fitness/micronutrients 187 | https://devhints.io/middleman 188 | https://devhints.io/minimist 189 | https://devhints.io/minitest 190 | https://devhints.io/mixpanel 191 | https://devhints.io/mobx 192 | https://devhints.io/mocha-blanket 193 | https://devhints.io/mocha-html 194 | https://devhints.io/mocha-tdd 195 | https://devhints.io/mocha 196 | https://devhints.io/modella 197 | https://devhints.io/modernizr 198 | https://devhints.io/moment 199 | https://devhints.io/mysql 200 | https://devhints.io/ncftp 201 | https://devhints.io/nock 202 | https://devhints.io/nocode 203 | https://devhints.io/nodejs-assert 204 | https://devhints.io/nodejs-fs 205 | https://devhints.io/nodejs-path 206 | https://devhints.io/nodejs-process 207 | https://devhints.io/nodejs-stream 208 | https://devhints.io/nodejs 209 | https://devhints.io/nopt 210 | https://devhints.io/npm 211 | https://devhints.io/org-mode 212 | https://devhints.io/osx 213 | https://devhints.io/package-json 214 | https://devhints.io/package 215 | https://devhints.io/pacman 216 | https://devhints.io/parsimmon 217 | https://devhints.io/parsley 218 | https://devhints.io/pass 219 | https://devhints.io/passenger 220 | https://devhints.io/perl-pie 221 | https://devhints.io/ph-food-delivery 222 | https://devhints.io/fitness/phat 223 | https://devhints.io/phoenix-conn 224 | https://devhints.io/phoenix-ecto 225 | https://devhints.io/phoenix-ecto@1.2 226 | https://devhints.io/phoenix-ecto@1.3 227 | https://devhints.io/phoenix-migrations 228 | https://devhints.io/phoenix-routing 229 | https://devhints.io/phoenix 230 | https://devhints.io/phoenix@1.2 231 | https://devhints.io/wip/php 232 | https://devhints.io/plantuml 233 | https://devhints.io/pm2 234 | https://devhints.io/polyfill.io 235 | https://devhints.io/postgresql-json 236 | https://devhints.io/postgresql 237 | https://devhints.io/premailer 238 | https://devhints.io/projectionist 239 | https://devhints.io/promise 240 | https://devhints.io/pry 241 | https://devhints.io/psdrb 242 | https://devhints.io/pug 243 | https://devhints.io/python 244 | https://devhints.io/qjs 245 | https://devhints.io/qunit 246 | https://devhints.io/rack-test 247 | https://devhints.io/ractive 248 | https://devhints.io/rails-controllers 249 | https://devhints.io/rails-forms 250 | https://devhints.io/rails-helpers 251 | https://devhints.io/rails-i18n 252 | https://devhints.io/rails-migrations 253 | https://devhints.io/rails-models 254 | https://devhints.io/rails-plugins 255 | https://devhints.io/rails-routes 256 | https://devhints.io/rails-tricks 257 | https://devhints.io/rails 258 | https://devhints.io/rake 259 | https://devhints.io/rbenv 260 | https://devhints.io/rdoc 261 | https://devhints.io/react-router 262 | https://devhints.io/react 263 | https://devhints.io/react@0.14 264 | https://devhints.io/redux 265 | https://devhints.io/regexp 266 | https://devhints.io/rename 267 | https://devhints.io/resolutions 268 | https://devhints.io/rest-api 269 | https://devhints.io/riot 270 | https://devhints.io/rollup 271 | https://devhints.io/ronn 272 | https://devhints.io/rspec-rails 273 | https://devhints.io/rspec 274 | https://devhints.io/rst 275 | https://devhints.io/rsync 276 | https://devhints.io/rtorrent 277 | https://devhints.io/ruby 278 | https://devhints.io/ruby21 279 | https://devhints.io/rubygems 280 | https://devhints.io/sass 281 | https://devhints.io/saucelabs 282 | https://devhints.io/scp 283 | https://devhints.io/screen 284 | https://devhints.io/sed 285 | https://devhints.io/semver 286 | https://devhints.io/sequel 287 | https://devhints.io/sequelize 288 | https://devhints.io/sh-pipes 289 | https://devhints.io/sh 290 | https://devhints.io/shelljs 291 | https://devhints.io/siege 292 | https://devhints.io/simple_form 293 | https://devhints.io/sinon-chai 294 | https://devhints.io/sinon 295 | https://devhints.io/sketch 296 | https://devhints.io/slim 297 | https://devhints.io/social-images 298 | https://devhints.io/spacemacs 299 | https://devhints.io/spine 300 | https://devhints.io/spreadsheet 301 | https://devhints.io/sql-join 302 | https://devhints.io/stencil 303 | https://devhints.io/stimulus-reflex 304 | https://devhints.io/strftime 305 | https://devhints.io/stylus 306 | https://devhints.io/sublime-text 307 | https://devhints.io/superagent 308 | https://devhints.io/tabular 309 | https://devhints.io/tape 310 | https://devhints.io/tar 311 | https://devhints.io/textile 312 | https://devhints.io/tig 313 | https://devhints.io/tmux 314 | https://devhints.io/tomdoc 315 | https://devhints.io/top 316 | https://devhints.io/travis 317 | https://devhints.io/typescript 318 | https://devhints.io/ubuntu 319 | https://devhints.io/umdjs 320 | https://devhints.io/underscore-string 321 | https://devhints.io/unicode 322 | https://devhints.io/vagrant 323 | https://devhints.io/vagrantfile 324 | https://devhints.io/vainglory 325 | https://devhints.io/vim-diff 326 | https://devhints.io/vim-digraphs 327 | https://devhints.io/vim-easyalign 328 | https://devhints.io/vim-help 329 | https://devhints.io/vim-rails 330 | https://devhints.io/vim-unite 331 | https://devhints.io/vim 332 | https://devhints.io/vimscript-functions 333 | https://devhints.io/vimscript-snippets 334 | https://devhints.io/vimscript 335 | https://devhints.io/virtual-dom 336 | https://devhints.io/vows 337 | https://devhints.io/vscode 338 | https://devhints.io/vue 339 | https://devhints.io/vue@1.0.28 340 | https://devhints.io/watchexec 341 | https://devhints.io/watchman 342 | https://devhints.io/web-workers 343 | https://devhints.io/webpack 344 | https://devhints.io/weechat 345 | https://devhints.io/weinre 346 | https://devhints.io/xpath 347 | https://devhints.io/yaml 348 | https://devhints.io/yargs 349 | https://devhints.io/yarn 350 | https://devhints.io/yum 351 | https://devhints.io/znc 352 | https://devhints.io/zombie 353 | https://devhints.io/zsh 354 | https://devhints.io/assets/css/style.css 355 | https://devhints.io/redirects.json 356 | 357 | 358 | 359 | -------------------------------------------------------------------------------- /assets/2015/style.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | @import url("//code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css"); 3 | @import url("//cdn.jsdelivr.net/hint.css/1.3.2/hint.min.css"); 4 | @import url("//brick.a.ssl.fastly.net/Roboto:400,400i,700"); 5 | @import url("//fonts.googleapis.com/css?family=Raleway:800"); 6 | @import url("//fonts.googleapis.com/css?family=Fira+Mono:400,400i"); 7 | @import url("//brick.a.ssl.fastly.net/EB+Garamond:400i"); 8 | /* sizes */ 9 | /*! normalize.css v3.0.2 | MIT License | git.io/normalize */ 10 | /** 1. Set default font family to sans-serif. 2. Prevent iOS text size adjust after orientation change, without disabling user zoom. */ 11 | html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ } 12 | 13 | /** Remove default margin. */ 14 | body { margin: 0; } 15 | 16 | /* HTML5 display definitions ========================================================================== */ 17 | /** Correct `block` display not defined for any HTML5 element in IE 8/9. Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox. Correct `block` display not defined for `main` in IE 11. */ 18 | article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } 19 | 20 | /** 1. Correct `inline-block` display not defined in IE 8/9. 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. */ 21 | audio, canvas, progress, video { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ } 22 | 23 | /** Prevent modern browsers from displaying `audio` without controls. Remove excess height in iOS 5 devices. */ 24 | audio:not([controls]) { display: none; height: 0; } 25 | 26 | /** Address `[hidden]` styling not present in IE 8/9/10. Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. */ 27 | [hidden], template { display: none; } 28 | 29 | /* Links ========================================================================== */ 30 | /** Remove the gray background color from active links in IE 10. */ 31 | a { background-color: transparent; } 32 | 33 | /** Improve readability when focused and also mouse hovered in all browsers. */ 34 | a:active, a:hover { outline: 0; } 35 | 36 | /* Text-level semantics ========================================================================== */ 37 | /** Address styling not present in IE 8/9/10/11, Safari, and Chrome. */ 38 | abbr[title] { border-bottom: 1px dotted; } 39 | 40 | /** Address style set to `bolder` in Firefox 4+, Safari, and Chrome. */ 41 | b, strong { font-weight: bold; } 42 | 43 | /** Address styling not present in Safari and Chrome. */ 44 | dfn { font-style: italic; } 45 | 46 | /** Address variable `h1` font-size and margin within `section` and `article` contexts in Firefox 4+, Safari, and Chrome. */ 47 | h1 { font-size: 2em; margin: 0.67em 0; } 48 | 49 | /** Address styling not present in IE 8/9. */ 50 | mark { background: #ff0; color: #000; } 51 | 52 | /** Address inconsistent and variable font size in all browsers. */ 53 | small { font-size: 80%; } 54 | 55 | /** Prevent `sub` and `sup` affecting `line-height` in all browsers. */ 56 | sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } 57 | 58 | sup { top: -0.5em; } 59 | 60 | sub { bottom: -0.25em; } 61 | 62 | /* Embedded content ========================================================================== */ 63 | /** Remove border when inside `a` element in IE 8/9/10. */ 64 | img { border: 0; } 65 | 66 | /** Correct overflow not hidden in IE 9/10/11. */ 67 | svg:not(:root) { overflow: hidden; } 68 | 69 | /* Grouping content ========================================================================== */ 70 | /** Address margin not present in IE 8/9 and Safari. */ 71 | figure { margin: 1em 40px; } 72 | 73 | /** Address differences between Firefox and other browsers. */ 74 | hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; } 75 | 76 | /** Contain overflow in all browsers. */ 77 | pre { overflow: auto; } 78 | 79 | /** Address odd `em`-unit font size rendering in all browsers. */ 80 | code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } 81 | 82 | /* Forms ========================================================================== */ 83 | /** Known limitation: by default, Chrome and Safari on OS X allow very limited styling of `select`, unless a `border` property is set. */ 84 | /** 1. Correct color not being inherited. Known issue: affects color of disabled elements. 2. Correct font properties not being inherited. 3. Address margins set differently in Firefox 4+, Safari, and Chrome. */ 85 | button, input, optgroup, select, textarea { color: inherit; /* 1 */ font: inherit; /* 2 */ margin: 0; /* 3 */ } 86 | 87 | /** Address `overflow` set to `hidden` in IE 8/9/10/11. */ 88 | button { overflow: visible; } 89 | 90 | /** Address inconsistent `text-transform` inheritance for `button` and `select`. All other form control elements do not inherit `text-transform` values. Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. Correct `select` style inheritance in Firefox. */ 91 | button, select { text-transform: none; } 92 | 93 | /** 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls. 2. Correct inability to style clickable `input` types in iOS. 3. Improve usability and consistency of cursor style between image-type `input` and others. */ 94 | button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ } 95 | 96 | /** Re-set default cursor for disabled elements. */ 97 | button[disabled], html input[disabled] { cursor: default; } 98 | 99 | /** Remove inner padding and border in Firefox 4+. */ 100 | button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } 101 | 102 | /** Address Firefox 4+ setting `line-height` on `input` using `!important` in the UA stylesheet. */ 103 | input { line-height: normal; } 104 | 105 | /** It's recommended that you don't attempt to style these elements. Firefox's implementation doesn't respect box-sizing, padding, or width. 1. Address box sizing set to `content-box` in IE 8/9/10. 2. Remove excess padding in IE 8/9/10. */ 106 | input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } 107 | 108 | /** Fix the cursor style for Chrome's increment/decrement buttons. For certain `font-size` values of the `input`, it causes the cursor style of the decrement button to change from `default` to `text`. */ 109 | input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; } 110 | 111 | /** 1. Address `appearance` set to `searchfield` in Safari and Chrome. 2. Address `box-sizing` set to `border-box` in Safari and Chrome (include `-moz` to future-proof). */ 112 | input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; } 113 | 114 | /** Remove inner padding and search cancel button in Safari and Chrome on OS X. Safari (but not Chrome) clips the cancel button when the search input has padding (and `textfield` appearance). */ 115 | input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } 116 | 117 | /** Define consistent border, margin, and padding. */ 118 | fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } 119 | 120 | /** 1. Correct `color` not being inherited in IE 8/9/10/11. 2. Remove padding so people aren't caught out if they zero out fieldsets. */ 121 | legend { border: 0; /* 1 */ padding: 0; /* 2 */ } 122 | 123 | /** Remove default vertical scrollbar in IE 8/9/10/11. */ 124 | textarea { overflow: auto; } 125 | 126 | /** Don't inherit the `font-weight` (applied by a rule above). NOTE: the default cannot safely be changed in Chrome and Safari on OS X. */ 127 | optgroup { font-weight: bold; } 128 | 129 | /* Tables ========================================================================== */ 130 | /** Remove most spacing between table cells. */ 131 | table { border-collapse: collapse; border-spacing: 0; } 132 | 133 | td, th { padding: 0; } 134 | 135 | /* html base (html, body) */ 136 | * { text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } 137 | 138 | html { font-size: 17px; line-height: 1.7; background: #fff; color: #555; } 139 | @media (max-width: 768px) { html { font-size: 14px; } } 140 | 141 | html { transition: opacity 200ms linear; opacity: 1; } 142 | 143 | html, input, textarea, td, th { font-family: "Roboto", sans-serif; font-weight: 400; } 144 | 145 | html, body { overflow-x: hidden; } 146 | 147 | /* fouc prevention */ 148 | body { transition: opacity 100ms linear; } 149 | 150 | html.no-js * { opacity: 0; } 151 | 152 | /* basic styles (a, p, img...) */ 153 | a, a:visited { color: #555; text-decoration: none; box-shadow: inset 0 -1px rgba(136, 136, 136, 0.3); transition: all 100ms linear; } 154 | 155 | a:focus, a:hover { box-shadow: inset 0 -2px #1ea3ff; color: #151515; } 156 | 157 | strong, strong a, strong a:visited, b, b a, b a:visited { color: #151515; } 158 | 159 | h3, p, ul, ol { margin: 1.5em 0; } 160 | 161 | /* iframes */ 162 | p > iframe { margin: 0 auto; display: block; } 163 | 164 | /* lists */ 165 | ul, ol { padding-left: 1.5em; } 166 | 167 | ul { list-style: none; } 168 | ul > li { position: relative; } 169 | ul > li:before { content: ""; display: block; position: absolute; left: -1.4em; top: 0; margin-top: 0.7em; width: 4px; height: 4px; border-radius: 50%; border: solid 2px #c0d3da; } 170 | @media (max-width: 768px) { ul > li:before { width: 3px; height: 3px; } } 171 | 172 | /* headings */ 173 | h2, h2 a, h2 a:visited { color: #151515; } 174 | 175 | h2 { text-align: center; font-family: "eb garamond", serif; font-weight: 400; font-style: italic; font-size-adjust: none; -webkit-font-language-override: normal; font-language-override: normal; -webkit-font-kerning: auto; font-kerning: auto; -webkit-font-feature-settings: "kern", "liga", "dlig", "hlig", "cswh"; font-feature-settings: "kern", "liga", "dlig", "hlig", "cswh"; font-synthesis: weight style; font-size: 2em; line-height: 1.4; margin: 2em auto 0 auto; } 176 | @media (max-width: 768px) { h2 { font-size: 1.6em; } } 177 | 178 | @media (min-width: 769px) { h2:before, h2:after { content: ""; display: inline-block; vertical-align: middle; width: 46px; height: 1px; background: #c0d3da; margin: 0 30px; } } 179 | h3 { font-family: "raleway", sans-serif; font-weight: 800; font-size: 1.1em; margin-top: 2em; } 180 | h3, h3 a, h3 a:visited { color: #151515; } 181 | @media (max-width: 768px) { h3 { margin-top: 1.5em; } } 182 | 183 | h3 + p { margin-top: -1.7em; } 184 | 185 | /* images */ 186 | p > img:first-child:last-child { display: block; margin: 0 auto; max-width: 100%; } 187 | 188 | code { font-family: "fira mono", monospace; font-weight: 400; letter-spacing: -0.5px; text-rendering: auto; -webkit-font-smoothing: subpixel-antialiased; -moz-osx-font-smoothing: auto; font-size: 0.9em; } 189 | 190 | hr { width: 200px; height: 1px; border: 0; background: #c0d3da; margin: 3em auto; display: block; } 191 | 192 | /* table */ 193 | table { min-width: 100%; margin-top: 2em; margin-bottom: 2em; font-size: 0.9em; border-bottom: solid 1px #939aa1; } 194 | 195 | thead > tr:first-child > th, thead > tr:first-child > td, tbody > tr:first-child > th, tbody > tr:first-child > td { border-top: solid 1px #939aa1; } 196 | 197 | td, th { text-align: left; border-top: solid 1px #eef3fa; padding: 8px 10px; } 198 | 199 | th { font-family: "raleway", sans-serif; font-weight: 800; color: #151515; } 200 | 201 | td:first-child, th:first-child { text-align: left; padding-left: 0; } 202 | 203 | td:last-child, th:last-child { padding-right: 0; } 204 | 205 | table.no-head thead { display: none; } 206 | 207 | table.shortcuts { table-layout: fixed; } 208 | table.shortcuts thead { display: none; } 209 | table.shortcuts th:nth-child(1), table.shortcuts td:nth-child(1) { width: 25%; } 210 | table.shortcuts th:nth-child(2), table.shortcuts td:nth-child(2) { width: 75%; } 211 | table.shortcuts td:first-child > code { background: #fcfcfc; padding: 5px 10px; border-radius: 2px; } 212 | 213 | table.lite-headings { border-bottom: solid 1px #aab7be; } 214 | table.lite-headings th { color: #aab7be; font-size: 0.9em; } 215 | table.lite-headings thead > tr:first-child > td, table.lite-headings thead > tr:first-child > th { border-top: solid 1px #aab7be; } 216 | table.lite-headings tbody > tr:first-child > td, table.lite-headings tbody > tr:first-child > th { border-top: solid 1px #eef3fa; } 217 | 218 | /* pre > code -- code blocks */ 219 | pre > code { font-family: "fira mono", monospace; font-weight: 400; letter-spacing: -0.5px; text-rendering: auto; -webkit-font-smoothing: subpixel-antialiased; -moz-osx-font-smoothing: auto; font-size: 0.82em; color: #555; padding-right: 20px; } 220 | 221 | pre { padding: 20px 50px; border-radius: 4px; background: #f4f6f8; margin: 2.2em -50px; line-height: 1.2em; } 222 | @media (min-width: 768px) { pre { border-top: solid 1px #eef3fa; border-bottom: solid 1px #c7d7ee; border-radius: 4px; } } 223 | @media (max-width: 768px) { pre { padding: 20px; margin: 2em -20px; background: #ebeef2; } } 224 | @media (max-width: 660px) { pre { border-radius: 0; } } 225 | 226 | pre + pre { margin-top: -1.5em; } 227 | 228 | pre.medium > code { font-size: 1em; } 229 | @media (min-width: 768px) { pre.medium { padding-top: 30px; padding-bottom: 30px; } } 230 | 231 | pre.large > code { font-size: 1.1em; line-height: 1.4em; } 232 | @media (min-width: 768px) { pre.large { padding-top: 30px; padding-bottom: 30px; } } 233 | 234 | pre.terminal, pre.light { background: white; border: solid 1px #8fd1ff; position: relative; } 235 | 236 | pre.light { background: #fdfdff; } 237 | 238 | pre.terminal { padding-top: 56px; } 239 | pre.terminal.large { padding-top: 65px; } 240 | pre.terminal:before { content: ""; display: block; height: 34px; line-height: 34px; background: white; border-bottom: solid 1px #8fd1ff; border-top-left-radius: 3px; border-top-right-radius: 3px; position: absolute; top: 0; left: 0; right: 0; font-family: "raleway", sans-serif; font-weight: 800; } 241 | pre.terminal:after { content: ""; position: absolute; display: block; width: 4px; height: 4px; border-radius: 50%; left: 15px; top: 15px; font-size: 20px; background-color: #8fd1ff; box-shadow: 20px 0 #8fd1ff, 40px 0 #8fd1ff; } 242 | @media (max-width: 768px) { pre.terminal { margin-left: 0; margin-right: 0; } } 243 | 244 | pre + pre { margin-top: -1.7em; } 245 | 246 | @media (min-width: 769px) { pre.cursor > code > :last-child:after { content: ""; display: inline-block; width: 3px; height: 1em; transform: scaleY(1.5) translateY(0.1em); margin-left: 0.4em; background-color: #1ea3ff; -webkit-animation: blink 700ms steps(2, end) infinite; -moz-animation: blink 700ms steps(2, end) infinite; animation: blink 700ms steps(2, end) infinite; } } 247 | h3 + pre, h3 + table { margin-top: -1em; } 248 | 249 | /* .about-the-site */ 250 | .about-the-site { position: relative; } 251 | .about-the-site .container { text-align: center; padding: 3em 80px; margin: 0 auto; } 252 | .about-the-site .container:after { display: table; content: ""; clear: both; height: 0; zoom: 1; } 253 | @media (max-width: 768px) { .about-the-site .container { padding-left: 40px; padding-right: 40px; } } 254 | .about-the-site:before { content: ""; position: absolute; display: block; left: 20px; right: 20px; top: 0; border-top: solid 1px #eef3fa; } 255 | .about-the-site { font-family: "Roboto", sans-serif; font-weight: 400; font-size: 0.85em; color: #cacdd0; } 256 | .about-the-site a, .about-the-site a:visited { color: #aeb4b9; box-shadow: inset 0 -1px rgba(0, 0, 0, 0.05); padding-bottom: 2px; } 257 | .about-the-site a:hover, .about-the-site a:focus { color: #151515; box-shadow: inset 0 -2px #1ea3ff; } 258 | .about-the-site strong { font-family: "raleway", sans-serif; font-weight: 800; } 259 | .about-the-site strong a, .about-the-site strong a:visited { color: #151515; box-shadow: none; } 260 | .about-the-site strong a:hover, .about-the-site strong a:focus { color: #151515; box-shadow: inset 0 -2px #1ea3ff; } 261 | .about-the-site .identity { margin: 0; margin-top: 0.2em; float: right; font-family: "eb garamond", serif; font-weight: 400; font-style: italic; font-size-adjust: none; -webkit-font-language-override: normal; font-language-override: normal; -webkit-font-kerning: auto; font-kerning: auto; -webkit-font-feature-settings: "kern", "liga", "dlig", "hlig", "cswh"; font-feature-settings: "kern", "liga", "dlig", "hlig", "cswh"; font-synthesis: weight style; font-size: 2.5em; } 262 | .about-the-site .identity a, .about-the-site .identity a:visited { color: #151515; box-shadow: none; } 263 | .about-the-site .identity a:hover, .about-the-site .identity a:focus { color: #1ea3ff; } 264 | .about-the-site .blurb { margin: 0; max-width: 500px; text-align: left; float: left; line-height: 1.55; } 265 | .about-the-site .back { float: right; margin-top: 0.4em; margin-right: 2em; } 266 | .about-the-site .fleuron:before { content: ""; font-family: Ionicons; font-size: 16px; font-weight: normal; font-style: normal; display: inline-block; vertical-align: middle; color: #151515; margin: 0 7px; } 267 | @media (max-width: 768px) { .about-the-site .fleuron:before { display: none; } } 268 | @media (max-width: 768px) { .about-the-site .identity { float: left; clear: both; } 269 | .about-the-site .blurb { float: none; margin-bottom: 1em; width: auto; } 270 | .about-the-site .back { float: right; margin-right: 0; } } 271 | 272 | .big-button, a.big-button { display: inline-block; width: 180px; height: 50px; line-height: 48px; padding: 0; border-radius: 30px; font-size: 0.85em; box-shadow: none; background: transparent; } 273 | @media (max-width: 768px) { .big-button, a.big-button { width: 140px; height: 40px; line-height: 38px; } } 274 | .big-button, .big-button:visited, a.big-button, a.big-button:visited { border: solid 2px #1ea3ff; color: #1ea3ff; } 275 | .big-button.-back, .big-button.-back:visited, a.big-button.-back, a.big-button.-back:visited { border: solid 1px rgba(147, 154, 161, 0.2); color: #939aa1; } 276 | .big-button.-back:before, .big-button.-next:after, a.big-button.-back:before, a.big-button.-next:after { font-family: Ionicons; font-size: 20px; display: inline-block; vertical-align: middle; position: relative; top: -1px; } 277 | .big-button.-back:before, a.big-button.-back:before { content: ""; } 278 | .big-button.-next:after, a.big-button.-next:after { content: ""; margin-left: 16px; top: 0; } 279 | .big-button.-slim, a.big-button.-slim { width: 60px; border-width: 2px; height: 60px; line-height: 60px; border-radius: 50%; } 280 | @media (max-width: 768px) { .big-button.-slim, a.big-button.-slim { width: 40px; height: 40px; line-height: 40px; } } 281 | .big-button:hover, .big-button:focus, a.big-button:hover, a.big-button:focus { background: #1ea3ff; border-color: transparent; color: white; box-shadow: none; } 282 | .big-button.-back:hover, .big-button.-back:focus, a.big-button.-back:hover, a.big-button.-back:focus { background: #1ea3ff; color: white; } 283 | 284 | /* .brief-intro -- Brief introduction */ 285 | .brief-intro { font-size: 1.1em; color: #939aa1; } 286 | 287 | /* .full-image -- full width image containers */ 288 | .full-image { overflow: hidden; text-align: center; position: relative; } 289 | .full-image img { background: #fcfcfc; } 290 | .full-image.cropped img, .full-image.cropped img:first-child:last-child { margin-bottom: -50px; display: block; background: transparent; } 291 | .full-image.cropped:after { content: ""; display: block; position: absolute; bottom: 0; left: 20px; right: 20px; border-bottom: solid 1px #c0d3da; } 292 | .full-image.stretched img { width: 100%; } 293 | @media (max-width: 768px) { .full-image { margin-left: -20px; margin-right: -20px; } } 294 | @media (min-width: 769px) { .full-image { width: 100vw; margin-left: calc(-50vw + 620px / 2); } } 295 | 296 | .hint--top:before, .hint--bottom:before { margin-top: -14px; margin-left: -8px; border-radius: 2px; } 297 | .hint--top:before, .hint--top:after, .hint--bottom:before, .hint--bottom:after { transition-duration: 10ms; } 298 | .hint--top:after, .hint--bottom:after { box-shadow: none; border-radius: 2px; text-shadow: none; margin-left: -55px; } 299 | 300 | .hljs-literal, .hljs-number, .hljs-string, .hljs-symbol, .hljs-value { color: #1ea3ff; } 301 | 302 | .hljs-key, .hljs-attribute { color: #006cb7; } 303 | 304 | .hljs-keyword, .hljs-constant { color: #151515; } 305 | 306 | .hljs-comment { color: #939aa1; font-style: italic; } 307 | 308 | .token.comment, .token.prolog, .token.doctype, .token.cdata { color: #939aa1; font-style: italic; } 309 | 310 | .token.punctuation { color: #999; } 311 | 312 | .token.property, .token.tag, .token.boolean, .token.number, .token.constant, .token.symbol, .token.deleted { color: #905; } 313 | 314 | .token.selector, .token.attr-name, .token.string, .token.char, .token.builtin, .token.inserted { color: #1ea3ff; } 315 | 316 | .token.operator, .token.entity, .token.url, .language-css .token.string, .style .token.string { color: #a67f59; } 317 | 318 | .token.atrule, .token.attr-value, .token.keyword { color: #07a; } 319 | 320 | .token.function { color: #DD4A68; } 321 | 322 | .token.regex, .token.important, .token.variable { color: #e90; } 323 | 324 | .token.important, .token.bold { font-weight: bold; } 325 | 326 | .token.italic { font-style: italic; } 327 | 328 | .token.entity { cursor: help; } 329 | 330 | /* .next-article -- lead into the next article */ 331 | .next-article { display: block; padding: 0; margin-left: 40px; margin-right: 40px; position: relative; } 332 | .next-article, .next-article:hover, .next-article:focus { box-shadow: none; } 333 | .next-article:after { content: ""; display: block; position: absolute; left: -20px; right: -20px; bottom: 0; border-bottom: solid 1px #eef3fa; } 334 | .next-article + .about-the-site:before { display: none; } 335 | @media (max-width: 768px) { .next-article { margin-left: 0; margin-right: 0; } 336 | .next-article + .about-the-site:before { display: none; } } 337 | .next-article .container { display: block; text-align: center; padding: 10em 20px; } 338 | @media (min-width: 769px) { .next-article .container { margin-top: 8em; padding: 8em 20px; } } 339 | .next-article .h3 { display: block; margin: 0 auto auto; padding: 0; font-size: 2.2em; line-height: 1.3em; font-family: "raleway", sans-serif; font-weight: 800; color: white; transition: all 250ms linear; } 340 | @media (max-width: 768px) { .next-article .h3 { font-size: 1.5em; } } 341 | .next-article .h3, .next-article .excerpt { max-width: 558px; } 342 | .next-article .h3 + .excerpt { margin-top: 0.5em; } 343 | .next-article .excerpt { display: block; margin-left: auto; margin-right: auto; font-size: 1em; line-height: 1.6em; } 344 | .next-article .big-button { margin-top: 2em; } 345 | .next-article h3 a:hover, .next-article h3 a:focus { color: #1ea3ff; } 346 | .next-article .heading { display: block; text-transform: uppercase; letter-spacing: 2px; font-size: 0.7em; margin-bottom: 1em; } 347 | .next-article .heading:before { font-family: Ionicons; content: ""; margin-right: 15px; font-size: 16px; display: inline-block; vertical-align: middle; color: #1ea3ff; } 348 | .next-article .big-button, .next-article a.big-button { background: transparent; } 349 | .next-article .big-button, .next-article .big-button:visited, .next-article a.big-button, .next-article a.big-button:visited { border-color: #1ea3ff; color: white; } 350 | .next-article .big-button:hover, .next-article .big-button:focus, .next-article a.big-button:hover, .next-article a.big-button:focus { background: #1ea3ff; border-color: transparent; } 351 | 352 | .next-article { background: url("data:image/svg+xml;utf8,") -50px top/110% auto no-repeat, linear-gradient(to right, rgba(97, 46, 118, 0.9), rgba(88, 103, 204, 0.9)), linear-gradient(177deg, rgba(97, 46, 118, 0), rgba(97, 46, 118, 0.9)), url("") center center/cover, #612e76; } 353 | .next-article:hover, .next-article:focus { background: url("data:image/svg+xml;utf8,") -50px top/110% auto no-repeat, linear-gradient(to right, rgba(100, 47, 122, 0.9), rgba(92, 107, 205, 0.9)), linear-gradient(177deg, rgba(97, 46, 118, 0), rgba(97, 46, 118, 0.9)), url("") center center/cover, #612e76; } 354 | .next-article .excerpt, .next-article .heading { color: #d8cbdd; } 355 | .next-article.-v2 { text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); } 356 | .next-article.-v2 { background: url("data:image/svg+xml;utf8,") -50px top/110% auto no-repeat, linear-gradient(to right, rgba(2, 125, 101, 0.7), rgba(0, 83, 107, 0.7)), linear-gradient(35deg, rgba(2, 125, 101, 0), rgba(2, 125, 101, 0.9)), url("bg/pebbles.jpg") center center/cover, #027d65; } 357 | .next-article.-v2:hover, .next-article.-v2:focus { background: url("data:image/svg+xml;utf8,") -50px top/110% auto no-repeat, linear-gradient(to right, rgba(2, 130, 105, 0.7), rgba(0, 87, 112, 0.7)), linear-gradient(35deg, rgba(2, 125, 101, 0), rgba(2, 125, 101, 0.9)), url("bg/pebbles.jpg") center center/cover, #027d65; } 358 | .next-article.-v2 .excerpt, .next-article.-v2 .heading { color: #c0dfd9; } 359 | .next-article.-v3 { text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); } 360 | .next-article.-v3 { background: url("data:image/svg+xml;utf8,") -50px top/110% auto no-repeat, linear-gradient(to right, rgba(29, 36, 52, 0.9), rgba(32, 42, 62, 0.9)), linear-gradient(1deg, rgba(29, 36, 52, 0), rgba(29, 36, 52, 0.9)), url("bg/roughwall.jpg") center center/cover, #1d2434; } 361 | .next-article.-v3:hover, .next-article.-v3:focus { background: url("data:image/svg+xml;utf8,") -50px top/110% auto no-repeat, linear-gradient(to right, rgba(31, 38, 55, 0.9), rgba(34, 44, 65, 0.9)), linear-gradient(1deg, rgba(29, 36, 52, 0), rgba(29, 36, 52, 0.9)), url("bg/roughwall.jpg") center center/cover, #1d2434; } 362 | .next-article.-v3 .excerpt, .next-article.-v3 .heading { color: #c7c8cc; } 363 | .next-article.-v4 { text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); } 364 | .next-article.-v4 { background: url("data:image/svg+xml;utf8,") -50px top/110% auto no-repeat, linear-gradient(to right, rgba(144, 32, 20, 0.45), rgba(199, 126, 10, 0.45)), linear-gradient(1deg, rgba(144, 32, 20, 0), rgba(144, 32, 20, 0.9)), url("bg/woodfloor.jpg") center center/cover, #902014; } 365 | .next-article.-v4:hover, .next-article.-v4:focus { background: url("data:image/svg+xml;utf8,") -50px top/110% auto no-repeat, linear-gradient(to right, rgba(148, 33, 21, 0.45), rgba(204, 129, 10, 0.45)), linear-gradient(1deg, rgba(144, 32, 20, 0), rgba(144, 32, 20, 0.9)), url("bg/woodfloor.jpg") center center/cover, #902014; } 366 | .next-article.-v4 .excerpt, .next-article.-v4 .heading { color: #e3c7c4; } 367 | .next-article.-v5 { text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); } 368 | .next-article.-v5 { background: url("data:image/svg+xml;utf8,") -50px top/110% auto no-repeat, linear-gradient(to right, rgba(23, 40, 58, 0.85), rgba(37, 41, 94, 0.85)), linear-gradient(1deg, rgba(23, 40, 58, 0), rgba(23, 40, 58, 0.9)), url("bg/stairs.jpg") center center/cover, #17283a; } 369 | .next-article.-v5:hover, .next-article.-v5:focus { background: url("data:image/svg+xml;utf8,") -50px top/110% auto no-repeat, linear-gradient(to right, rgba(24, 43, 62, 0.85), rgba(38, 43, 98, 0.85)), linear-gradient(1deg, rgba(23, 40, 58, 0), rgba(23, 40, 58, 0.9)), url("bg/stairs.jpg") center center/cover, #17283a; } 370 | .next-article.-v5 .excerpt, .next-article.-v5 .heading { color: #c5c9ce; } 371 | 372 | /* .post-headline -- H1's of posts */ 373 | .post-headline { margin: 1.5em auto 3em auto; text-align: center; } 374 | .post-headline .post-icon { margin-bottom: 2px; } 375 | .post-headline h1 { text-align: center; margin-bottom: 0; font-family: "eb garamond", serif; font-weight: 400; font-style: italic; font-size-adjust: none; -webkit-font-language-override: normal; font-language-override: normal; -webkit-font-kerning: auto; font-kerning: auto; -webkit-font-feature-settings: "kern", "liga", "dlig", "hlig", "cswh"; font-feature-settings: "kern", "liga", "dlig", "hlig", "cswh"; font-synthesis: weight style; font-size: 2.8em; line-height: 1.2; width: 80%; margin-left: auto; margin-right: auto; } 376 | @media (max-width: 768px) { .post-headline h1 { font-size: 2em; } } 377 | .post-headline .meta { display: block; text-align: center; margin: 0; margin-top: 1em; font-weight: normal; text-transform: uppercase; letter-spacing: 2px; font-size: 0.8em; } 378 | .post-headline .meta .author, .post-headline .meta .date { margin: 0 5px; padding-bottom: 2px; } 379 | .post-headline .meta a, .post-headline .meta a:visited { color: #939aa1; } 380 | .post-headline .meta a:hover, .post-headline .meta a:hover span, .post-headline .meta a:focus, .post-headline .meta a:focus span { color: #939aa1; } 381 | .post-headline .meta a:hover time, .post-headline .meta a:focus time { color: #151515; box-shadow: inset 0 -2px #1ea3ff; } 382 | .post-headline a, .post-headline a:visited, .post-headline a:focus, .post-headline a:hover { color: #151515; text-decoration: none; box-shadow: none; } 383 | .post-headline .pubbox { margin-top: 32px; font-size: 16px; line-height: 1.5; } 384 | .post-headline .carbon-img { margin-top: 4px; } 385 | 386 | /* .post-icon -- category icons */ 387 | .post-icon, abbr.post-icon { border: 0; margin: 0; display: inline-block; width: 56px; height: 56px; line-height: 58px; text-align: center; border-radius: 50%; color: #aaa; background: #eee; font-family: "Roboto", sans-serif; font-weight: 400; font-size: 16px; letter-spacing: 1px; } 388 | .post-icon span:after, abbr.post-icon span:after { content: attr(data-label); font-size: 0.9em; position: relative; top: -1px; } 389 | @media (max-width: 480px) { .post-icon, abbr.post-icon { transform: scale(0.75); } } 390 | .post-icon.-icon-css, abbr.post-icon.-icon-css { font-size: 14px; line-height: 58px; } 391 | .post-icon.-icon-css, abbr.post-icon.-icon-css { background: #3498db; color: white; box-shadow: -2px 2px #e67e22, 2px -2px #f1c40f, 1px -2px rgba(52, 152, 219, 0.2), 1px 3px rgba(52, 152, 219, 0.3); } 392 | .post-icon.-icon-css span:after, abbr.post-icon.-icon-css span:after { content: "CSS"; } 393 | .post-icon.-icon-development, abbr.post-icon.-icon-development { font-size: 14px; line-height: 58px; } 394 | .post-icon.-icon-development, abbr.post-icon.-icon-development { background: #34495e; color: #b9c9d8; box-shadow: -2px 2px #e67e22, 2px -2px #f1c40f, 1px -2px rgba(52, 73, 94, 0.2), 1px 3px rgba(52, 73, 94, 0.3); } 395 | .post-icon.-icon-development span:after, abbr.post-icon.-icon-development span:after { content: "DEV"; } 396 | .post-icon.-icon-ruby, abbr.post-icon.-icon-ruby { text-indent: 2px; } 397 | .post-icon.-icon-ruby, abbr.post-icon.-icon-ruby { background: #e74c3c; color: white; box-shadow: -2px 2px #e67e22, 2px -2px #f1c40f, 1px -2px rgba(231, 76, 60, 0.2), 1px 3px rgba(231, 76, 60, 0.3); } 398 | .post-icon.-icon-ruby span:after, abbr.post-icon.-icon-ruby span:after { content: "RB"; } 399 | .post-icon.-icon-javascript, abbr.post-icon.-icon-javascript { text-indent: 1px; } 400 | .post-icon.-icon-javascript, abbr.post-icon.-icon-javascript { background: #2ecc71; color: #fbfefc; box-shadow: -2px 2px #e67e22, 2px -2px #f1c40f, 1px -2px rgba(46, 204, 113, 0.2), 1px 3px rgba(46, 204, 113, 0.3); } 401 | .post-icon.-icon-javascript span:after, abbr.post-icon.-icon-javascript span:after { content: "JS"; } 402 | .post-icon.-icon-productivity, abbr.post-icon.-icon-productivity { text-indent: 1px; } 403 | .post-icon.-icon-productivity, abbr.post-icon.-icon-productivity { background: #2ecc71; color: #fbfefc; box-shadow: -2px 2px #e67e22, 2px -2px #f1c40f, 1px -2px rgba(46, 204, 113, 0.2), 1px 3px rgba(46, 204, 113, 0.3); } 404 | .post-icon.-icon-productivity span:after, abbr.post-icon.-icon-productivity span:after { content: "PROD"; } 405 | 406 | /* .post-index (et al) -- utility classes */ 407 | .post-index { margin: 0 auto 4em auto; position: relative; padding-top: 4em; font-size: 0.9em; } 408 | .post-index .container { overflow: hidden; max-width: 620px; margin: 0 auto; } 409 | .post-index h3 { text-transform: uppercase; letter-spacing: 2px; color: #939aa1; font-size: 1em; } 410 | 411 | .post-index-item { display: block; overflow: hidden; padding: 6px 20px; border-top: solid 1px #eef3fa; } 412 | .post-index-item, .post-index-item:hover, .post-index-item:focus { box-shadow: none; } 413 | .post-index-item:hover .article, .post-index-item:focus .article { transition: none; } 414 | .post-index-item .date { display: block; } 415 | .post-index-item .date { width: 100px; font-size: 0.8em; color: #939aa1; } 416 | @media (min-width: 768px) { .post-index-item { padding-left: 0; padding-right: 0; } 417 | .post-index-item .date, .post-index-item .tag { margin-top: 0.2em; } 418 | .post-index-item .date, .post-index-item article { float: left; } 419 | .post-index-item .tag { float: right; } } 420 | .post-index-item .article { color: #555; margin-right: 3px; transition: all 100ms linear; } 421 | .post-index-item:hover .article { color: #1ea3ff; } 422 | .post-index-item:nth-of-type(1) .article, .post-index-item:nth-of-type(2) .article, .post-index-item:nth-of-type(3) .article, .post-index-item:nth-of-type(4) .article { font-family: "raleway", sans-serif; font-weight: 800; } 423 | .post-index-item .tag { color: #939aa1; font-weight: normal; font-size: 0.8em; } 424 | 425 | .post-item { max-width: 620px; margin: 0 auto; } 426 | 427 | .post-list { margin: 40px auto; padding: 20px; } 428 | @media (max-width: 768px) { .post-list { margin: 0 auto; } } 429 | 430 | .post-list > .post-item:not(:first-child):before { content: ""; display: block; width: 150px; height: 1px; background: #eef3fa; margin: 7em auto; } 431 | @media (max-width: 768px) { .post-list > .post-item:not(:first-child):before { margin: 4em auto; } } 432 | 433 | .site-header { text-align: center; padding: 0 20px; } 434 | .site-header .container { padding: 15px 20px; font-size: 0.9em; color: rgba(147, 154, 161, 0.6); border-bottom: solid 1px #eef3fa; } 435 | .site-header em { font-family: "eb garamond", serif; font-weight: 400; font-style: italic; font-size-adjust: none; -webkit-font-language-override: normal; font-language-override: normal; -webkit-font-kerning: auto; font-kerning: auto; -webkit-font-feature-settings: "kern", "liga", "dlig", "hlig", "cswh"; font-feature-settings: "kern", "liga", "dlig", "hlig", "cswh"; font-synthesis: weight style; font-size: 1.1em; font-size: 1.1em; color: #555; } 436 | 437 | /* .social-list -- social share icons */ 438 | .social-list, .social-list li { margin: 0; padding: 0; } 439 | .social-list { display: block; text-align: center; width: 100%; margin-top: 2em; } 440 | @media (min-width: 768px) { .social-list { margin-top: 4em; } } 441 | .social-list.-top { margin-top: -2em; } 442 | @media (min-width: 768px) { .social-list.-top { margin-top: -1em; } } 443 | .social-list li { display: inline-block; } 444 | .social-list a { display: inline-block; padding: 6px; text-align: center; box-shadow: none; } 445 | .social-list a:before, .social-list a:after { transition: all 100ms linear; } 446 | .social-list .text { display: none; } 447 | .social-list a:before { font-family: "Ionicons"; font-weight: normal; font-style: normal; font-size: 18px; width: 40px; height: 40px; line-height: 40px; display: inline-block; text-align: center; border: solid 2px transparent; border-radius: 50%; } 448 | .social-list .facebook a { color: #a0bdc7; } 449 | .social-list .facebook a:hover, .social-list .facebook a:focus { color: #4c66a4; } 450 | .social-list .facebook a:before { content: ""; } 451 | .social-list .facebook a:hover:before, .social-list .facebook a:focus:before { border-color: #4c66a4; content: ""; } 452 | .social-list .twitter a { color: #a0bdc7; } 453 | .social-list .twitter a:hover, .social-list .twitter a:focus { color: dodgerblue; } 454 | .social-list .twitter a:before { content: ""; } 455 | .social-list .twitter a:hover:before, .social-list .twitter a:focus:before { border-color: dodgerblue; content: ""; } 456 | .social-list .googleplus a { color: #a0bdc7; } 457 | .social-list .googleplus a:hover, .social-list .googleplus a:focus { color: #f53; } 458 | .social-list .googleplus a:before { content: ""; } 459 | .social-list .googleplus a:hover:before, .social-list .googleplus a:focus:before { border-color: #f53; content: ""; } 460 | 461 | /* .center (et al) -- utility classes */ 462 | .center { text-align: center; } 463 | 464 | @media (min-width: 769px) { .spaced { margin-top: 4em; margin-bottom: 4em; } } 465 | 466 | @media (min-width: 769px) { .spaced-more { margin-top: 6em; margin-bottom: 6em; } } 467 | 468 | @media (min-width: 769px) { .spaced-less { margin-top: 2em; margin-bottom: 2em; } } 469 | 470 | @media (min-width: 920px) { .wide { width: 140%; margin-left: -25%; } } 471 | 472 | /* .top/.bottom -- margin helpers */ 473 | .top-collapse-0 { margin-top: 0; } 474 | 475 | .top-collapse-1 { margin-top: -1em; } 476 | 477 | .top-collapse-2 { margin-top: -2em; } 478 | 479 | .top-collapse-4 { margin-top: -4em; } 480 | 481 | .top-space-0 { margin-top: 0; } 482 | 483 | .top-space-1 { margin-top: 1em; } 484 | 485 | .top-space-2 { margin-top: 2em; } 486 | 487 | .top-space-4 { margin-top: 2em; } 488 | @media (min-width: 769px) { .top-space-4 { margin-top: 4em; } } 489 | 490 | .bottom-collapse-0 { margin-bottom: 0; } 491 | 492 | .bottom-collapse-1 { margin-bottom: -1em; } 493 | 494 | .bottom-collapse-2 { margin-bottom: -2em; } 495 | 496 | .bottom-collapse-4 { margin-bottom: -4em; } 497 | 498 | .bottom-space-0 { margin-bottom: 0; } 499 | 500 | .bottom-space-1 { margin-bottom: 1em; } 501 | 502 | .bottom-space-2 { margin-bottom: 2em; } 503 | 504 | .bottom-space-4 { margin-bottom: 2em; } 505 | @media (min-width: 769px) { .bottom-space-4 { margin-bottom: 4em; } } 506 | 507 | @keyframes blink { 0% { opacity: 0; } 508 | 100% { opacity: 1; } } 509 | @-webkit-keyframes blink { 0% { opacity: 0; } 510 | 100% { opacity: 1; } } 511 | /* Base carbon ads style */ 512 | /* Carbon ads .HeadlinePub div#carbonads span span.carbon-wrap a.carbon-img > img a.carbon-text {description} a.carbon-poweredby {powered by Carbon} */ 513 | .HeadlinePub .carbon-img, .HeadlinePub .carbon-text, .HeadlinePub .carbon-poweredby { text-decoration: none; } 514 | .HeadlinePub .carbon-text, .HeadlinePub .carbon-poweredby { padding-top: 4px; padding-bottom: 4px; } 515 | .HeadlinePub .carbon-img > img { width: 130px; height: 100px; box-shadow: 0 6px 8px rgba(102, 119, 136, 0.03), 0 1px 2px rgba(102, 119, 136, 0.3); border-radius: 3px; background: rgba(102, 119, 136, 0.2); color: transparent; } 516 | .HeadlinePub .carbon-img:hover img { transform: translate3d(0, -1px, 0); box-shadow: 0 6px 8px rgba(102, 119, 136, 0.03), 0 1px 2px rgba(102, 119, 136, 0.3), 0 8px 12px rgba(102, 119, 136, 0.1); } 517 | .HeadlinePub .carbon-text, .HeadlinePub .carbon-text:visited { color: #333; } 518 | .HeadlinePub .carbon-text::after { content: ' '; } 519 | .HeadlinePub .carbon-text:hover, .HeadlinePub .carbon-poweredby:hover { color: #333; } 520 | .HeadlinePub .carbon-poweredby, .HeadlinePub .carbon-poweredby:visited { display: block; margin-top: 8px; white-space: nowrap; color: #678; } 521 | .HeadlinePub { position: relative; display: block; margin-left: auto; margin-right: auto; } 522 | .HeadlinePub #carbonads ~ .placeholder { opacity: 0; transition: opacity 250ms linear; pointer-events: none; } 523 | .HeadlinePub > .placeholder { background-image: linear-gradient(92deg, rgba(102, 119, 136, 0.1), rgba(102, 119, 136, 0.17) 15%, rgba(102, 119, 136, 0.1) 30%); background-size: 450px 100%; animation: 2.5s ease-in-out infinite placeholder-swish; border-radius: 3px; position: absolute; display: block; } 524 | .HeadlinePub > .placeholder.-one { left: 0; top: 0; width: 130px; height: 100px; } 525 | .HeadlinePub > .placeholder.-two, .HeadlinePub > .placeholder.-three, .HeadlinePub > .placeholder.-four { left: 154px; top: 6px; height: 8px; width: 226px; } 526 | .HeadlinePub > .placeholder.-three { top: 28px; } 527 | .HeadlinePub > .placeholder.-four { top: 50px; width: 63.28px; } 528 | .HeadlinePub #carbonads { position: relative; z-index: 1; } 529 | .HeadlinePub, .HeadlinePub > div > span { display: block; width: 380px; height: 100px; text-align: left; } 530 | .HighlightPubFirstLine .HeadlinePub > div > span:first-line { font-weight: bold; } 531 | .HeadlinePub > div > span::after { content: ''; display: table; clear: both; zoom: 1; } 532 | .HeadlinePub .carbon-img { float: left; margin-right: 24px; } 533 | 534 | #carbonads { animation: 500ms ease-out pub-text-enter; } 535 | 536 | @keyframes placeholder-swish { 0% { background-position: -150px 0%; } 537 | 50% { background-position: 300px 0%; } 538 | 100% { background-position: 300px 0%; } } 539 | @keyframes pub-text-enter { 0% { opacity: 0; transform: scale(0.9); } 540 | 100% { opacity: 1; } } 541 | -------------------------------------------------------------------------------- /perl-pie.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | Perl-pie cheatsheet 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 104 | 108 | 109 | 122 | 143 | 144 | 145 | 146 | 147 | 148 | 183 | 184 | 185 |
186 | 202 | 203 | 204 | 205 | 206 | 207 | 208 | 209 |
210 |

About

211 | 212 |

Use perl to search and replace across many files.

213 | 214 |

Search and replace

215 | 216 |
perl -p -i -e 's/hello/hola/g' *.txt
217 | 
218 | 219 |

Back-referencing

220 | 221 |

Use \1 et al.

222 | 223 |
# '@include align-items(center);' => 'align-items: center;'
224 | perl -p -i -e "s/\@include (align-items)\((.*)\);/\1: \2;/g"
225 | 
226 | 227 |
228 |
229 | 230 | 231 | 232 | 233 | 234 |
235 |
236 |
237 | 238 | 239 | 0 Comments 240 | 241 | for this cheatsheet. 242 | Write yours! 243 | 244 |
245 |
246 |
247 |
248 |
249 |
250 |
251 | 252 |
253 | 254 | 255 |
256 |
257 | 280 |
281 |
282 | 283 | 284 | 285 | 286 | 413 | 414 | 429 | 430 | 431 | 432 | 433 | 434 | 435 | -------------------------------------------------------------------------------- /cidr.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | CIDR cheatsheet 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 104 | 108 | 109 | 122 | 143 | 144 | 145 | 146 | 147 | 148 | 183 | 184 | 185 |
186 | 202 | 203 | 204 | 205 | 206 | 207 | 208 | 209 |
210 |

CIDR ranges

211 | 212 | 213 | 214 | 215 | 216 | 217 | 218 | 219 | 220 | 221 | 222 | 223 | 224 | 225 | 226 | 227 | 228 | 229 | 230 | 231 | 232 | 233 | 234 | 235 | 236 | 237 | 238 | 239 | 240 | 241 | 242 |
RangeFirst IPLast IP
10.0.0.0/2410.0.0.010.0.0.255
10.0.0.0/1610.0.0.010.0.255.255
10.0.0.0/810.0.0.010.255.255.255
0.0.0.0/0(all)(all)
243 | 244 |

Resources

245 | 246 | 249 | 250 |
251 |
252 | 253 | 254 | 255 | 256 | 257 |
258 |
259 |
260 | 261 | 262 | 0 Comments 263 | 264 | for this cheatsheet. 265 | Write yours! 266 | 267 |
268 |
269 |
270 |
271 |
272 |
273 |
274 | 275 |
276 | 277 | 278 |
279 |
280 | 303 |
304 |
305 | 306 | 307 | 308 | 309 | 436 | 437 | 452 | 453 | 454 | 455 | 456 | 457 | 458 | --------------------------------------------------------------------------------