How to use the spectacle/lib/themes/default function in spectacle

c0i: require("../assets/c0i.mov"),
  c1a: require("../assets/c1a.mov"),
  c1i: require("../assets/c1i.mov"),
  c2a: require("../assets/c2a.mov"),
  c2i: require("../assets/c2i.mov"),
  c3a: require("../assets/c3a.mov"),
  c3i: require("../assets/c3i.mov"),
  c4a: require("../assets/c4a.mov"),
  c4i: require("../assets/c4i.mov"),
  c5a: require("../assets/c5a.mov"),
  c5i: require("../assets/c5i.mov")
};

preloader(images);

const theme = createTheme(
  {
    primary: "white",
    // secondary: "#1F2022",
    secondary: "#4A8E58",
    tertiary: "black",
    quartenary: "#CECECE",
    blue: "#3b5998"
  },
  {
    primary: "Montserrat",
    secondary: "Helvetica"
  }
);

const CodeData = {
  webflow: require("raw-loader!../assets/webflow.js.code"),

// Import theme
import createTheme from 'spectacle/lib/themes/default'

// Require CSS
require('normalize.css')
require('spectacle/lib/themes/default/index.css')

const images = {
  logo: require('../assets/apiconf-logo.png'),
  wlogo: require('../assets/apiconf-logo-white.png')
}

preloader(images)

const theme = createTheme({
  primary: 'white',
  secondary: '#1F2022',
  tertiary: '#03A9FC',
  quartenary: '#4E4E4E'
}, {
  primary: 'Montserrat',
  secondary: 'Helvetica'
})

const slideZoom = (children) => {
  return {children}
}
const slide = (children) => {
  return {children}
}

ListItem,
  CodePane,
  Text,
  Link
} from 'spectacle';
import createTheme from 'spectacle/lib/themes/default';
import CodeSlide from 'spectacle-code-slide';
import UncontrolledForm from './Uncontrolled-Form.jsx';

// Require CSS
require('normalize.css');
require('spectacle/lib/themes/default/index.css');

const reactBlue = '#00d8ff';

const theme = createTheme({
  primary: '#222',
  secondary: reactBlue,
  tertiary: 'white',
  quartenary: reactBlue
});

export default class Presentation extends React.Component {
  render() {
    return (

ListItem,
  List,
  Quote,
  Slide,
  Spectacle,
  Text
} from "spectacle";

// Import theme
import createTheme from "spectacle/lib/themes/default";

// Require CSS
require("normalize.css");
require("spectacle/lib/themes/default/index.css");

const theme = createTheme({
  primary: "#ff4081"
});

export default class Presentation extends React.Component {
  render() {
    return (
      
        
          
            
              Async / Await
            
            
              How to avoid callback hell?

// Require CSS
require('normalize.css')
require('spectacle/lib/themes/default/index.css')

const images = {
  alan: require('../assets/alan-kay.jpg'),
  joe: require('../assets/joe-armstrong.jpg'),
  michael: require('../assets/michael-feathers.jpg'),
  qrCode: require('../assets/jsday-2017-oo.png'),
  jsday: require('../assets/jsday.png')
}

preloader(images)

const theme = createTheme({
  primary: 'white',
  secondary: '#1F2022',
  tertiary: '#03A9FC',
  quartenary: '#4E4E4E'
}, {
  primary: 'Montserrat',
  secondary: 'Helvetica'
})

const slideZoom = (children) => {
  return {children}
}
const slide = (children) => {
  return {children}
}

safari: require('../assets/safari.png'),
  svgs: require('../assets/svgs.png'),
  storyshots: require('../assets/storyshots.png'),
};

preloader(images);

const colors = {
  primary: '#191c20',
  secondary: '#F3F4F4',
  tertiary: '#96DBE4',
  quartenary: '#93DAAB',
  dark: '#010207',
};

const theme = createTheme(colors, {
  primary: { name: 'Poppins', googleFont: true, styles: ['400', '600'] },
  secondary: 'Helvetica',
});

const fontSize = {
  large: '3.2em',
  medium: '2.2em',
  small: '1.8em',
};

@Radium
export default class Presentation extends Component {
  render() {
    return (

clientList: require('./assets/client_list.png'),
  hs2: require('./assets/hs2.png'),
  atomicDesign: require('./assets/atomic-design.png'),
  react: require('./assets/react.jpg'),
  storybookLogo: require('./assets/storybook.svg'),
  artsy: require('./assets/artsy.png'),
  uber: require('./assets/uber.png'),
  albumStory: require('./assets/album-story.png'),
  aotyApp: require('./assets/aoty_app.png'),
  storyshotConsole: require('./assets/storyshots.png'),
  snap: require('./assets/snap.png'),
  visual: require('./assets/visual.png'),
  guideGuide: require('./assets/guideguide.png'),
};

const theme = createTheme(
  {
    primary: '#1F2022',
    secondary: 'white',
    tertiary: '#03A9FC',
    quartenary: '#CECECE',
  },
  {
    primary: 'Montserrat',
    secondary: 'Helvetica',
  }
);

const BigList = styled(List)`
  li {
    font-size: 4rem !important;
    margin-bottom: 1.5rem;

require("spectacle/lib/themes/default/index.css");
require("./custom.css");

const slideTransition = ["slide"];
const images = mapValues({
  lifecycle: require("../images/lifecycle.png"),
  progressBarStopped: require("../images/progress-bar-stopped.gif"),
  progressBar: require("../images/progress-bar.gif"),
  redPanda: require("../images/red-panda.jpg"),
  squirrel: require("../images/squirrel.jpg"),
  survivejs: require("../images/survivejs.png")
}, v => v.replace('/', ''));

preloader(images);

const theme = createTheme({
  primary: "white",
  secondary: "black",
  tertiary: "#09b5c4",
  quartenary: "rgba(255, 219, 169, 0.43)"
});

export default class Presentation extends React.Component {
  render() {
    return (
      
        
          
            
              React Performance

step4: require("../assets/step4.png"),
  step5: require("../assets/step5.png"),
  step6: require("../assets/step6.png"),
  benefits: require("../assets/benefits.jpg"),
  challenges: require("../assets/challenges.jpg"),
  madscience: require("../assets/madscience.png"),
  repetitivechanges: require("../assets/repetitivechanges.png"),
  prchaos: require("../assets/prchaos.png"),
  camel1: require("../assets/camel1.jpg"),
  camel2: require("../assets/camel2.jpg"),
  cameluber: require("../assets/cameluber.png")
};

preloader(images);

const theme = createTheme({
  primary: "#4f4f4f",
  secondary: "#fff",
  tertiary: "#03A9FC",
  quartenary: "#CECECE"
}, {
  primary: "Montserrat",
  secondary: "Montserrat"
});

const outputRemote = `Updating origin
remote: Counting objects: 942, done.
remote: Compressing objects: 100% (51/51), done.
remote: Total 942 (delta 34), reused 73 (delta 27), pack-reused 857
Receiving objects: 100% (942/942), 38.10 MiB | 464.00 KiB/s, done.
Resolving deltas: 100% (393/393), done.
From https://link/to/my/repo.git

import createTheme from "spectacle/lib/themes/default";

const initialTheme = createTheme({
	primary: "white",
	secondary: "black",
	tertiary: "#09b5c4",
	quartenary: "rgba(255, 219, 169, 0.43)",
	fifth:"#282c34"
}, {
	primary: { name: "Droid Serif", googleFont: true, styles: [ "400", "700i" ] }
});

export const theme = {
	...initialTheme,
	screen: {
		...initialTheme.screen,
		components: {
			...initialTheme.screen.components,
			code: {