Nitesh Khatri khatrinitesh

git cheat-sheet

The git command-line utility has plenty of inconsistencies http://steveko.wordpress.com/2012/02/24/10-things-i-hate-about-git/

A GUI like http://sourcetreeapp.com is often helpful, but staying on the command line usually quicker. This is a list of the commands I use most frequently, listed by functional category:

Current state

git status list which (unstaged) files have changed

Sass Architecture Structure

sass/
|
|– base/
|   |– _reset.scss       # Reset/normalize
|   |– _typography.scss  # Typography rules
|   ...                  # Etc…
|

Animate on scroll with wow.js

Reveal Animations When You Scroll

Forked from sayed rafeeq's Pen Animate on scroll with wow.js.

A Pen by Captain Anonymous on CodePen.

License.

Vanilla JavaScript Quick Reference / Cheatsheet

Just migrated it from Codepen.io to markdown. Credit goes to David Conner.

Working with DOM	Working with JS	Working With Functions
Accessing Dom Elements	Add/Remove Array Item	Add Default Arguments to Function
Grab Children/Parent Node(s)	Add/Remove Object Properties	Throttle/Debounce Functions
Create DOM Elements	Conditionals

	[
	{name: 'Afghanistan', code: 'AF'},
	{name: 'Åland Islands', code: 'AX'},
	{name: 'Albania', code: 'AL'},
	{name: 'Algeria', code: 'DZ'},
	{name: 'American Samoa', code: 'AS'},
	{name: 'AndorrA', code: 'AD'},
	{name: 'Angola', code: 'AO'},
	{name: 'Anguilla', code: 'AI'},
	{name: 'Antarctica', code: 'AQ'},

	// Mixins and examples

	/* Responsive Breakpoints
	========================================================================== */
	@mixin breakpoint($point) {
	@if $point == large {
	@media (min-width: 64.375em) { @content; }
	}
	@else if $point == medium {
	@media (min-width: 50em) { @content; }

	/*
	The div that holds all the lines
	*/
	.pac-container {
	color: #d9d9d9;
	}

	/*
	class for each line of the result
	*/

	// ----
	// Sass (v3.3.0.rc.2)
	// Compass (v1.0.0.alpha.17)
	// ----

	@mixin buttonstyle {
	background: red;
	border: 1px solid black;
	color: #fff;
	}

	/*
	Based on:
	1. http://stephen.io/mediaqueries
	2. https://css-tricks.com/snippets/css/media-queries-for-standard-devices/
	*/

	/* iPhone X in portrait & landscape */
	@media only screen
	and (min-device-width : 375px)
	and (max-device-width : 812px)

	<div id="content-carousel" class="content-carousel-widget" data-carousel="swiper">
	<!--
	You can use: data-items="5" for total items display in single page
	data-autoplay="true" or "false" for autoplay.
	data-loop="true" or "false" for looping the carousel
	data-effect="fade" or "cube" for slide changing effects
	data-direction="horizontal" or "vertical" for sliding direction
	data-initlal="3" for for first active slide
	data-center="true" or "false" for centerize slider
	-->