Skip to content

Instantly share code, notes, and snippets.

Avatar

Danilo Araújo Silva Danilo-Araujo-Silva

View GitHub Profile
View Workaround to declare a local variable and a local function in a Sass file
// This certainly is not the best way to do this.
// But I couldn't find an approach using the Sass elements for now. If you have a better approach please let me know.
// convention to a local variable
$_local: (
// some stuff here
);
// if we need to add new entries that depends of the other ones we can do this:
$_local: map-merge(
View Workaround to declare a local variable in a Sass file
// This certainly is not the best way to do this.
// But I couldn't find an approach using the Sass elements for now. If you have a better approach please let me know.
// convention to a local variable
$_local: (
// some stuff here
);
// if we need to add new entries that depends of the other ones we can do this:
$_local: map-merge(
View Sass Editable Google Material Design Colors Palette
/// Content of _map-dee-get.scss
/// https://css-tricks.com/snippets/sass/deep-getset-maps/
/// Map deep get
/// @author Hugo Giraudel
/// @access public
/// @param {Map} $map - Map
/// @param {Arglist} $keys - Key chain
/// @return {*} - Desired value
@function map-deep-get($map, $keys...) {
@each $key in $keys {
View Sass Google Material Design Colors Palette Minified Map
$palette: (colors: (special: (black: #000000, black-87-opacity: rgba(0, 0, 0, 0.87), white: #ffffff, white-87-opacity: rgba(255, 255, 255, 0.87)), red: (50: #ffebee, 100: #ffcdd2, 200: #ef9a9a, 300: #e57373, 400: #ef5350, 500: #f44336, 600: #e53935, 700: #d32f2f, 800: #c62828, 900: #b71c1c, A100: #ff8a80, A200: #ff5252, A400: #ff1744, A700: #d50000, contrast: (50: rgba(0, 0, 0, 0.87), 100: rgba(0, 0, 0, 0.87), 200: rgba(0, 0, 0, 0.87), 300: rgba(0, 0, 0, 0.87), 400: rgba(0, 0, 0, 0.87), 500: #ffffff, 600: #ffffff, 700: #ffffff, 800: rgba(255, 255, 255, 0.87), 900: rgba(255, 255, 255, 0.87), A100: rgba(0, 0, 0, 0.87), A200: #ffffff, A400: #ffffff, A700: #ffffff)), pink: (50: #fce4ec, 100: #f8bbd0, 200: #f48fb1, 300: #f06292, 400: #ec407a, 500: #e91e63, 600: #d81b60, 700: #c2185b, 800: #ad1457, 900: #880e4f, A100: #ff80ab, A200: #ff4081, A400: #f50057, A700: #c51162, contrast: (50: rgba(0, 0, 0, 0.87), 100: rgba(0, 0, 0, 0.87), 200: rgba(0, 0, 0, 0.87), 300: rgba(0, 0, 0, 0.87), 400: rgba(0, 0, 0, 0.87), 500: #
View Sass map-deep-set
/// https://css-tricks.com/snippets/sass/deep-getset-maps/
/// Deep set function to set a value in nested maps
/// @author Hugo Giraudel
/// @access public
/// @param {Map} $map - Map
/// @param {List} $keys - Key chaine
/// @param {*} $value - Value to assign
/// @return {Map}
@function map-deep-set($map, $keys, $value) {
$maps: ($map,);
View Sass map-deep-get
/// https://css-tricks.com/snippets/sass/deep-getset-maps/
/// Map deep get
/// @author Hugo Giraudel
/// @access public
/// @param {Map} $map - Map
/// @param {Arglist} $keys - Key chain
/// @return {*} - Desired value
@function map-deep-get($map, $keys...) {
@each $key in $keys {
$map: map-get($map, $key);
View Sass jquery-like extend
/// jQuery-style extend function
/// About `map-merge()`:
/// * only takes 2 arguments
/// * is not recursive
/// @param {Map} $object - first map
/// @param {ArgList} $objects - other maps
/// @param {Bool} $deep - recursive mode
/// @return {Map}
@function extend($object, $objects.../*, $deep */) {
$last: nth($objects, -1);
@Danilo-Araujo-Silva
Danilo-Araujo-Silva / commands.txt
Last active Mar 20, 2017
Install Latest Ruby, Rails and Update All Gems
View commands.txt
# Official rvm documentation: https://rvm.io/
gpg --keyserver hkp://keys.gnupg.net --recv-keys 409B6B1796C275462A1703113804BB82D39DC0E3
\curl -sSL https://get.rvm.io | bash
rvm install ruby --latest
gem install rails
@Danilo-Araujo-Silva
Danilo-Araujo-Silva / commands.txt
Last active Mar 20, 2017
Install Latest NPM and NodeJS and Update All Global NPM packages
View commands.txt
# Official documentation: https://nodejs.org/en/download/package-manager/
# First install npm using the link above (if you don't have it yet). Then:
# sudo is needed for some OSes, if it is not required on yours then you can remove it from the commands.
sudo npm install npm@latest -g
#Important! The option -f is used to force clean the npm cache. Take care about it. Anyway, I usually do this when I would like to install the latest NodeJS.
sudo npm cache clean -f
sudo npm install -g n
sudo n stable
@Danilo-Araujo-Silva
Danilo-Araujo-Silva / class-utils.js
Last active Dec 24, 2017
hasClass, addClass, removeClass, toggleClass implementation in ES6
View class-utils.js
/**
*
* @param classNames
* @param className
* @returns {boolean}
*/
export function hasClass(classNames, className) {
return new RegExp(` ${className} `).test(` ${classNames} `)
}