| /** | |
| * Modified Carpet | |
| */ | |
| background: | |
| radial-gradient(0% 0%, rgba(150, 150, 150, 0) 9px, #CCD3DD 10px, rgba(150, 150, 150, 1) 11px, transparent), | |
| radial-gradient(100% 100%, rgba(150, 150, 150, 0) 9px, #CCD3DD 10px, rgba(20, 0, 150, 1) 11px, transparent), | |
| radial-gradient(0% 100%, rgba(150, 150, 150, 0) 9px, #BEC4CE 10px, rgba(150, 150, 150, 0) 11px, transparent), | |
| #EBEEF4; | |
| /** | |
| * Typing animation with pure CSS. | |
| * Works best in browsers supporting the ch unit. | |
| */ | |
| @keyframes typing { from { width: 0; } } | |
| @keyframes blink-caret { 50% { border-color: transparent; } } | |
| h1 { | |
| font: bold 200% Consolas, Monaco, monospace; |
| /** | |
| * Inner border-radius example | |
| */ | |
| body, div { border: 1px solid; } | |
| body { width: 100px; border-radius: 20px; } | |
| div { margin: 10px; padding: 10px; } |
| /** | |
| * Transition to height:auto on replaced elements | |
| * CSS brain teaser: If transitions to/from height:auto don’t work, why is the height transitioning here? | |
| And why is it not transitioning when it shrinks but only when it grows? | |
| */ | |
| img { | |
| width: 0; height: 0; | |
| transition: 1s linear; | |
| javascript:(function(){window.addEventListener('beforeunload',function(){return"Whoa bro, you tried to close me. \n Did you mean to do that?"})})(); |
Promises are a software abstraction that makes working with asynchronous operations much more pleasant. In the most basic definition, your code will move from continuation-passing style:
getTweetsFor("domenic", function (err, results) {
// the rest of your code goes here.
});
| <img src="http://placekitten.com/200/300" title="placekitten"> |
| /* No flexbox here */ | |
| .wrapper { | |
| background: linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.4)); | |
| overflow: hidden; | |
| margin: 0 0 1em; | |
| border-radius: 1em; | |
| } | |
| .pane { |
| /** | |
| * box-shadow vs filter: drop-shadow 2 | |
| */ | |
| body { | |
| background: #ddd; | |
| font: 16px/1 sans-serif; | |
| margin: 50px; | |
| } |
| // Apply any css property/value pair. | |
| @mixin css( | |
| $azimuth: null, | |
| $background: null, | |
| $background-attachment: null, | |
| $background-color: null, | |
| $background-image: null, | |
| $background-position: null, | |
| $background-repeat: null, | |
| $border: null, |