Sharing global styles

app/styles/animations.js

@@ -1,25 +0,0 @@
-// @flow
-import { keyframes } from 'styled-components';
-
-export const fadeIn = keyframes`
-  from { opacity: 0; }
-  to { opacity: 1; }
-`;
-
-export const fadeAndScaleIn = keyframes`
-  from {
-    opacity: 0;
-    transform: scale(.98);
-  }
-
-  to {
-    opacity: 1;
-    transform: scale(1);
-  }
-`;
-
-export const pulsate = keyframes`
-  0% { opacity: 1; }
-  50% { opacity: 0.5; }
-  100% { opacity: 1; }
-`;

app/styles/base.css

@@ -1,143 +0,0 @@
-* {
-  box-sizing: border-box;
-}
-
-:root {
-  --line-height-1: 1;
-  --line-height-2: 1.125;
-  --line-height-3: 1.25;
-  --line-height-4: 1.5;
-  --letter-spacing: 1;
-  --caps-letter-spacing: 0.2em;
-  --bold-font-weight: bold;
-}
-
-html,
-body,
-.viewport {
-  width: 100%;
-  min-height: 100vh;
-  margin: 0;
-}
-
-body,
-button,
-input,
-optgroup,
-select,
-textarea {
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
-    Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
-}
-
-body {
-  font-size: 16px;
-  line-height: 1.5;
-  margin: 0;
-  color: #617180;
-  background-color: #fff;
-  display: flex;
-
-  -moz-osx-font-smoothing: grayscale;
-  -webkit-font-smoothing: antialiased;
-  text-rendering: optimizeLegibility;
-}
-img {
-  max-width: 100%;
-  height: auto;
-}
-svg {
-  max-height: 100%;
-}
-a {
-  color: #16B3FF;
-  text-decoration: none;
-  cursor: pointer;
-}
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-  font-weight: 500;
-  line-height: 1.25;
-  margin-top: 1em;
-  margin-bottom: 0.5em;
-  color: #1f2429;
-}
-h1 {
-  font-size: 2em;
-}
-h2 {
-  font-size: 1.5em;
-}
-h3 {
-  font-size: 1.25em;
-}
-h4 {
-  font-size: 1em;
-}
-h5 {
-  font-size: 0.875em;
-}
-h6 {
-  font-size: 0.75em;
-}
-p,
-dl,
-ol,
-ul,
-pre,
-blockquote {
-  margin-top: 1em;
-  margin-bottom: 1em;
-}
-code,
-pre,
-samp {
-  font-family: 'Atlas Typewriter', 'Source Code Pro', Menlo, Consolas,
-    'Liberation Mono', monospace;
-}
-code,
-samp {
-  font-size: 85%;
-  padding: 0.125em;
-}
-pre {
-  font-size: 85%;
-  overflow: scroll;
-}
-blockquote {
-  font-size: 1.25em;
-  font-style: italic;
-  margin-left: 0;
-}
-hr {
-  margin: 2em 0;
-  border: 0;
-  border-bottom-width: 1px;
-  border-bottom-style: solid;
-  border-bottom-color: #dedede;
-}
-*[role='button'] {
-  cursor: pointer;
-}
-
-.hljs {
-  border: 1px solid rgba(0, 0, 0, 0.0625);
-  padding: 1em;
-  border-radius: 0.25em;
-}
-
-.activeDropZone {
-  background: #4E5C6E;
-}
-
-.activeDropZone a {
-  color: #FFF !important;
-}
-
-.ReactModal__Body--open {
-  overflow: hidden;
-}

app/styles/constants.js

@@ -1,65 +0,0 @@
-// @flow
-
-export const layout = {
-  padding: '1.5vw 1.875vw',
-  vpadding: '1.5vw',
-  hpadding: '1.875vw',
-  sidebarWidth: '280px',
-  sidebarMinWidth: '250px',
-  sidebarMaxWidth: '350px',
-};
-
-export const size = {
-  tiny: '2px',
-  small: '4px',
-  medium: '8px',
-  large: '16px',
-  huge: '24px',
-  enormous: '32px',
-};
-
-export const fontSize = {
-  small: '14px',
-  medium: '16px',
-  large: '18px',
-  huge: '24px',
-};
-
-export const fontWeight = {
-  ultraLight: 100,
-  thin: 200,
-  light: 300,
-  regular: 400,
-  medium: 500,
-  semiBold: 600,
-  bold: 700,
-  heavy: 800,
-};
-
-export const color = {
-  text: '#171B35',
-
-  /* Brand */
-  primary: '#2B8FBF',
-  danger: '#D0021B',
-  warning: '#f08a24' /* replace */,
-  success: '#43AC6A' /* replace */,
-  info: '#a0d3e8' /* replace */,
-  offline: '#000000',
-
-  /* Dark Grays */
-  slate: '#9BA6B2',
-  slateLight: '#DAE1E9',
-  slateDark: '#4E5C6E',
-
-  /* Light Grays */
-  smoke: '#F4F7FA',
-  smokeLight: '#F9FBFC',
-  smokeDark: '#E8EBED',
-
-  /* Misc */
-  white: '#FFFFFF',
-  black: '#000000',
-
-  /* Alert colors */
-};

app/styles/fonts.css

@@ -1,62 +0,0 @@
-@font-face {
-  font-family: 'Atlas Grotesk';
-  src: url('../fonts/atlas/AtlasGrotesk-Regular-Web.woff') format('woff');
-  font-weight: normal;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: 'Atlas Grotesk';
-  src: url('../fonts/atlas/AtlasGrotesk-Medium-Web.woff') format('woff');
-  font-weight: bold;
-  font-style: normal;
-}
-
-/*@font-face {
-  font-family: 'Atlas Grotesk';
-  src: url('../fonts/atlas/AtlasGrotesk-Light-Web.woff') format('woff');
-  font-weight: lighter;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: 'Atlas Grotesk';
-  src: url('../fonts/atlas/AtlasGrotesk-LightItalic-Web.woff') format('woff');
-  font-weight: lighter;
-  font-style: italic;
-}*/
-
-@font-face {
-  font-family: 'Atlas Grotesk';
-  src: url('../fonts/atlas/AtlasGrotesk-RegularItalic-Web.woff') format('woff');
-  font-weight: normal;
-  font-style: italic;
-}
-
-@font-face {
-  font-family: 'Atlas Grotesk';
-  src: url('../fonts/atlas/AtlasGrotesk-MediumItalic-Web.woff') format('woff');
-  font-weight: bold;
-  font-style: italic;
-}
-
-@font-face {
-  font-family: 'Atlas Grotesk';
-  src: url('../fonts/atlas/AtlasGrotesk-MediumItalic-Web.woff') format('woff');
-  font-weight: bold;
-  font-style: italic;
-}
-
-@font-face {
-  font-family: 'Atlas Typewriter';
-  src: url('../fonts/atlas/AtlasTypewriterRegular.woff') format('woff');
-  font-weight: normal;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: 'Atlas Typewriter';
-  src: url('../fonts/atlas/AtlasTypewriterMedium.woff') format('woff');
-  font-weight: bold;
-  font-style: normal;
-}