| <div class="root en"> | |
| <ul class="links"> | |
| <li class="link"> | |
| <a class="link-home"><i class="icon">tag</i>HOME</a> | |
| </li> | |
| <li class="link"> | |
| <a class="link-about"><i class="icon">tag</i>ABOUT</a> | |
| </li> | |
| </ul> |
| .Absolute-Center { | |
| margin: auto; | |
| position: absolute; | |
| top: 0; left: 0; bottom: 0; right: 0; | |
| } | |
| /****************************************/ | |
| .Absolute-Center { | |
| width: 50%; |
| .boxshadow { | |
| -moz-box-shadow: 3px 3px 10px #333; | |
| -webkit-box-shadow: 3px 3px 10px #333; | |
| box-shadow: 3px 3px 10px #333; | |
| /* For IE 8 */ | |
| -ms-filter: "progid:DXImageTransform. | |
| Microsoft.Shadow(Strength=4, Direction=135, | |
| Color='#333333')"; | |
| /* For IE 5.5 - 7 */ | |
| filter: progid:DXImageTransform.Microsoft. |
| @font-face { | |
| font-family: 'Colaborate Light'; | |
| src: url('ColabLig.eot'); | |
| src: local('☺'), url('ColabLig.woff') format('woff'), | |
| url('ColabLig.ttf') format('truetype'); | |
| font-weight:normal; | |
| font-style:normal; | |
| font-variant:normal; | |
| } |
| 1. http://css3please.com/ *************** CSS3 Tools *************** | |
| 2. http://www.netmagazine.com/features/top-10-css3-techniques *************** Top 10 CSS3 Techniques *************** | |
| 3. http://html5please.com/ *************** Look up HTML5, CSS3, etc features, know if they are ready for use *************** | |
| 4. http://cssdeck.com/ *************** For inspiration *************** | |
| 5. http://perishablepress.com/margin-list-floated-image/ *************** Force Margin/Space Between List and Floated Image *************** | |
| 6. http://blog.n1dev.ru/demo/CreativeLinkEffects/ *************** Beatiful hover links *************** | |
| 7. http://demosthenes.info/blog/718/Rotating-Elements-With-Page-Scroll-In-JQuery *************** Rotating Elements With Page Scroll In JQuery *************** | |
| 8. http://www.createcss3.com/ *************** CSS3 Generator *************** | |
| 9. http://nthmaster.com/ *************** Nth child selector *************** | |
| 10. http://frontender.info/a-guide-to-flexbox/ *************** All about Flexbox ******* |
| // ---- | |
| // Sass (v3.3.0.rc.1) | |
| // Compass (v0.13.alpha.7) | |
| // ---- | |
| =e($name) | |
| @at-root #{&}__#{$name} | |
| @content | |
| =m($name) | |
| @at-root #{&}--#{$name} |
| (function() { | |
| 'use strict'; | |
| angular.module('simple-virtual-repeater', []) | |
| .directive('virtualRepeater', virtualRepeater); | |
| virtualRepeater.$inject = ['$compile', '$timeout']; | |
| function virtualRepeater($compile, $timeout) { | |
| var directive = { | |
| restrict: 'EA', | |
| replace: 'true', |
| import { Component, PropTypes } from 'react' | |
| import { noop } from 'lodash' | |
| import raf from 'raf' | |
| const cache = new Map() | |
| export function createNonBlockingRenderLoop({ key, concurrencyLevel = 1 }) { | |
| if (cache.has(key)) { | |
| return cache.get(key) | |
| } |
The gist: by having a Promise adopt the state of a forever pending one, you can suspend its then handlers chain.
const foreverPending = new Promise(function() {});
let cancel
new Promise(function(fulfill, reject) {
cancel = function() {fulfill(foreverPending)}
setTimeout(fulfill, 1000, 5)
| const fetchUserEpic = action$ => | |
| action$.ofType(FETCH_USER) | |
| .mergeMap(action => { | |
| var date = Date.now(); | |
| console.log(date) | |
| return fakeAjax(`/api/users/${action.payload}`) | |
| .map(response => fetchUserFulfilled(response)) | |
| .takeUntil( | |
| action$. | |
| ofType(FETCH_USER_CANCELLED) |