Skip to content

Instantly share code, notes, and snippets.

View nchristus's full-sized avatar

Nick Christus nchristus

  • Kansas City, MO
View GitHub Profile
@nchristus
nchristus / sticky-footer.scss
Created May 26, 2016 15:58
Flexbox sticky footer
@nchristus
nchristus / scrollTo.js
Created December 15, 2015 16:42 — forked from james2doyle/scrollTo.js
a native scrollTo function in javascript that uses requestAnimationFrame and easing for animation
// easing functions http://goo.gl/5HLl8
Math.easeInOutQuad = function (t, b, c, d) {
t /= d/2;
if (t < 1) {
return c/2*t*t + b
}
t--;
return -c/2 * (t*(t-2) - 1) + b;
};
// ==========================================================================
// TYPOGRAPHY
//
// Global typography settings and styles
// base/_typography.scss
// ==========================================================================
// Font-size scale (Based on http://csswizardry.com/2012/02/pragmatic-practical-font-sizing-in-css/)
@nchristus
nchristus / SassMeister-input.scss
Created June 9, 2015 15:35
Generated by SassMeister.com.
// ----
// Sass (v3.4.14)
// Compass (v1.0.3)
// ----
@-webkit-keyframes loading-opacity {
1% { display: block; }
25% { opacity: 1; }
75% { opacity: 1; }
99% { opacity: 0; }
@nchristus
nchristus / typeahead.css
Last active August 29, 2015 14:16
Typeahead tweaks
* {
box-sizing: border-box;
}
html {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
line-height: 1.5;
}
/* Hide 'x' and 'eye' controls in IE10 */
@nchristus
nchristus / list-counter.scss
Created January 23, 2015 15:27
List counter
.ui-modal-list.ordered {
list-style: none;
counter-reset: ol-counter;
> li {
position: relative;
padding-left: rem-calc(20);
&:before {
position: absolute;
@nchristus
nchristus / jquery.password-toggle.js
Last active August 29, 2015 14:13
jQuery password toggle
// ==========================================================================
// Password toggle
// ==========================================================================
// Example markup:
// <div class="pw-toggle">
// <input type="password" class="text-input" id="pw-input" data-pw="pw-password">
// </div>
(function() {
@nchristus
nchristus / fontz
Created September 11, 2014 14:20
Font size sanity
// Fonts
// ==========================================================================
// Sizing based on http://csswizardry.com/2012/02/pragmatic-practical-font-sizing-in-css/
$font-size-giga: em(72px);
$font-size-mega: em(60px);
$font-size-kilo: em(48px);
$font-size-alpha: em(36px);
$font-size-beta: em(24px);
@nchristus
nchristus / general
Created March 14, 2014 17:18
Stylestats - general.css
┌─────────────────────────────────┬───────────────────────────────────────────────┐
│ Stylesheets │ 1 │
├─────────────────────────────────┼───────────────────────────────────────────────┤
│ Size │ 255.7KB │
├─────────────────────────────────┼───────────────────────────────────────────────┤
│ Rules │ 1646 │
├─────────────────────────────────┼───────────────────────────────────────────────┤
│ Selectors │ 2004 │
├─────────────────────────────────┼───────────────────────────────────────────────┤
│ Simplicity │ 82.14% │
@nchristus
nchristus / gist:9548936
Created March 14, 2014 14:36
Name media queries
@mixin at-least($device-width, $old-ie: "false") {
@media screen and (min-width: $device-width) {
@content;
}
@if $old-ie == "true" {
.lt-ie9 & {
@content;
}
}