shshaw’s gists

shshaw / index.html

Last active June 8, 2018 16:58

@Keyframes 1.9.4 | Dot Spinner

	<a href="https://youtu.be/XqWsvQxKNac" target="_blank" data-keyframers-credit style="color: #FFF"></a>
	<script src="https://codepen.io/shshaw/pen/QmZYMG.js"></script>

	<div class="triangles">
	<div class="triangle">
	<div class="dot"></div>
	<div class="dot"></div>
	<div class="dot"></div>
	</div>
	<div class="triangle -big">

shshaw / index.html

Created June 8, 2018 04:41

@Keyframes 1.9.3 | Overloadered 4

	<a href="https://youtu.be/XqWsvQxKNac" target="_blank" data-keyframers-credit style="color: #FFF; text-shadow: 0 1px 0 #000"></a>
	<script src="https://codepen.io/shshaw/pen/QmZYMG.js"></script>

	<div class="sun">
	<svg class="eclipse-container" viewBox="0 0 100 100">
	<circle class="eclipse" cx="50" cy="50" r="49" transform="rotate(-90 50 50)" />
	</svg>
	</div>

shshaw / index.html

Created June 8, 2018 03:28

@Keyframes 1.8.2 | Overloadered 3

shshaw / index.html

Created June 8, 2018 03:28

@keyframers 1.8.1 | Overloadered 2

	<!--
	https://dribbble.com/shots/4434643-Clock-Loader-Interaction
	-->
	<div class="clock">
	<div class="hand hour"></div>
	<div class="hand minute"></div>
	</div>

shshaw / vui ui -D output

Last active June 1, 2018 18:46

vui ui -D output

	vue ui -D
	🚀 Starting GUI...
	UI 13:43.57 Plugin API loaded for @vue/cli-service
	UI 13:43.57 Project open Sy8GPO2yQ /Users/stephen/Sites/ell-uncomfortable
	🌠 Ready on http://localhost:8001
	UI 13:43.57 Hook onProjectOpen 1 handlers
	UI 13:43.57 SharedData set webpack-dashboard-serve-status null (0 watchers)
	UI 13:43.57 SharedData set webpack-dashboard-serve-progress 0 (0 watchers)
	UI 13:43.57 SharedData set webpack-dashboard-serve-operations null (0 watchers)
	UI 13:43.57 SharedData set webpack-dashboard-serve-stats null (0 watchers)

shshaw / index.html

Last active June 1, 2018 18:11

@keyframers 1.8.0 | Bike Blender 🚲🌪️

	<a href="https://youtu.be/Wt5ENQj9FCQ" target="_blank" data-keyframers-credit style="color: #000"></a>
	<script src="https://codepen.io/shshaw/pen/QmZYMG.js"></script>

	<div id="app" data-state="bike">

	<div class="ui-circle"></div>

	<header class="ui-header">
	<button id="back"></button>
	</header>

shshaw / index.html

Last active May 25, 2018 14:17

@keyframers 1.7.0 | Oceanic Overlays

	<a href="https://youtu.be/kd_zuEYCDck" target="_blank" data-keyframers-credit style="color: #000"></a>
	<script src="https://codepen.io/shshaw/pen/QmZYMG.js"></script>

	<input type="radio" name="scene" id="scene-1" value="1" checked />
	<input type="radio" name="scene" id="scene-2" value="2" />
	<input type="radio" name="scene" id="scene-3" value="3" />
	<input type="radio" name="scene" id="scene-4" value="4" />

	<main id="site">
	<header class="top-nav">

shshaw / index.html

Last active August 16, 2018 22:45

SplittingImage Hover Gallery

	<div class="tiler">
	<img src="https://picsum.photos/1000/600?image=1067" />
	<div class="tiler-overlay" data-image="https://picsum.photos/1000/600?image=1067"></div>
	</div>

	<div class="tiler">
	<img src="https://picsum.photos/1000/600?image=1061" />
	<div class="tiler-overlay" data-image="https://picsum.photos/1000/600?image=1061"></div>
	</div>

shshaw / index.html

Created May 18, 2018 15:00

@keyframers 1.6.0 | Mouse to the Metal

	<a href="https://youtu.be/SJu3igAsVco" target="_blank" data-keyframers-credit style="color: #FFF"></a>
	<script src="https://codepen.io/shshaw/pen/QmZYMG.js"></script>

	<div id="speedometer">
	<div class="speed-bg">
	<div class="speed-bg__steady"></div>
	<div class="speed-bg__pulse"></div>
	</div>

	<svg class="speed-ticks" viewBox="0 0 100 100">

shshaw / index.html

Last active May 17, 2018 19:33

Simple Rope Verlet Physics

Shaw shshaw