alexcarpenter’s gists

alexcarpenter / float-labels.js

Created July 30, 2019 13:55

	function valueCheckInit() {
	var $text = $(".float-label input, .float-label select, .float-label textarea");

	$text.each(function(){
	var isSelect = $(this).is("select");
	if ($(this).val() !== "" && !isSelect) {
	$(this).attr("data-val", "true").siblings("label").addClass("float-auto");
	} else if ($(this).val() !== null && isSelect) {
	$(this).attr("data-val", "true").siblings("label").addClass("float-auto");
	}

alexcarpenter / LoadMore.vue

Created September 13, 2018 22:29

	<template>
	<div>
	<article v-for="(post, index) in postsResults" :key="index">
	<h2 class="card-title">
	<a :href="post.uri">{{ post.title }}</a>
	</h2>
	<time>{{ post.dateCreated }}</time>
	</article>
	<button @click="fetchPosts()" :class="{ 'is-loading' : loading }" v-show="hasNextPage">Load More</button>
	</div>

alexcarpenter / _lazyFocusImager.twig

Created June 29, 2018 20:31 — forked from sjelfull/_lazyFocusImager.twig

Twig/Craft macro for lazy responsive images/bgimages with Imager and Focuspoint

	{#

	// lazyLoaded Image/bgImages, optimized with Imager and Focuspoint
	---------------------------------------------------------------------------
	https://nystudio107.com/blog/creating-optimized-images-in-craft-cms
	https://github.com/aelvan/Imager-Craft
	https://github.com/smcyr/Craft-FocusPoint
	for the bgImage intrinsic ratio classname creation check:
	https://github.com/inuitcss/inuitcss/blob/develop/objects/_objects.ratio.scss

alexcarpenter / gist:c3d8a090836323c978c526048dbb0748

Last active May 25, 2018 12:45

Debug info

	alexcarpenter.github.io git:master ❯ npm run debug ✹ ✭

	> [email protected] debug /Users/mighty/personal/alexcarpenter.github.io
	> DEBUG=* npx eleventy --config=config/eleventy.config.js

	Eleventy:UserConfig Resetting EleventyConfig to initial values. +0ms
	Eleventy:Config Setting up global TemplateConfig. +0ms
	Eleventy:UserConfig Adding universal filter 'slug' +169ms
	Eleventy:UserConfig Adding universal filter 'url' +23ms
	Eleventy:TemplateConfig rootConfig { templateFormats: [ 'liquid', 'ejs', 'md', 'hbs', 'mustache', 'haml', 'pug', 'njk', 'html', 'jstl' ], pathPrefix: '/', markdownTemplateEngine: 'liquid', htmlTemplateEngine: 'liquid', dataTemplateEngine: 'liquid', passthroughFileCopy: true, htmlOutputSuffix: '-o', keys: { package: 'pkg', layout: 'layout', permalink: 'permalink', permalinkRoot: 'permalinkBypassOutputDir', engineOverride: 'templateEngineOverride' }, dir: { input: '.', includes: '_includes', data: '_data', o

alexcarpenter / carousel.js

Created April 25, 2018 12:11

Craft CMS carousel component

	import Flickity from 'flickity'

	export default function carousel() {
	const carousels = Array.from(document.querySelectorAll('[data-carousel]'))

	if (carousels.length < 1) {
	return
	}

	// Support equal height cells

alexcarpenter / devto.svg

Last active April 30, 2018 13:37

Sorry, something went wrong. Reload?

Sorry, we cannot display this file.

Sorry, this file is invalid so it cannot be displayed.

alexcarpenter / gulpfile.js

Created February 11, 2018 15:42

gulpfile.js

	const gulp = require('gulp');
	const sourcemaps = require('gulp-sourcemaps');
	const sass = require('gulp-sass');
	const autoprefixer = require('gulp-autoprefixer');
	const cssnano = require('gulp-cssnano');
	const critical = require('critical');
	const imagemin = require('gulp-imagemin');
	const uglify = require('gulp-uglify');
	const changed = require('gulp-changed');
	const plumber = require('gulp-plumber');

alexcarpenter / gist:3a22519094f9a764b4d0986cb652da08

Created December 20, 2017 01:01

	10 silly lifecycle [email protected]~start: Args: [ '-c', 'NODE_ENV=development gulp watch' ]
	11 silly lifecycle [email protected]~start: Returned: code: 2 signal: null
	12 info lifecycle [email protected]~start: Failed to exec start script
	13 verbose stack Error: [email protected] start: `NODE_ENV=development gulp watch`
	13 verbose stack Exit status 2
	13 verbose stack at EventEmitter.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/index.js:280:16)
	13 verbose stack at emitTwo (events.js:126:13)
	13 verbose stack at EventEmitter.emit (events.js:214:7)
	13 verbose stack at ChildProcess.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/lib/spawn.js:55:14)
	13 verbose stack at emitTwo (events.js:126:13)

alexcarpenter / intrinsic-ratios.html

Created December 7, 2017 02:55

Intrinsic Ratios with CSS

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>CSS Intrinsic Ratios</title>
	<style>
	body {
	max-width: 800px;

alexcarpenter / lazyloading.html

Last active December 8, 2017 13:52

How to lazyload images using lazysizes

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>Lazy loading images</title>
	<style>
	body {
	max-width: 900px;

Alex Carpenter alexcarpenter