Eric saltnpixels

Install iTerm2 from https://www.iterm2.com/
Install oh-my-zsh from https://ohmyz.sh/ or https://github.com/robbyrussell/oh-my-zsh
Set iTerm2 theme tab theme to Dark - Preferences | Appearance | Tabs | Theme > Dark
Install Fira Code fonts from https://github.com/tonsky/FiraCode (Clone and navigate to dstr > ttf, install all font files by double clicking)
Install Powerline fonts from https://github.com/powerline/fonts
Set fonts for iTerm2 - Preferences | Profiles | Text
- Change Font to 14pt Fira code regular and Check Use Ligatures checkbox
- Change Non ASCII Font to 14pt Fira mono and Check Use Ligatures checkbox
Install iTerm2 snazzy theme from https://github.com/sindresorhus/iterm2-snazzy
- Navigate to Preferences | Profiles | Color Presets > Snazzy

	const useStickyScroll = (
	{
	elementRef,
	containerRef
	}: {elementRef: any; containerRef?: any; onScroll?: (y: number) => void},
	dependencies: any[] = []
	) => {
	const [isSticky, setIsSticky] = useState(false);
	// Use useRef for the callback to avoid triggering re-renders
	const onCallbackRef = useRef<(y: number) => void>();

	import { useState, useLayoutEffect } from 'react';
	import throttle from 'lodash.throttle';

	function useResizeObserver(ref: React.MutableRefObject<any>) {
	const [dimensions, setDimensions] = useState({
	width: 0,
	height: 0,
	dimensionsLoaded: false,
	});

	import { useRef, useEffect, useState } from 'react';
	import Swiper from 'swiper';
	import { SwiperOptions } from 'swiper/types';
	import { Pagination, Navigation } from 'swiper/modules';
	import { Box, BoxProps, MotionBox } from '@components';
	import { Chevronleft, Chevronright } from '@/icons';
	import { Variants } from 'framer-motion';

	// now importing all thee manually with emotion
	// import 'swiper/css';

	import React, { useEffect, useRef, useState, useCallback } from 'react';
	import { throttle } from 'lodash';

	/**
	* Returns a ref, and a stateful value bound to the ref as well as observe function
	* The observe runs automatically on window scroll but you can observe another elements scroll if you want
	*/
	export default function useSticky<T extends HTMLElement>(fn ?: (stickyActive?: boolean)=> void) {
	const stickyRef = useRef<T>(null);
	const [sticky, setSticky] = useState(false);

	// must have a loading state that turns true when fetching data and false afterwards
	// callback is responsible for setting loading state as well as deciding if it should even run. (check if pages left etc...)
	// scrollingElement defaults to viewport if none used. If wanted put it as a ref on a scrollable element
	// sentry must be placed as a ref and is not optional

	import { useCallback, useEffect, useRef, useState } from 'react';

	export default function useInfiniteScroller({
	isLoading,
	callback,

	.aspect-ratio {
	position: relative;
	// needs a set height, so override when using on a component

	&::before {
	content: "";
	display: block;
	height: 0;
	width: 100%;
	}

	if ( ! function_exists( 'set_tag_cloud_sizes' ) ) {
	/**
	* Removes the inline font sizing.
	*
	* @param string $tags holds markup of tags
	*
	* @return string
	*/
	function set_tag_cloud_sizes( string $tags ): string {
	return preg_replace( '/style="font-size: \d+pt;"/', '', $tags );