1. Advisor
  2. @apollo/space-kit
  3. @apollo/space-kit code examples
View all @apollo/space-kit analysis

How to use @apollo/space-kit - 10 common examples

To help you get started, we’ve selected a few @apollo/space-kit examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github DavidWells / analytics / site / gatsby-theme-base / src / utils / colors.js View on Github external
exports.colors = {
  primary: '#2da5f7',
  //primary: '#56b8fb',
  codePrimary: colors.indigo.dark,
  // primary: colors.indigo.dark,
  secondary: colors.pink.base,
  tertiary: colors.teal.dark,
  divider: colors.silver.dark,
  background: colors.silver.light,
  background2: colors.silver.base,
  text1: colors.black.lighter,
  text2: colors.grey.dark,
  text3: colors.grey.light,
  text4: colors.silver.darker,
  warning: colors.yellow.base,
  shadow: colors.black.darker,
  highlight: colors.blue.base,
  highlight2: colors.blue.lighter,
  highlight3: colors.blue.lightest,
  hoverOpacity: 0.8
}
github DavidWells / analytics / site / gatsby-theme-base / src / utils / colors.js View on Github external
const {colors} = require('@apollo/space-kit')

exports.colors = {
  primary: '#2da5f7',
  //primary: '#56b8fb',
  codePrimary: colors.indigo.dark,
  // primary: colors.indigo.dark,
  secondary: colors.pink.base,
  tertiary: colors.teal.dark,
  divider: colors.silver.dark,
  background: colors.silver.light,
  background2: colors.silver.base,
  text1: colors.black.lighter,
  text2: colors.grey.dark,
  text3: colors.grey.light,
  text4: colors.silver.darker,
  warning: colors.yellow.base,
  shadow: colors.black.darker,
  highlight: colors.blue.base,
  highlight2: colors.blue.lighter,
  highlight3: colors.blue.lightest,
  hoverOpacity: 0.8
}
github DavidWells / analytics / site / gatsby-theme-base / src / utils / colors.js View on Github external
primary: '#2da5f7',
  //primary: '#56b8fb',
  codePrimary: colors.indigo.dark,
  // primary: colors.indigo.dark,
  secondary: colors.pink.base,
  tertiary: colors.teal.dark,
  divider: colors.silver.dark,
  background: colors.silver.light,
  background2: colors.silver.base,
  text1: colors.black.lighter,
  text2: colors.grey.dark,
  text3: colors.grey.light,
  text4: colors.silver.darker,
  warning: colors.yellow.base,
  shadow: colors.black.darker,
  highlight: colors.blue.base,
  highlight2: colors.blue.lighter,
  highlight3: colors.blue.lightest,
  hoverOpacity: 0.8
}
github DavidWells / analytics / site / gatsby-theme-base / src / utils / colors.js View on Github external
codePrimary: colors.indigo.dark,
  // primary: colors.indigo.dark,
  secondary: colors.pink.base,
  tertiary: colors.teal.dark,
  divider: colors.silver.dark,
  background: colors.silver.light,
  background2: colors.silver.base,
  text1: colors.black.lighter,
  text2: colors.grey.dark,
  text3: colors.grey.light,
  text4: colors.silver.darker,
  warning: colors.yellow.base,
  shadow: colors.black.darker,
  highlight: colors.blue.base,
  highlight2: colors.blue.lighter,
  highlight3: colors.blue.lightest,
  hoverOpacity: 0.8
}
github DavidWells / analytics / site / gatsby-theme-base / src / utils / colors.js View on Github external
const {colors} = require('@apollo/space-kit')

exports.colors = {
  primary: '#2da5f7',
  //primary: '#56b8fb',
  codePrimary: colors.indigo.dark,
  // primary: colors.indigo.dark,
  secondary: colors.pink.base,
  tertiary: colors.teal.dark,
  divider: colors.silver.dark,
  background: colors.silver.light,
  background2: colors.silver.base,
  text1: colors.black.lighter,
  text2: colors.grey.dark,
  text3: colors.grey.light,
  text4: colors.silver.darker,
  warning: colors.yellow.base,
  shadow: colors.black.darker,
  highlight: colors.blue.base,
  highlight2: colors.blue.lighter,
  highlight3: colors.blue.lightest,
  hoverOpacity: 0.8
}
github DavidWells / analytics / site / gatsby-theme-base / src / utils / colors.js View on Github external
const {colors} = require('@apollo/space-kit')

exports.colors = {
  primary: '#2da5f7',
  //primary: '#56b8fb',
  codePrimary: colors.indigo.dark,
  // primary: colors.indigo.dark,
  secondary: colors.pink.base,
  tertiary: colors.teal.dark,
  divider: colors.silver.dark,
  background: colors.silver.light,
  background2: colors.silver.base,
  text1: colors.black.lighter,
  text2: colors.grey.dark,
  text3: colors.grey.light,
  text4: colors.silver.darker,
  warning: colors.yellow.base,
  shadow: colors.black.darker,
  highlight: colors.blue.base,
  highlight2: colors.blue.lighter,
  highlight3: colors.blue.lightest,
  hoverOpacity: 0.8
}
github DavidWells / analytics / site / gatsby-theme-base / src / utils / colors.js View on Github external
const {colors} = require('@apollo/space-kit')

exports.colors = {
  primary: '#2da5f7',
  //primary: '#56b8fb',
  codePrimary: colors.indigo.dark,
  // primary: colors.indigo.dark,
  secondary: colors.pink.base,
  tertiary: colors.teal.dark,
  divider: colors.silver.dark,
  background: colors.silver.light,
  background2: colors.silver.base,
  text1: colors.black.lighter,
  text2: colors.grey.dark,
  text3: colors.grey.light,
  text4: colors.silver.darker,
  warning: colors.yellow.base,
  shadow: colors.black.darker,
  highlight: colors.blue.base,
  highlight2: colors.blue.lighter,
  highlight3: colors.blue.lightest,
  hoverOpacity: 0.8
}
github DavidWells / analytics / site / gatsby-theme-base / src / utils / colors.js View on Github external
const {colors} = require('@apollo/space-kit')

exports.colors = {
  primary: '#2da5f7',
  //primary: '#56b8fb',
  codePrimary: colors.indigo.dark,
  // primary: colors.indigo.dark,
  secondary: colors.pink.base,
  tertiary: colors.teal.dark,
  divider: colors.silver.dark,
  background: colors.silver.light,
  background2: colors.silver.base,
  text1: colors.black.lighter,
  text2: colors.grey.dark,
  text3: colors.grey.light,
  text4: colors.silver.darker,
  warning: colors.yellow.base,
  shadow: colors.black.darker,
  highlight: colors.blue.base,
  highlight2: colors.blue.lighter,
  highlight3: colors.blue.lightest,
  hoverOpacity: 0.8
}
github DavidWells / analytics / site / gatsby-theme-base / src / utils / colors.js View on Github external
const {colors} = require('@apollo/space-kit')

exports.colors = {
  primary: '#2da5f7',
  //primary: '#56b8fb',
  codePrimary: colors.indigo.dark,
  // primary: colors.indigo.dark,
  secondary: colors.pink.base,
  tertiary: colors.teal.dark,
  divider: colors.silver.dark,
  background: colors.silver.light,
  background2: colors.silver.base,
  text1: colors.black.lighter,
  text2: colors.grey.dark,
  text3: colors.grey.light,
  text4: colors.silver.darker,
  warning: colors.yellow.base,
  shadow: colors.black.darker,
  highlight: colors.blue.base,
  highlight2: colors.blue.lighter,
  highlight3: colors.blue.lightest,
  hoverOpacity: 0.8
github DavidWells / analytics / site / gatsby-theme-base / src / utils / colors.js View on Github external
const {colors} = require('@apollo/space-kit')

exports.colors = {
  primary: '#2da5f7',
  //primary: '#56b8fb',
  codePrimary: colors.indigo.dark,
  // primary: colors.indigo.dark,
  secondary: colors.pink.base,
  tertiary: colors.teal.dark,
  divider: colors.silver.dark,
  background: colors.silver.light,
  background2: colors.silver.base,
  text1: colors.black.lighter,
  text2: colors.grey.dark,
  text3: colors.grey.light,
  text4: colors.silver.darker,
  warning: colors.yellow.base,
  shadow: colors.black.darker,
  highlight: colors.blue.base,
  highlight2: colors.blue.lighter,
  highlight3: colors.blue.lightest,
  hoverOpacity: 0.8
}

@apollo/space-kit

Home base for Apollo's design system

GitHub
MIT
Latest version published 3 years ago

Package Health Score

53 / 100
Full package analysis

Popular @apollo/space-kit functions

Similar packages