Skip to content

Instantly share code, notes, and snippets.

View magsout's full-sized avatar
🦊
Coding and hacking around the world

Guillaume Démésy magsout

🦊
Coding and hacking around the world
View GitHub Profile
@cedricdelpoux
cedricdelpoux / GoogleMap.js
Created August 9, 2016 15:21
React Google Map
import React, {Component, PropTypes} from "react"
import placesLoader from "./placesLoader"
import placesShape from "./placesShape"
import styles from "./GoogleMap.css"
import iconMarker from "./iconMarker.png"
import iconTrash from "./iconTrash.png"
const {arrayOf, func, number, shape, string} = PropTypes
@madx
madx / 00_README.md
Last active December 16, 2020 08:32
A simpler alternative to the Flux/Redux pattern http://drop.madx.me/1cldht84o9e5r79j4g1jwtl6niph9pp.gif

This is my proposal for a simpler implementation of the Flux pattern (well, like Redux, it is not exactly Flux)

(The name has nothing to do with ego, it's a joke from @Uhsac :))

@brandondurham
brandondurham / styles.less
Last active June 24, 2024 14:48
Using Operator Mono in Atom
/**
* Using Operator Mono in Atom
*
* 1. Open up Atom Preferences.
* 2. Click the “Open Config Folder” button.
* 3. In the new window’s tree view on the left you should see a file called “styles.less”. Open that up.
* 4. Copy and paste the CSS below into that file. As long as you have Operator Mono SSm installed you should be golden!
* 5. Tweak away.
*
* Theme from the screenshot (http://cdn.typography.com/assets/images/blog/operator_ide2.png):
@Victa
Victa / gist:2cae3732654894a60d36
Created December 10, 2014 20:32
Percentage Bugs in WebKit

No later than a few days ago, at Octave & Octave, I had to make a grid generator in Sass which is fully responsive. Rather than using a fixed grid as I usually do, I decided to create a fluid grid using percentages (calculated with the famous target / context * 100 = result).

Indeed, after finishing the book Response Web Design from A Book Apart where the author proposes to use this type of grid, I must say I was convinced by this flexibility. And I think that I am not alone. Just look at the number of frameworks using this kind of grid (Foundation, Tiny Fluid Grid, Fluid960gs…)

After some hours of development to obtain optimal results based on the guidelines of my agency, I was surprised to notice a very annoying display bug on my Safari.

@addyosmani
addyosmani / README.md
Last active October 17, 2024 13:41 — forked from 140bytes/LICENSE.txt
108 byte CSS Layout Debugger

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

@marcgg
marcgg / gist:2e57218351e27fcc20c4
Last active April 7, 2018 19:25
Mapping of country codes with international phone number prefixes, in JSON!
{
"AF": "93",
"AL": "355",
"DZ": "213",
"AD": "376",
"AO": "244",
"AQ": "672",
"AR": "54",
"AM": "374",
"AW": "297",
@MoOx
MoOx / README.md
Last active June 25, 2024 06:17
frontend project Readme example

PROJECT BLAH BLAH

Requirements

For development, you will only need Node.js installed on your environement. And please use the appropriate Editorconfig plugin for your Editor (not mandatory).

Node

Node is really easy to install & now include NPM.

@MoOx
MoOx / _input.css
Last active March 28, 2016 07:32
myth 1.1.1 vs cssnext 0.3.1
a { font-size: calc(calc(calc(1rem * 0.75) * 1.5) - 1px); }
a { color: color(rebeccapurple a(-10%)); }
a { color: hwb(0, 10%, 20%); }
a { color: color(color(red a(+10%)));}
a { color: color(color(rebeccapurple a(-10%)) a(-10%)); }
@hdragomir
hdragomir / sm-annotated.html
Last active October 9, 2024 00:35
The deferred font loading logic for Smashing Magazine. http://www.smashingmagazine.com/
<script type="text/javascript">
(function () {
"use strict";
// once cached, the css file is stored on the client forever unless
// the URL below is changed. Any change will invalidate the cache
var css_href = './index_files/web-fonts.css';
// a simple event handler wrapper
function on(el, ev, callback) {
if (el.addEventListener) {
el.addEventListener(ev, callback, false);