'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _styledComponents = require('styled-components');

var _styledComponents2 = _interopRequireDefault(_styledComponents);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var FormBox = _styledComponents2.default.div.withConfig({ displayName: 'FormBox' }).withConfig({
  displayName: 'FormBox__FormBox'
})(['background: ', ';border: ', ';padding: ', ';max-width: 70vw;width: 100%;margin: auto;'], function (_ref) {
  var theme = _ref.theme;
  return theme.form.bg;
}, function (_ref2) {
  var theme = _ref2.theme;
  return theme.form.border;
}, function (_ref3) {
  var theme = _ref3.theme;
  return theme.padding.large;
});

FormBox.usage = '\n# FormBox\n\nFormBox is the containing box around a standalone form. It more or less just applies a border to make the form stand out from its surroundings.\n\n```\n<FormBox>\n  <Form>\n    <TextInput />\n  </Form>\n</FormBox>\n```\n';

exports.default = FormBox;