Skip to content

Instantly share code, notes, and snippets.

View adamschwartz's full-sized avatar

Adam Schwartz adamschwartz

1.2k followers · 58 following
View GitHub Profile
@adamschwartz
adamschwartz / matter-js-compound-body-set-part-position.html
Last active March 25, 2017 19:03
<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/matter-js/0.12.0/matter.js"></script>
<script>
const Engine = Matter.Engine
const Render = Matter.Render
const Runner = Matter.Runner
const MouseConstraint = Matter.MouseConstraint
const Mouse = Matter.Mouse
const World = Matter.World
@adamschwartz
adamschwartz / ampersand-logo.html
Last active March 8, 2017 05:22
<svg viewBox="0 0 912 166">
<defs>
<linearGradient x1="50%" y1="0%" x2="7.09834099%" y2="100%" id="ampersand-logo-gradient">
<stop stop-color="#f69259" offset="0%"></stop>
<stop stop-color="#f16975" offset="100%"></stop>
</linearGradient>
</defs>
<path d="M229.060522,129.685867 L241.919592,129.685867 L199.908427,22.4295349 L189.460432,22.4295349 L147.230078,129.685867 L159.796896,129.685867 L172.948218,95.7116203 L215.763075,95.7116203 L229.060522,129.685867 Z M211.890742,84.5329971 L177.331992,84.5329971 L189.89881,51.4355049 C191.895861,45.8340191 193.430182,40.6952591 194.501772,36.0192337 C196.206572,42.1078025 197.862666,47.2465625 199.470049,51.4355049 L211.890742,84.5329971 Z M355.458081,129.685867 L367.586522,129.685867 L367.586522,77.4458961 C367.586522,67.2170906 365.333747,59.7768538 360.828204,55.1251812 C356.322662,50.4735131 349.539987,48.1476746 340.480187,48.1476746 C334.683861,48.1476746 329.520753,49.3653865 324.990853,51.8008194 C320.460954,54.2362523 317.00264,57.
@adamschwartz
adamschwartz / github-revert-dark-header.css
Created February 13, 2017 04:39
.header.header-dark {
color: #333;
background-color: #f5f5f5;
border-bottom: 1px solid #e5e5e5
}
.header-dark .read-only-mode-banner {
background-color: #f8e45f;
border-bottom-color: #f6dc2e
}
@adamschwartz
adamschwartz / magic-8-ball.html
Created February 8, 2017 21:03
<head>
<style>
@import url('https://fonts.googleapis.com/css?family=Oswald');
html {
font-family: 'Oswald', sans-serif;
font-size: 16px;
}
.surface {
@adamschwartz
adamschwartz / cloudflare-cloud-svg.html
Created January 18, 2017 06:02
<svg xmlns="http://www.w3.org/2000/svg" viewBox="430 20 360 280">
<path d="M674.8 224c2-7.3 1.3-14-2.2-18.8-3.2-4.5-8.6-7-15-7.4l-123.2-1.6c-.8 0-1.5-.4-2-1-.3-.6-.4-1.4-.2-2.2.4-1.2 1.6-2 3-2.2l124-1.6c14.8-.7 30.8-12.6 36.4-27.2l7-18.5c.4-.8.5-1.6.3-2.4-8-36-40.4-63-79-63-35.6 0-65.8 23-76.6 54.8-7-5.2-16-8-25.5-7-17.2 1.6-31 15.3-32.6 32.4-.4 4.4 0 8.7 1 12.7-28 .7-50.3 23.5-50.3 51.6 0 2.5.3 5 .6 7.5.2 1.3 1.2 2.2 2.4 2.2h227.2c1.3 0 2.5-1 3-2.2l1.6-6zM714 144.8h-3.4c-.8 0-1.5.7-1.8 1.5L704 163c-2 7.2-1.3 13.8 2.2 18.7 3.2 4.5 8.6 7 15 7.4l26.3 1.7c.8 0 1.5.4 2 1 .3.6.4 1.5.2 2.2-.4 1-1.6 2-3 2l-27.2 1.7c-14.8.7-30.7 12.6-36.3 27.2l-2 5c-.4 1 .3 2 1.4 2h93.8c1 0 2-.7 2.4-1.8 1.6-5.8 2.5-12 2.5-18.2 0-37-30.2-67.2-67.3-67.2"/>
</svg>
@adamschwartz
adamschwartz / set-input-css-variable-value.js
Created December 30, 2016 17:05
Automatically set CSS --value variable on inputs
inputSelector = 'textarea, input[type="text"], input[type="email"]';
for (input of document.querySelectorAll(inputSelector)) {
input.style.setProperty('--value', input.value);
}
document.addEventListener('input', e => {
var input = e.target;
input.style.setProperty('--value', input.value);
});
@adamschwartz
adamschwartz / ex-and-ch-units.html
Created September 24, 2016 22:26
<style>
.ex div {
position: relative;
margin: 40px;
color: #000;
font-size: 32px;
line-height: 1;
}
.ex div::before {
@adamschwartz
adamschwartz / iframe-scaling.html
Last active September 2, 2016 21:20
<style>
body {
margin: 0;
background: #e0e0e0;
}
.column {
width: 532px;
max-width: 100%;
margin: auto;
@adamschwartz
adamschwartz / share.html
Created August 11, 2016 18:25
Facebook, Twitter, and email share icons
<style>
html {
box-sizing: border-box;
font-family: "Avenir Next", sans-serif;
}
html * {
box-sizing: inherit;
}
.share {
width: 15em;
@adamschwartz
adamschwartz / wedge.html
Created July 28, 2016 19:15
Angled wedge SVG CSS
<style>
section {
height: 25vh;
background: #fff;
text-align: center;
font-family: Avenir Next, sans-serif;
line-height: 25vh;
font-size: 19px;
}