jurassix

React Inline Styles with Media Query

See Live Demo

The breakpoint is set at 800px. Adjust the screen and the layout will be responsive with only inline CSS.

For edification please reference vjeux presentation on inline styles within React

jurassix

React Inline Styles with responsive design

See Live Demo

The breakpoint is set at 33% of screen size. Adjust the screen and the layout will be responsive with only inline CSS.

For edification please reference vjeux presentation on inline styles within React

jurassix

export const contains = (list = [], test) => list.indexOf(test) >= 0;

export const removeItemAt = (list = [], index = 0) =>
  [
    ...list.slice(0, index),
    ...list.slice(index + 1),
  ];

export const insertItemAt = (list = [], index = 0, item) =>
  [

jurassix

export const joinArray = (list = [], separator) =>
  list.reduce((joinedList, item, index, {length}) => {
    joinedList.push(item);
    if (index < (length - 1)) {
      joinedList.push(separator);
    }
    return joinedList;
  }, []);

jurassix

const abortable = (func) => (...args) => {
  let aborted = false;
  
  const abort = () => { aborted = true; };

  const promise = new Promise((resolve, reject) => {
    const resolveIfNotAborted = resolution => {
      if (aborted) {
        reject(Error('promise aborted'));
      }

jurassix

  // Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions