Kilian McMahon kilmc

Battery

How Battery works

The core of Battery is the propertyConfig. These objects configure Battery to recognize valid class names from your Atomic CSS library and then convert them into full CSS classes. Here's an example of a propertyConfig for background-color.

const backgroundColor = {
  property: "background-color",
  propertyIdentifier: "bg",

	class AnnualLists {
	data() {
	const hasTags = (tags) => tags.flat().length > 0;
	const tagsToObject = (tags) =>
	Object.fromEntries(tags.map((tag) => tag.split(":")));

	return {
	pagination: {
	data: "lists.annual",
	size: 1,

	import React, { createContext, useContext } from 'react';

	const HeadingLevelContext = createContext<number>(0);
	type HTMLTag = keyof JSX.IntrinsicElements;

	interface HeadingProps {
	children: React.ReactNode;
	level: 1 \| 2 \| 3 \| 4 \| 5 \| 6;
	}

	const audioArr = [
	{
	albumName: 'Time Management',
	artwork: 'image.jpg',
	releaseDate: '2015-10-02',
	soundCloudLink: 'http://soundcloud.com/stuff',
	spotifyLink: 'http://spotify.com',
	iTunesLink: 'itunes.com'
	},
	{

	const MOLECULES_LIB = {
	'headline-500': ['type-38','type-48-sm','type-60-md','type-100-lg'],
	'headline-400': ['type-38','type-48-sm','type-60-md','type-80-lg'],
	'headline-300': ['type-21','type-38-md','type-48-lg'],
	'headline-200': ['type-21','type-24-md','type-28-lg'],
	'subhead-600': ['type-18','type-21-md'],
	'subhead-500': ['type-16','type-21-md'],
	'subhead-400': ['type-14','type-21-md'],
	'subhead-300': ['type-16','type-18-md'],
	'subhead-200': ['type-14','type-18-md'],

	const intersection = (arr1, arr2) => arr1.length > arr2.length
	? arr1.filter(x => arr2.includes(x))
	: arr2.filter(x => arr1.includes(x))

	const getFactors = (number) => Array
	.from(Array(number), (_, i) => i)
	.filter(i => number % i === 0)

	const calculateRatio = ([width, height]) => {
	const gcf = Math.max(...intersection(getFactors(width),getFactors(height)))

	# Branch Auto-completion

	# Run the following curl command in Terminal anywehre and then copypaste the if statement
	# into your .bash_profile usually found in ~/.bash_profile.

	# curl https://raw.github.com/git/git/master/contrib/completion/git-completion.bash -o ~/.git-completion.bash

	if [ -f ~/.git-completion.bash ]; then
	. ~/.git-completion.bash
	fi

	<!doctype html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>We Long To Belong</title>

	<link rel="stylesheet" href="stylesheets/css/screen.css" media="all">
	<script type="text/javascript" src="//use.typekit.net/slh5fdy.js"></script>
	<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
	<!-- <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> -->

	@mixin floating-list($items, $spacing: 4) {
	display: block;
	float: left;
	// margin-left: $spacing;
	width: (100/$items + 0%) - ($spacing/$items + 0%);
	margin-left: ($spacing/($items - 1)) + 0%;

	&:first-child,
	&:last-child {
	margin-left: 0;