Skip to content

Instantly share code, notes, and snippets.

View pixleight's full-sized avatar

Chris Violette pixleight

17 followers · 1 following
View GitHub Profile
@pixleight
pixleight / Tie Return Type of a Function to its Arguments.ts
Created October 14, 2021 18:51
Methods for tying the return type of a function to its arguments
// The return type matches the type of argument provided
const doSomething = <T>(data: T) : T[] => {
// processing...
return result; // array of type T
}
const something = doSomething(1) // type number[]
// For more complex narrowing...
@pixleight
pixleight / Typing Objects with Records.ts
Created October 14, 2021 18:50
Method for typing objects with allowed keys
// Instead of typing an object like this:
interface Person {
[key: string]: unknown
}
// Only allow certain keys
type AllowedKeys = 'name' | 'age';
type StrictPerson = Record<AllowedKeys, unknown>;
/**
@pixleight
pixleight / carousel.css
Created December 8, 2020 17:13
Tailwind CSS / Alpine.js Image Carousel with Lightbox
@pixleight
pixleight / format-google-calendar.js
Created April 25, 2019 20:45
!function(e){function t(r){if(n[r])return n[r].exports;var a=n[r]={i:r,l:!1,exports:{}};return e[r].call(a.exports,a,a.exports,t),a.l=!0,a.exports}var n={};t.m=e,t.c=n,t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=0)}([function(e,t,n){"use strict";window.formatGoogleCalendar=function(){var e,t=function(e,t){var n=[];n=e.items.filter(function(e){return e&&e.hasOwnProperty("status")&&"cancelled"!==e.status}).sort(l).reverse();var r,a=0,o=0,u=[],c=[],m=[],p=document.querySelector(t.upcomingSelector),d=document.querySelector(t.pastSelector);-1===t.pastTopN&&(t.pastTopN=n.length),-1===t.upcomingTopN&&(t.upcomingTopN=n.length),!1===t.past&&(t.pastTopN=0),!1===t.upcoming&&(t.upcomingTopN=0);for(r in n)s(n[r].end.dateTime||n[r].end.date)?a<t.pastTopN&&(u.push(n[r]),a++):m.push(n[
@pixleight
pixleight / A-Pen-by-Chris-Violette.markdown
Created November 13, 2013 21:58
A Pen by Chris Violette.
@pixleight
pixleight / dabblet.css
Created September 7, 2012 19:25
Polaroid photo gallery experiment
/**
* Polaroid photo gallery experiment
*/
@import url(http://fonts.googleapis.com/css?family=Swanky+and+Moo+Moo);
html {
background: #f06;
background: linear-gradient(60deg, #AAA, #EEE);
min-height:100%;
@pixleight
pixleight / dabblet.html
Created June 11, 2012 17:09
Untitled
<div id="info">
<h1>Skyrim-inspired drop-down menu</h1>
<p>This lunchtime CSS experiment was inspired by the menu styles in the videogame <em>Skyrim</em>.</p>
</div>
<ul id="menu">
<li>
<a href="#">Parent 1</a>
<ul>
<li>
<a href="#">Child A</a>
@pixleight
pixleight / dabblet.html
Created June 11, 2012 17:02
Untitled
<div id="info">
<h1>Skyrim-inspired drop-down menu</h1>
<p>This lunchtime CSS experiment was inspired by the menu styles in the videogame <em>Skyrim</em>.</p>
</div>
<ul id="menu">
<li>
<a href="#">Parent 1</a>
<ul>
<li>
<a href="#">Child A</a>
@pixleight
pixleight / dabblet.html
Created June 11, 2012 17:00
Untitled
<!-- content to be placed inside <body>…</body> -->
@pixleight
pixleight / dabblet.html
Created June 11, 2012 16:59
Untitled
<!-- content to be placed inside <body>…</body> -->