Skip to content

Instantly share code, notes, and snippets.

Avatar

Hayden Bleasel haydenbleasel

View GitHub Profile
@haydenbleasel
haydenbleasel / react-native-phone-input.js
Created Jan 25, 2020
React Native phone input with country code selector
View react-native-phone-input.js
import React, { useState } from 'react';
import CountryPicker from 'react-native-country-picker-modal';
import PNF, { PhoneNumberUtil } from 'google-libphonenumber';
const [countryCode, setCountryCode] = useState('AU');
const [phoneNumber, setPhoneNumber] = useState('');
const phoneUtil = PhoneNumberUtil.getInstance();
function setCode ({ cca2 }) {
setCountryCode(cca2);
@haydenbleasel
haydenbleasel / hellosign.css
Last active May 10, 2019
CSS to make HelloSign more usable
View hellosign.css
.l-app .l-app--content {
padding-bottom: 0;
}
main.au {
padding-top: 121px;
}
.l-app .l-app--container {
padding-top: 100px;
@haydenbleasel
haydenbleasel / link-test.js
Created Jul 29, 2017
Make sure all the links on your page work.
View link-test.js
@haydenbleasel
haydenbleasel / origin.js
Last active Jul 20, 2017
Window location origin polyfill (ES6)
View origin.js
if (!window.location.origin) {
const { protocol, hostname, port } = window.location;
window.location.origin = `${protocol}//${hostname}${port ? `:${port}` : ''}`;
}
@haydenbleasel
haydenbleasel / boilerplate.html
Last active Apr 10, 2019
A powerful HTML5 boilerplate for the modern web.
View boilerplate.html
<!-- HTML5 Doctype. Remember to delete these comments (Quirks Mode). -->
<!doctype html>
<!-- HTML tag -->
<html lang="">
<!-- Let's get started -->
<head>
<!-- Document settings and metadata -->
@haydenbleasel
haydenbleasel / strikethrough.js
Created Apr 26, 2016
Animated strikethrough on hover
View strikethrough.js
$('a').addClass('strikethrough').hover(
(e) => $(e.target).stop().addClass('mouseenter'),
(e) => {
$(e.target).stop().removeClass('mouseenter').addClass('mouseleave');
setTimeout(() => {
$(e.target).stop().removeClass('mouseleave').addClass('no-transition');
}, STIKETHROUGH_DURATION - STIKETHROUGH_OFFSET);
setTimeout(() => {
$(e.target).stop().removeClass('no-transition');
}, STIKETHROUGH_DURATION + STIKETHROUGH_OFFSET);
@haydenbleasel
haydenbleasel / github.js
Created Apr 24, 2016
GitHub chart for website.
View github.js
#github
.row.clearfix
#canvas-container.hidden-xs
canvas#repositories
noscript Sorry, you need Javascript enabled to view this chart.
@haydenbleasel
haydenbleasel / dribbble.html
Last active Apr 27, 2016
Dribbble feed for portfolio
View dribbble.html
#dribbble
.row.clearfix.hidden-xs
noscript Sorry, you need Javascript enabled to view these Dribbble shots.
.column-3
p Simplicity, functionality and accessibility will always remain at the core of my philosphy. I like to combine aspects of print and graphic such as dynamic layouts and typographic flourishes with the principles of modern, minimalism.
@haydenbleasel
haydenbleasel / gulpfile.js
Created Apr 18, 2016
Catalyst: task automation boilerplate for experienced web developers
View gulpfile.js
const gulp = require('gulp'),
sync = require('browser-sync').create(),
del = require('del'),
minimist = require('minimist')(process.argv.slice(2)),
$ = require('gulp-load-plugins')(),
info = require('./package.json'),
header = '/*! Built with Catalyst. */',
staticFiles = gulp.src([
'test/source/**/*',
'!test/source/**/*.html',
@haydenbleasel
haydenbleasel / .editorconfig
Last active Mar 5, 2016
My default configuration files.
View .editorconfig
root = true
[*]
indent_style = space
indent_size = 4
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true