Andy-set-studio

.auto-collapse {
  display: flex;
  flex-wrap: wrap;           
  gap: 1rem;
}

Andy-set-studio

echo 'Hello world' > index.md

npx @11ty/eleventy --serve

Andy-set-studio

/**
 * Takes an array and splits it into sized chunks
 * that are <= the passed chunkSize param
 *
 * @param {Array} source Source array
 * @param {Number} chunkSize The max size of each chunk
 * @returns {Array} A 2d array of chunks
 */
const splitArrayIntoChunks = (source, chunkSize) => {
  if (!source.length) {

Andy-set-studio

import React from 'react'
import PropTypes from 'prop-types'

const Heading = ({children, cssClass, level}) => {
  const Tag = `h${level}`

  return <Tag className={cssClass}>{children}</Tag>
}

Heading.propTypes = {

Andy-set-studio

The <tabs-group> element

You might be thinking “what the heck is that”? This is a custom element that we’ve yet to declare. This is what will be our web component that magically creates our tabs from existing HTML.

This capability is what I absolutely love about custom elements, because it just works, even though I haven’t defined it yet, thanks to the forgiving, declarative nature of HTML. What a fantastic language, right?

For now and until this is defined, it essentially operates as a <div>. Lovely stuff.

Andy-set-studio

img[src*='.svg'] {
  min-width: 100%;
}

Andy-set-studio

# Block Twitter
127.0.0.1 www.twitter.com
127.0.0.1 twitter.com
127.0.0.1 mobile.twitter.com

Andy-set-studio

// Returns true if we’re in a browser
const isBrowser = () => {
  return typeof window !== 'undefined';
};

Andy-set-studio

/**
 * Returns a fetch request after a defined timeout
 *
 * @param {String} url The url that you’re fetching
 * @param {Object} options={} Fetch API parameters
 * @param {Number} timeout=window.sleepFetchTimeout||1000 You can completely override the timeout globally with window.sleepFetchTimeout
 * @returns {Promise}
 */
const sleepFetch = (url, options = {}, timeout = window.sleepFetchTimeout || 0) => {
  return new Promise(resolve => {

Andy-set-studio

const textArea = document.querySelector('textarea');
const storageKey = 'text';

const init = () => {
  
  textArea.value = localStorage.getItem(storageKey);
  
  textArea.addEventListener('input', () => {
    localStorage.setItem(storageKey, textArea.value);
  });