For precision programmatic animation!
Translated from the JavaScript in Sean Yen’s Easing equations
Illustrations adapted from Andrey Sitnik and Ivan Solovev’s Easings.net
Example usage:
duration = 30
For precision programmatic animation!
Translated from the JavaScript in Sean Yen’s Easing equations
Illustrations adapted from Andrey Sitnik and Ivan Solovev’s Easings.net
Example usage:
duration = 30
// | |
// Prelude | |
// A zero dependency, one file drop in for faster Typescript development with fewer bugs | |
// through type safe, functional programming. Comments are inline with links to blog posts motiviating the use. | |
// alias for a function with airity 1 | |
export type Fn<A, B> = (a: A) => B; | |
// alias for a function with airity 2 |
In this readme we will use the eds.equinor.com
domain as an example. Can be done for any sub domain, given you have setup correct DNS/Re-routing.
Run in terminal
openssl req -new -newkey rsa:2048 -nodes -keyout eds.equinor.com.key -out request.csr
In this readme we will use the eds.equinor.com
domain as an example. Can be done for any sub domain, given you have setup correct DNS/Re-routing.
Run in terminal
openssl req -new -newkey rsa:2048 -nodes -keyout eds.equinor.com.key -out request.csr
This is a simple Tailwind plugin to expose all of Tailwind's colors, including any custom ones, as custom css properties on the :root
element.
There are a couple of main reasons this is helpful:
See the Tailwind Plugins for more info on plugins.
/* | |
* This script fetches all color styles from a Figma team/document. | |
* | |
* Dependencies: | |
* | |
* - node-fetch | |
* | |
* Due to a limitation in the Figma /styles endpoint, we need to use a | |
* document for actually using the colors in a color grid 🙄That's why | |
* we're both fetching from /styles and /files below. |
/** | |
* Easing functions | |
* | |
* https://gist.github.com/gre/1650294 | |
* http://easings.net | |
*/ | |
// no easing, no acceleration | |
export function easeLinear(t){ return t } | |
// accelerating from zero velocity | |
export function easeInQuad(t){ return t*t } |
<html> | |
<head> | |
<script> | |
customElements.define("star-wars-planets", class extends HTMLElement { | |
constructor() { | |
super(); | |
this.attachShadow({ mode: "open" }); | |
} | |
static get observedAttributes() { return ["loading", "planets"]; } |
// | |
// Figma project stats | |
// Pulls statistics like number of files, frames, versions etc for a project. | |
// | |
// Usage: | |
// export FIGMA_API_ACCESS_TOKEN='your-token' | |
// node figma-project-stats.js <project-id> | |
// | |
// You can generate tokens in your account settings or at | |
// https://www.figma.com/developers/explorer#personal-access-token |