mikeyamadeo

* {
 box-sizing: inherit;
}

body,
h1, h2, h3, h4, h5, h6,
dl, dd, ol, ul,
form, fieldset, legend {
 margin: 0;
 padding: 0;

mikeyamadeo

@import 'settings';

html {
 font-family: var(--font-primary);
}

ol, ul {
 list-style: none;
}

mikeyamadeo

import { StyleSheet, css } from 'aphrodite'

const styles = StyleSheet.create({
  base: {
    border: 'none',
    outline: 'none'
  }
})

const Button = ({children, className, ...rest}) =>

mikeyamadeo

import { StyleSheet, css } from 'aphrodite'
import { colors, spacing, viewport } from 'App/style/settings'

const styles = StyleSheet.create({
  container: {
    border: `solid 1px ${colors.primary}`,
    [viewport.narrow]: {
      padding: spacing.tiny
    }
  }

mikeyamadeo

import { colors } from 'App/style/settings'
import { StyleSheet, css } from 'aphrodite'
import BtnBase from 'App/shared/el.Btn'

const styles = StyleSheet.create({
  common: {
    fontSize: '1.2em',
    textTransform: 'uppercase'
  },
  main: {

mikeyamadeo

import { StyleSheet, css } from 'aphrodite'

const styles = StyleSheet.create({
  base: {
    display: 'flex',
    ':hover': {
      opacity: 0.5 
    }
  }
})

mikeyamadeo

const InlineStyled = () =>
  <div style={{display: 'flex', padding: '2em', backgroundColor: 'cyan'}}>
    <h1 style={{color: 'white', fontFamily: 'monospace'}}>
      Gotta Catch Em All
    </h1>
  </div>

mikeyamadeo

import { StyleSheet, css } from 'aphrodite'
import { colors, spacing } from 'App/style/settings'
import Btn from 'App/shared/atm.Btn'
import Input from 'App/shared/atm.Input'

const styles = StyleSheet.create({
  container: {
    display: 'flex',
    align: 'center',
    padding: spacing.default

mikeyamadeo

@import "generic.reset";
@import "generic.normalize";
@import "generic.box-sizing";

@import "elements.page";
@import "elements.link";
@import "elements.typography";

html,
#app {

mikeyamadeo

import './style/css'
import React from 'react'

const Root = ({children}) =>
  <div>
    { children }
  </div>

export default Root