Skip to content

Instantly share code, notes, and snippets.

// Thanks to twitter.com/carmat71 for the edited version
// Mixins
@mixin transition($args...) {
-webkit-transition: $args;
-moz-transition: $args;
-o-transition: $args;
transition: $args;
}
@conormcafee
conormcafee / ScrollAnimate.js
Created February 4, 2015 14:41
Scroll & Animate.css - JS file to combing OnScroll & CSS Animations
// Code Based on this Tutorial - http://www.web2feel.com/tutorial-for-animated-scroll-loading-effects-with-animate-css-and-jquery/
// jQuery Viewport Checker
(function(e){e.fn.viewportChecker=function(t){var n={classToAdd:"visible",classToRemove:"invisible",offset:100,repeat:false,invertBottomOffset:true,callbackFunction:function(e,t){},scrollHorizontal:false};e.extend(n,t);var r=this,i={height:e(window).height(),width:e(window).width()},s=navigator.userAgent.toLowerCase().indexOf("webkit")!=-1?"body":"html";this.checkElements=function(){var t,o;if(!n.scrollHorizontal){t=e(s).scrollTop();o=t+i.height}else{t=e(s).scrollLeft();o=t+i.width}r.each(function(){var r=e(this),i={},s={};if(r.data("vp-add-class"))s.classToAdd=r.data("vp-add-class");if(r.data("vp-remove-class"))s.classToRemove=r.data("vp-remove-class");if(r.data("vp-offset"))s.offset=r.data("vp-offset");if(r.data("vp-repeat"))s.repeat=r.data("vp-repeat");if(r.data("vp-scrollHorizontal"))s.scrollHorizontal=r.data("vp-scrollHorizontal");if(r.data("vp-i
@conormcafee
conormcafee / Input Mixin
Created February 24, 2015 10:14
Quickly Style Inputs
@mixin input($radius, $text-color, $border-color) {
border-radius: $radius;
box-shadow: 0;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
color: $text-color;
border: 1px solid $border-color;
&:focus {
@conormcafee
conormcafee / CSS Baseline
Created May 25, 2015 13:42
CSS Baseline
body:after {
background: repeating-linear-gradient(
0deg,
rgba(255,255,255,0.05),
rgba(255,255,255,0.05) 24px,
rgba(0,0,0,0.1) 24px,
rgba(0,0,0,0.1) 48px
);
position: absolute;
top: 0;
@conormcafee
conormcafee / colour-management
Created July 6, 2015 13:56
Colour Management
$accent: #ffffff;
// Brand Colour Palette
$brand-colours: (
accent: (
base: $accent,
lighter: lighten($accent, 20%),
light: lighten($accent, 10%),
dark: darken($accent, 10%),
darker: darken($accent, 20%)
@conormcafee
conormcafee / nav
Last active August 29, 2015 14:24
Simple Hidden Nav
function toggleGetNav(id)
{
var e = document.getElementsByTagName(id)[0];
e.style.display = getComputedStyle(e, null).display === 'none' ? 'block' : 'none';
}
$map-name: (
selector: value
);
@each $selector, $value in $map-name {
.foo-#{$value}{
bar: 0;
}
}
@conormcafee
conormcafee / script.js
Last active September 18, 2015 08:23
Apollo Add/Remove
btn.addEventListener('click', function (e) {
apollo.toggleClass(divTest, 'is-hidden is-visible');
}, false);
document.getElementById('btn').addEventListener('click', function (e) {
apollo.toggleClass(document.getElementById('divTest'), 'is-hidden is-visible');
}, false);
// Class Name Multiple
@conormcafee
conormcafee / content.json
Last active September 8, 2015 11:05
JSON
{
"01": {
"title": "Title",
"content" : [
{
"subTitle": "Super Category"
}
]
}
@conormcafee
conormcafee / SassMeister-input.scss
Created September 25, 2015 16:02
Generated by SassMeister.com.
// ----
// libsass (v3.2.5)
// ----
$max-width: 1100px;
$margin: 15px;
$margin-p: percentage(15px / 1100px);
$grid: (
one-col: 1100px - $margin,