Skip to content

Instantly share code, notes, and snippets.

View adyz's full-sized avatar
🔥
On fire

Adrian Florescu adyz

🔥
On fire
View GitHub Profile
@JohnAlbin
JohnAlbin / _init.scss
Last active December 26, 2015 18:09
Handing IE8 and lower with Breakpoint + compass/support
// Initialize the Sass variables and partials used in this project.
// Set the legacy IE support variables. We override the default values set by
// the compass/support partial, but let styles-ie8.scss override these values.
$legacy-support-for-ie6 : false !default;
$legacy-support-for-ie7 : false !default; // Note the use of !default.
$legacy-support-for-ie8 : false !default;
// Partials to be shared with all .scss files.
@jintoppy
jintoppy / GlobalAjaxInterceptor
Last active September 13, 2016 12:40
A global ajax interceptor for Angular application, where it cancels all the previous state's ajax + http requests on state change. I am cancelling ajax requests also because some applications might still have some jquery utilities which does ajax requests.
angular.module('globalmodule')
.config(['$provide', '$httpProvider', function($provide, $httpProvider){
$provide.factory('GlobalAjaxInterceptor', ['$q', '$rootScope', function($q, $rootScope){
var currentRequests={http: {}, ajax: {}};
function addHttpRequest(conf){
currentRequests.http[conf.url] = conf.promiseObj;
}
@adyz
adyz / retina-simple-sprite-compass
Last active September 12, 2018 08:02
Retina Sprite CSS with Compass
// 1: To export the PNGs in different sizes I used Slicy - http://macrabbit.com/slicy/ - a mac app that looks into your PSD and if it finds any layer with .png extention will export that layer to PNG. You can also add a tag to the main group layer to export retina version too. A bit pricy, but it's fine if you value your time.
// 2: I added the icons in two folders (retina and normal) You just have to make sure that both folders contain the same number of files and they both have the same file name inside.
// 3: I added this code after long time of searchin, testing, and mashing my head into the wall.
$naviconsNormal: sprite-map("navicons/normal/*.png", $spacing: 10px);
// Adds a lovely fade in of the modal
// and a gentle slide-down of the modal content
class Demo extends React.Component {
state = { showDialog: false };
render() {
return (
<div>
<button onClick={() => this.setState({ showDialog: true })}>
Show Dialog
</button>
@thulstrup
thulstrup / compass-retina-sprites.scss
Created March 20, 2012 19:18
Using Compass to generate normal and retina sprite maps
$sprites: sprite-map("sprites/*.png");
$sprites-retina: sprite-map("sprites-retina/*.png");
@mixin sprite-background($name) {
background-image: sprite-url($sprites);
background-position: sprite-position($sprites, $name);
background-repeat: no-repeat;
display: block;
height: image-height(sprite-file($sprites, $name));
width: image-width(sprite-file($sprites, $name));
@ksrb
ksrb / index.ejs
Last active March 10, 2021 05:58
jquery.inputmask webpack configuration and package.json
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title><%= htmlWebpackPlugin.options.title %></title>
</head>
<body>
<input id="float"/>
</body>
</html>
@bendc
bendc / simulate-typing.js
Created September 1, 2017 08:57
Fake typing animation
const trackTime = timing => {
const now = performance.now();
if (!timing.startTime) timing.startTime = now;
const elapsed = now - timing.startTime;
const {duration} = timing;
if (duration != null && duration <= elapsed) timing.startTime = null;
return elapsed;
};
const delay = (callback, duration) => {
@kitze
kitze / store.js
Created January 24, 2018 13:14
simplified redux
import produce from 'immer';
import {createStore} from 'redux';
const handleActions = (actionsMap, defaultState) => (
state = defaultState,
{type, payload}
) =>
produce(state, draft => {
const action = actionsMap[type];
action && action(draft, payload);

React && Firebase Workshop

Contact Information

Prequisite Setup

  • A recent version of Node.js
  • npm install -g create-react-app

PreloadableWorker

There's no way to <link rel=preload> a Web Worker. This fixes that.

npm i -S gist:developit/567dde2346d785b2628224fddbf6783c

<!-- workers are now just a normal script preload: -->
<link rel=preload href=/path/to/worker.js as=script crossorigin>