Skip to content

Instantly share code, notes, and snippets.

View Razenbull's full-sized avatar

Chris Wetz Razenbull

View GitHub Profile
@Razenbull
Razenbull / get_array.js
Created September 16, 2015 09:31
get an array from a collection
var thumbs = document.getElementsByClassName('thumb');
Object.keys(thumbs).map(
function (key) {
return thumbs[key]
}
);
@Razenbull
Razenbull / slide-searchbar.scss
Last active August 31, 2015 15:51
slide right input
.form-searchbar {
.searchbar-hidden,
label {
@include transition-duration($transition-duration);
@include transition-timing-function($transition-timing-function);
}
.searchbar-hidden {
@include transition-property(width);
@include transition-delay($transition-delay);
@Razenbull
Razenbull / retina-images.scss
Created August 31, 2015 10:06
helper mixin to display responsive images
// helper mixin to display retina images
//
// @param {List *required} nth($display, 1) - display
// @param {List *optional} nth($display, 2) - width
//
// image-1x is display and hide on high resolution screens
// image-2x is hide and display on high resolution screens
//
// @use @include image-retina(inline, 60px);
@mixin image-retina($display...) {
@Razenbull
Razenbull / _sticky_header.scss
Last active August 29, 2015 14:27
sticky header with animation
$transition-duration: .3s !default;
$transition-timing-function: ease !default;
$sticky-limit: 80px;
.sticky {
@include transition-duration($transition-duration);
@include transition-property(top);
@include transition-timing-function($transition-timing-function);
position: fixed;
top: -$sticky-limit;
@Razenbull
Razenbull / remove-spaces.scss
Last active August 29, 2015 14:27
helper classes to remove padding or margin
// ----
// libsass (v3.2.5)
// ----
/**
*
* helper classes
* @use to remove padding or margin
*
* .no-padding, no-margin
@Razenbull
Razenbull / vertical-align.scss
Last active August 29, 2015 14:27
Mixin to align vertically an element relative to its first positioned parent
/**
*
* Mixin to align vertically an element relative to its first positioned parent
*
* @params $position-type
* @params $align
*
* @use @include vertical-align;
* or @include vertical-align($position-type: absolute, $align: bottom);
* to override defaults
@Razenbull
Razenbull / make-block-full.scss
Created August 12, 2015 12:14
Mixin to make an element take the full width and height relative to its first positioned parent
/**
*
* Mixin to make an element take the full width and height relative to its first positioned parent
*
* @params none
*
* @use @include make-block-full;
*
*/
@mixin make-block-full() {
@Razenbull
Razenbull / avoid_console.js
Created August 11, 2015 14:23
avoid console{} when object doesn't exist => html5-boilerplate plugin
// Avoid `console` errors in browsers that lack a console.
(function() {
var method;
var noop = function () {};
var methods = [
'assert', 'clear', 'count', 'debug', 'dir', 'dirxml', 'error',
'exception', 'group', 'groupCollapsed', 'groupEnd', 'info', 'log',
'markTimeline', 'profile', 'profileEnd', 'table', 'time', 'timeEnd',
'timeline', 'timelineEnd', 'timeStamp', 'trace', 'warn'
];
@Razenbull
Razenbull / google_place_autocomplete.js
Last active May 9, 2024 13:42
google place autocomplete && select first option on enter if !$(".pac-item-selected")
var $addressInput = $('#locationAddressInput');
var setKeyDownListener = selectFirstOptionOnEnter($addressInput[0]);
window.autocomplete = new google.maps.places.Autocomplete($addressInput[0], {
type: ['geocode'],
componentRestrictions: {country: 'be'}
});
google.maps.event.addListener(window.autocomplete, 'place_changed', function () {
var address = window.autocomplete.getPlace();
@Razenbull
Razenbull / counter.js
Last active August 29, 2015 14:25
counter
function counter() {
var count = 1;
return function() {
alert(count++);
}
}