Skip to content

Instantly share code, notes, and snippets.

View fiinix's full-sized avatar

Carlos Eriksson fiinix

View GitHub Profile
@fiinix
fiinix / gist:5190975
Created March 18, 2013 21:27
HTML: Basic Document
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Page Title</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="css/default.css?v=0.1" type="text/css" media="screen" />
@fiinix
fiinix / CSS New
Created June 12, 2013 20:13
CSS New Section
/*
======================= */
@fiinix
fiinix / SassMeister-input.scss
Created August 1, 2014 08:03
Generated by SassMeister.com.
// ----
// Sass (v3.3.12)
// Compass (v1.0.0.alpha.21)
// ----
// Silent placeholder, doesn't behave as expected, or I'm being daft.
%animated-shake {
@at-root {
@keyframes shake {
0%, 100% {
@fiinix
fiinix / SassMeister-input.scss
Created August 1, 2014 10:32
Generated by SassMeister.com.
// ----
// Sass (v3.3.12)
// Compass (v1.0.0.alpha.21)
// ----
// Silent placeholder, doesn't behave as expected, or I'm being daft.
%animated-shake {
@at-root {
@keyframes shake {
0%, 100% {
@fiinix
fiinix / core.js
Last active January 3, 2016 20:35
Take jQuery and ruin it. An attempt to create a small subset of jQuery's functionality that removes the jQuery dependency. Goal: Element selector, addClass, removeClass, toggleClass, click.eventListener https://docs.google.com/document/d/1LPaPA30bLUB_publLIMF0RlhdnPx_ePXm7oW02iiT6o/preview
// Put in <head>
if ( 'querySelector' in document && 'addEventListener' in window ) {
document.documentElement.className += 'js';
}
// Does it dijon?
if ( 'querySelector' in document && 'addEventListener' in window && 'classList' in document.createElement('_') ) {
//Map $ to querySelector
function $(target){
@fiinix
fiinix / map-toggler
Created September 18, 2014 13:40
Create a "toggle to activate" Google map using a overlaid ::pseudo element.
/*
* ===========================================================================
*
* Maps
*
* ===========================================================================
*
*/
.map {
@fiinix
fiinix / jQizzle
Created November 19, 2014 09:28
jQizzle fo shizzle (I'm not cool)
$(function() {
// Traverse DOM and create variables
var html = $('html'),
viewport = $(window),
viewportWidth = viewport.width(),
header = $('.js-header'),
panelBG = $('.js-panel-bg'),
panelBox = $('.js-panel'),
@fiinix
fiinix / rColor
Created November 26, 2014 15:41
Return random colour using the HSLa colour model.
/* Random colour using the HSLa color model */
@function rColor() {
$return: hsla(random(365), 90, 50, 0.2);
@return $return;
}
@fiinix
fiinix / Gridify (Sass)
Created March 11, 2015 11:20
Quick, dirty and minimal CSS Grid Generator
/* Column placeholder */
%column {
display: inline-block;
vertical-align: top;
}
$column-count: 12;
@fiinix
fiinix / _basil.scss
Created May 27, 2015 08:03
Super minimal and hardware accelerated `waypoint` library
/**
* Basil by @fiinixdesign
*
* Super minimal and hardware accelerated waypoint library
*
* @waypoints, @jquery, @basil, @plugin
*
* TODO: Clean up and simplify where possible. Make delay options into
* fractions based of duration settings.
*/