Skip to content

Instantly share code, notes, and snippets.

View Fischaela's full-sized avatar
⬇️
🔥 fire bad, 🌳 tree pretty

Michaela Fischaela

⬇️
🔥 fire bad, 🌳 tree pretty
View GitHub Profile
  • Do you use source control?

  • Do you use linting?

  • Do you write tests?

  • Do you have a bug database?

  • Do you fix bugs before writing new code?

  • Do you have a spec?

  • Do you have testers?

$color-black: #343434;
$color-gray-dark: #4A4A4A;
$color-gray-light: #F0F0F0;
$color-white: #FFFFFF;
$color-main: #FF0C80;
$color-gulf-stream: #68B09A;
$color-ming: #355C7D;
$color-smoky: #6C5B7B;
@Fischaela
Fischaela / animate-display-none.scss
Last active March 1, 2016 22:03
Snippet for animating display: none, display: block elements
@keyframes grow {
0% {
display: none;
opacity: 0;
}
1% {
display: block;
opacity: 0;
transform: scale(0);
}
@Fischaela
Fischaela / social-sharer.html
Created February 22, 2016 10:49
List of Social Sharing Links
<a href="http://www.facebook.com/sharer.php?u=[post-url]"></a>
<a href="https://twitter.com/share?url=[post-url]&text=[post-title]&via=[via]&hashtags=[hashtags]"></a>
<a href="https://plus.google.com/share?url=[post-url]"></a>
<a href="https://pinterest.com/pin/create/bookmarklet/?media=[post-img]&url=[post-url]&is_video=[is_video]&description=[post-title]"></a>
<a href="http://www.linkedin.com/shareArticle?url=[post-url]&title=[post-title]"></a>
<a href="http://bufferapp.com/add?text=[post-title]&url=[post-url]"></a>
<a href="http://digg.com/submit?url=[post-url]&title=[post-title]"></a>
<a href="http://www.tumblr.com/share/link?url=[post-url]&name=[post-title]&description=[post-desc]"></a>
<a href="http://reddit.com/submit?url=[post-url]&title=[post-title]"></a>
<a href="http://www.stumbleupon.com/submit?url=[post-url]&title=[post-title]"></a>
@Fischaela
Fischaela / _responsive-typography.scss
Created February 18, 2016 13:25
Responsive Typography With Golden Ratio Scale
// Ratio and base variables
$ratio: 1.2;
$base: 0.875;
$base-em: $base * 1em;
$base-px: $base * 16px;
// Scale step variables
// Type scaling after http://type-scale.com/ with golden ratio
$ms0: 1;
$ms1: $ratio; /* 1.2 */
@Fischaela
Fischaela / _mixin-box-shadow.scss
Created November 3, 2015 15:39
SASS Mixin for Material Design Box-Shadows
@mixin box-shadow($level: 1) {
@if $level == 1 {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
} @else if $level == 2 {
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
} @else if $level == 3 {
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
} @else if $level == 4 {
box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
} @else if $level == 5 {
@Fischaela
Fischaela / .eslintrc
Created August 1, 2015 09:15
eslint configuration file
{
"env": {
"browser": true,
"node": true
},
"rules": {
/**
* Strict mode
*/
// http://eslint.org/docs/rules/strict
// Ported from Stefan Gustavson's java implementation
// http://staffwww.itn.liu.se/~stegu/simplexnoise/simplexnoise.pdf
// Read Stefan's excellent paper for details on how this code works.
//
// Sean McCullough banksean@gmail.com
/**
* You can pass in a random number generator object if you like.
* It is assumed to have a random() method.
*/
@Fischaela
Fischaela / webgl_threejs_worldtoscreenprojector.js
Created February 17, 2015 16:32
Converts an 3d object to screen coordinats
function worldToScreenProjector( object, camera ) {
var vector = new THREE.Vector3(),
width = 0.5 * renderer.context.canvas.width,
height = 0.5 * renderer.context.canvas.height;
object.updateMatrixWorld();
vector.setFromMatrixPosition( object.matrixWorld );
vector.project( camera );
@Fischaela
Fischaela / jshint_helper
Created January 8, 2015 19:29
JS Hint Helper
// jshint ignore:line