import * as React from "react";
import { storiesOf } from "@storybook/react";
import Story from "../../storybook-components/Story";
import { THEME } from "../../types";
import { Flex } from "../Flex";
import { AptibleLogo } from "./AptibleLogo";

const stories = storiesOf("Components/Logos/Aptible Logo", module);

stories.add("Default", () => (
  <Story title="AptibleLogo">
    <Story title="Aptible Logo">
      <Flex className="justify-center bg-gray-900 p-12">
        <AptibleLogo height={40} />
      </Flex>

      <Flex className="justify-center bg-white p-12">
        <AptibleLogo height={40} theme={THEME.PRODUCT} />
      </Flex>
    </Story>
  </Story>
));