'use strict';

exports.__esModule = true;
exports.masterButton = exports.ingredientButton = exports.ingredientIDField = exports.ingredientContentField = exports.markdownField = exports.recordField = exports.sourceField = exports.previewColumn = exports.mainColumn = undefined;

var _ramda = require('ramda');

var _ramda2 = _interopRequireDefault(_ramda);

var _reactSeeds = require('react-seeds');

var _reactSeeds2 = _interopRequireDefault(_reactSeeds);

var _rgba = require('react-sow/rgba');

var _rgba2 = _interopRequireDefault(_rgba);

var _colors = require('../colors');

var colors = _interopRequireWildcard(_colors);

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }

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

var mainColumn = exports.mainColumn = (0, _reactSeeds2.default)({
	//basis: '49%',
	grow: 0,
	shrink: 0,
	width: 320,
	margin: { left: '0.5%', right: '0.5%' }
	//padding: { top: '1rem' }
});

var previewColumn = exports.previewColumn = function previewColumn(_ref) {
	var destinationDevice = _ref.destinationDevice;
	return {
		zIndex: 1,
		grow: 1,
		shrink: 0,
		basis: 'calc(100vw - 320px)',
		minWidth: 320,
		maxWidth: destinationDevice === 'phone' && 414,
		margin: { right: 5 },
		boxShadow: '0 0 10px ' + _rgba2.default.whiteValue(0, 0.333)
	};
};

var sourceField = exports.sourceField = {
	column: true,
	width: '100%',
	padding: '1rem',
	font: { size: 16 },
	text: { color: colors.source.text },
	background: { color: colors.source.background },
	border: { width: 1, style: 'solid', color: colors.source.border }
};

var recordField = exports.recordField = {
	width: '100%',
	padding: '0.5rem',
	font: { size: 16 },
	//text: { color: colors.light },
	background: { color: colors.lightKeyB },
	border: 'none'
};

var markdownField = exports.markdownField = {
	column: true,
	width: '100%',
	padding: '1rem',
	font: { size: 16 },
	//text: { color: colors.light },
	background: { color: colors.lightKeyB },
	border: { width: 1, style: 'solid', color: colors.light1mid }
};

var ingredientContentField = exports.ingredientContentField = function ingredientContentField(_ref2) {
	var error = _ref2.error;
	return {
		padding: '0.5rem',
		font: { size: 16 },
		text: { align: 'left', color: colors.ingredient.field.text },
		background: { color: error != null ? colors.errorFieldBackground : colors.ingredient.field.background },
		border: { width: 1, style: 'solid', color: colors.ingredient.field.border }
	};
};

var ingredientIDField = exports.ingredientIDField = _ramda2.default.evolve({
	font: _ramda2.default.merge({ weight: 'bold' })
}, ingredientContentField({}));

var ingredientButton = exports.ingredientButton = function ingredientButton(_ref3) {
	var selected = _ref3.selected;

	var buttonColors = colors.ingredient.button[selected ? 'selected' : 'normal'];
	return {
		text: { color: buttonColors.text },
		background: { color: buttonColors.background },
		border: { width: 1, style: 'solid', color: buttonColors.border }
	};
};

var masterButton = exports.masterButton = function masterButton(_ref4) {
	var selected = _ref4.selected;
	return {
		padding: { left: '0.5em', right: '0.5em' },
		text: { color: selected ? colors.lightKeyB : colors.light },
		background: { color: colors.dark }
	};
};