Jase jasesmith

Dark Star Pinwheel

Playing with mix-blend-mode, border-radius, and box-shadows.

A Pen by Jase on CodePen.

License.

CSS Animated Hamburger Icon

CSS Animated Hamburger (Menu Icon) with Transforms using a Single Child Element.

Forked from Elijah Manor's Pen CSS Animated Hamburger Icon.

A Pen by Jase Smith on CodePen.

License.

Vertical File Tabs in Atom

Add the styles to the .atom/styles.less stylesheet in Atom.

Allow Atom's file tabs to be as big as they need to be to show the full filename text; aka: no tab ellipses (...)

Flexbox wrap column alignment

Fixed size tiles inside flexbox cells while maintaining tile alignment by inserting extra :empty ghost tiles (dirty technique, extraneous DOM elements) — known issue: if there's not enough real tiles to fill the first flex row then the ghost tiles have a presence.

Forked from Kristian Dalgård's Pen Flexbox inner border and column alignment.

A Pen by Jase Smith on CodePen.

License.

Sticky Bar

Make an element sticky once it has scrolled out of view in a scrollable ``

	export const ArtSpinner = ({ name }: { name?: string }): React.JSX.Element => {
	const classes = {
	element: joinArray([
	'art-spinner',
	name && `art-${name}--spinner`,
	]),
	circle: joinArray([
	'art-spinner--circle',
	name && `art-${name}--spinner-circle`,
	]),

	atom-workspace-axis.vertical atom-pane {
	flex-direction: row;
	.tab-bar:not(:empty) {
	box-shadow: inset -1px 0 0 #181a1f;
	resize: horizontal;
	height: auto;
	display: block;
	padding-right: 1px;
	padding-bottom: 3em;
	min-width: 14em;

	.ellipsis {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	}

	{
	"name": "project-palette-finder",
	"main": "./lib/project-palette-finder",
	"version": "2.4.1",
	"description": "Finds and archive colors defined in a project's less/sass/stylus files",
	"repository": {
	"type": "git",
	"url": "https://github.com/abe33/atom-project-palette-finder"
	},
	"license": "MIT",