alpaca-react-tabtab
Version:
A mobile support, draggable, editable and api based Tab for ReactJS
44 lines (30 loc) • 2.88 kB
JavaScript
Object.defineProperty(exports, "__esModule", {
value: true
});
var _templateObject = _taggedTemplateLiteral(['\n background-color: #fff;\n box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);\n border: 0;\n'], ['\n background-color: #fff;\n box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);\n border: 0;\n']),
_templateObject2 = _taggedTemplateLiteral(['\n color: rgba(238,110,115,0.7);\n transition: color .28s ease;\n border: 0;\n ', '\n &:hover {\n background-color: transparent;\n color: #ee6e73;\n border-bottom: 2px solid #f6b2b5;\n }\n'], ['\n color: rgba(238,110,115,0.7);\n transition: color .28s ease;\n border: 0;\n ', '\n &:hover {\n background-color: transparent;\n color: #ee6e73;\n border-bottom: 2px solid #f6b2b5;\n }\n']),
_templateObject3 = _taggedTemplateLiteral(['\n background-color: transparent;\n border-radius: 0;\n &:hover {\n background-color: #eee;\n }\n'], ['\n background-color: transparent;\n border-radius: 0;\n &:hover {\n background-color: #eee;\n }\n']),
_templateObject4 = _taggedTemplateLiteral(['\n border-left: 1px solid rgba(0,0,0,0.12);\n border-right: 1px solid rgba(0,0,0,0.12);\n border-bottom: 1px solid rgba(0,0,0,0.12);\n padding: 30px 30px;\n transition: box-shadow .25s, -webkit-box-shadow .25s;\n border-radius: 2px;\n'], ['\n border-left: 1px solid rgba(0,0,0,0.12);\n border-right: 1px solid rgba(0,0,0,0.12);\n border-bottom: 1px solid rgba(0,0,0,0.12);\n padding: 30px 30px;\n transition: box-shadow .25s, -webkit-box-shadow .25s;\n border-radius: 2px;\n']);
var _styledComponents = require('styled-components');
var _styledComponents2 = _interopRequireDefault(_styledComponents);
var _ = require('../../');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _taggedTemplateLiteral(strings, raw) { return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
var TabListStyle = _.styled.TabListStyle,
ActionButtonStyle = _.styled.ActionButtonStyle,
TabStyle = _.styled.TabStyle,
PanelStyle = _.styled.PanelStyle;
TabListStyle = (0, _styledComponents2.default)(TabListStyle)(_templateObject);
TabStyle = (0, _styledComponents2.default)(TabStyle)(_templateObject2, function (props) {
return props.active && !props.vertical ? '\n border-bottom: 2px solid #f6b2b5;\n ' : null;
});
ActionButtonStyle = (0, _styledComponents2.default)(ActionButtonStyle)(_templateObject3);
PanelStyle = (0, _styledComponents2.default)(PanelStyle)(_templateObject4);
exports.default = {
TabList: TabListStyle,
ActionButton: ActionButtonStyle,
Tab: TabStyle,
Panel: PanelStyle
};
module.exports = exports['default'];
;