UNPKG

10.8 kBJavaScriptView Raw
1'use strict';
2
3Object.defineProperty(exports, "__esModule", {
4 value: true
5});
6exports.COMPOSITION = exports.TEXTAREA = exports.CHECKBOX = exports.SELECTMANY = exports.CONTAINER = exports.SELECTONE = exports.TEXTINPUT = exports.ERROR = exports.GROUP = undefined;
7
8var _taggedTemplateLiteral2 = require('babel-runtime/helpers/taggedTemplateLiteral');
9
10var _taggedTemplateLiteral3 = _interopRequireDefault(_taggedTemplateLiteral2);
11
12var _templateObject = (0, _taggedTemplateLiteral3.default)(['\n font-family: \'PT Sans\', sans serif;\n'], ['\n font-family: \'PT Sans\', sans serif;\n']),
13 _templateObject2 = (0, _taggedTemplateLiteral3.default)(['\n position: absolute;\n bottom: -2.25rem;\n right: 0.5rem;\n'], ['\n position: absolute;\n bottom: -2.25rem;\n right: 0.5rem;\n']),
14 _templateObject3 = (0, _taggedTemplateLiteral3.default)(['\n display: flex;\n flex-direction: column;\n align-items: center;\n margin-bottom: 0;\n'], ['\n display: flex;\n flex-direction: column;\n align-items: center;\n margin-bottom: 0;\n']),
15 _templateObject4 = (0, _taggedTemplateLiteral3.default)(['\n display: flex;\n flex-direction: column;\n margin-bottom: 3.5rem;\n position: relative;\n width: 25.5rem;\n'], ['\n display: flex;\n flex-direction: column;\n margin-bottom: 3.5rem;\n position: relative;\n width: 25.5rem;\n']),
16 _templateObject5 = (0, _taggedTemplateLiteral3.default)([''], ['']),
17 _templateObject6 = (0, _taggedTemplateLiteral3.default)(['\n height: 20rem;\n '], ['\n height: 20rem;\n ']),
18 _templateObject7 = (0, _taggedTemplateLiteral3.default)(['\n width: 5rem;\n border: none;\n text-align: ', ';\n :focus {\n outline: none;\n }\n '], ['\n width: 5rem;\n border: none;\n text-align: ', ';\n :focus {\n outline: none;\n }\n ']),
19 _templateObject8 = (0, _taggedTemplateLiteral3.default)(['\n width: auto;\n '], ['\n width: auto;\n ']),
20 _templateObject9 = (0, _taggedTemplateLiteral3.default)(['\n display: flex;\n align-items: center;\n background: #e7e7e7;\n margin: ', ';\n padding: ', ';\n justify-content: ', ';\n width: 8rem;\n '], ['\n display: flex;\n align-items: center;\n background: #e7e7e7;\n margin: ', ';\n padding: ', ';\n justify-content: ', ';\n width: 8rem;\n ']),
21 _templateObject10 = (0, _taggedTemplateLiteral3.default)(['\n z-index: 1;\n '], ['\n z-index: 1;\n ']),
22 _templateObject11 = (0, _taggedTemplateLiteral3.default)(['\n display: flex;\n flex-direction: ', ';\n align-items: center;\n justify-content: space-between;\n '], ['\n display: flex;\n flex-direction: ', ';\n align-items: center;\n justify-content: space-between;\n ']),
23 _templateObject12 = (0, _taggedTemplateLiteral3.default)(['\n min-height: 5rem;\n width: 25.5rem;\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-direction: row;\n '], ['\n min-height: 5rem;\n width: 25.5rem;\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-direction: row;\n ']),
24 _templateObject13 = (0, _taggedTemplateLiteral3.default)(['\n margin-right: 2.25rem;\n margin-bottom: 0.75rem;\n '], ['\n margin-right: 2.25rem;\n margin-bottom: 0.75rem;\n ']),
25 _templateObject14 = (0, _taggedTemplateLiteral3.default)(['\n text-transform: uppercase;\n font-weight: bold;\n font-size: 1.25rem;\n margin-bottom: 1rem;\n margin-left: 1.5rem;\n '], ['\n text-transform: uppercase;\n font-weight: bold;\n font-size: 1.25rem;\n margin-bottom: 1rem;\n margin-left: 1.5rem;\n ']),
26 _templateObject15 = (0, _taggedTemplateLiteral3.default)(['\n font-weight: bold;\n font-size: 1.25rem;\n margin-bottom: 0.75rem;\n '], ['\n font-weight: bold;\n font-size: 1.25rem;\n margin-bottom: 0.75rem;\n ']),
27 _templateObject16 = (0, _taggedTemplateLiteral3.default)(['\n background: none;\n color: #dadada;\n\n padding: 0.75rem 0 0.675rem 0.5rem;\n display: block;\n width: 25.5rem;\n border: none;\n border-radius: 0;\n border-bottom: 1px solid #dadada;\n :valid {\n color: black;\n }\n :focus {\n outline: none;\n }\n'], ['\n background: none;\n color: #dadada;\n\n padding: 0.75rem 0 0.675rem 0.5rem;\n display: block;\n width: 25.5rem;\n border: none;\n border-radius: 0;\n border-bottom: 1px solid #dadada;\n :valid {\n color: black;\n }\n :focus {\n outline: none;\n }\n']),
28 _templateObject17 = (0, _taggedTemplateLiteral3.default)(['\n color: #dadada;\n font-size: 1.5rem;\n font-weight: normal;\n position: absolute;\n pointer-events: none;\n left: 5px;\n top: 10px;\n transition: 300ms ease all;\n ', ':focus ~ &,\n ', ':valid ~ & {\n top: -10px;\n left: 0px;\n font-weight: bold;\n font-size: 1.25rem;\n color: #224233;\n }\n'], ['\n color: #dadada;\n font-size: 1.5rem;\n font-weight: normal;\n position: absolute;\n pointer-events: none;\n left: 5px;\n top: 10px;\n transition: 300ms ease all;\n ', ':focus ~ &,\n ', ':valid ~ & {\n top: -10px;\n left: 0px;\n font-weight: bold;\n font-size: 1.25rem;\n color: #224233;\n }\n']),
29 _templateObject18 = (0, _taggedTemplateLiteral3.default)(['\n position: relative;\n display: flex;\n :before {\n content: \'\';\n height: 2px;\n width: 0rem;\n bottom: 0px;\n position: absolute;\n background: #424242;\n transition: 300ms ease all;\n left: 0%;\n ', ':focus ~ & {\n width: 25.5rem;\n }\n }\n'], ['\n position: relative;\n display: flex;\n :before {\n content: \'\';\n height: 2px;\n width: 0rem;\n bottom: 0px;\n position: absolute;\n background: #424242;\n transition: 300ms ease all;\n left: 0%;\n ', ':focus ~ & {\n width: 25.5rem;\n }\n }\n']),
30 _templateObject19 = (0, _taggedTemplateLiteral3.default)(['\n margin-top: 0.25rem;\n font-size: 1.25rem;\n width: 25.5rem;\n'], ['\n margin-top: 0.25rem;\n font-size: 1.25rem;\n width: 25.5rem;\n']),
31 _templateObject20 = (0, _taggedTemplateLiteral3.default)(['\n border-top: 1rem solid #e5e5e5;\n border-bottom: 1rem solid #e5e5e5;\n padding-top: 1.25rem;\n '], ['\n border-top: 1rem solid #e5e5e5;\n border-bottom: 1rem solid #e5e5e5;\n padding-top: 1.25rem;\n ']),
32 _templateObject21 = (0, _taggedTemplateLiteral3.default)(['\n font-weight: bold;\n font-size: 1.5rem;\n text-align: end;\n text-transform: uppercase;\n margin-bottom: 2rem;\n '], ['\n font-weight: bold;\n font-size: 1.5rem;\n text-align: end;\n text-transform: uppercase;\n margin-bottom: 2rem;\n ']);
33
34var _styledComponents = require('styled-components');
35
36var _styledComponents2 = _interopRequireDefault(_styledComponents);
37
38var _Checkbox = require('./Checkbox');
39
40var _Checkbox2 = _interopRequireDefault(_Checkbox);
41
42function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
43
44var LABEL = _styledComponents2.default.div(_templateObject);
45var ERROR = _styledComponents2.default.div(_templateObject2);
46var CONTAINER = _styledComponents2.default.form(_templateObject3);
47var SOCKET = _styledComponents2.default.div(_templateObject4);
48var TEXTAREA = {
49 SOCKET: (0, _styledComponents2.default)(SOCKET)(_templateObject5),
50 LABEL: (0, _styledComponents2.default)(LABEL)(_templateObject5),
51 INPUT: _styledComponents2.default.textarea(_templateObject6)
52};
53
54var COMPOSITION = {
55 NUMBER_INPUT: _styledComponents2.default.input.attrs({
56 type: 'number'
57 })(_templateObject7, function (_ref) {
58 var isVertical = _ref.isVertical;
59 return isVertical ? 'right' : 'center';
60 }),
61 RANGE_INPUT: _styledComponents2.default.input.attrs(function (_ref2) {
62 var isVertical = _ref2.isVertical;
63 return isVertical ? {
64 orient: 'vertical',
65 type: 'range'
66 } : {
67 orient: 'horizontal',
68 type: 'range'
69 };
70 })(function (_ref3) {
71 var isVertical = _ref3.isVertical;
72 return isVertical ? {
73 WebkitAppearance: 'slider-vertical',
74 writingMode: 'bt-lr',
75 width: '3rem'
76 } : {
77 width: '15rem'
78 };
79 }),
80 SOCKET: (0, _styledComponents2.default)(SOCKET)(_templateObject8),
81 HEAD: (0, _styledComponents2.default)('div')(_templateObject5),
82 LABEL: (0, _styledComponents2.default)(LABEL)(_templateObject9, function (_ref4) {
83 var isVertical = _ref4.isVertical;
84 return isVertical ? '0 0 1rem' : '0 0.75rem 0 0';
85 }, function (_ref5) {
86 var isVertical = _ref5.isVertical;
87 return isVertical ? '0.5rem 0' : '0.5rem 1rem';
88 }, function (_ref6) {
89 var isVertical = _ref6.isVertical;
90 return isVertical ? 'center' : 'flex-start';
91 }),
92 OPTIONS: (0, _styledComponents2.default)('div')(_templateObject10),
93 CURRENT_OPTION: (0, _styledComponents2.default)('div')(_templateObject11, function (_ref7) {
94 var isVertical = _ref7.isVertical;
95 return isVertical ? 'column' : 'row';
96 })
97};
98
99var CHECKBOX = {
100 DESIGN: (0, _styledComponents2.default)('label')(_templateObject5),
101 SOCKET: (0, _styledComponents2.default)(SOCKET)(_templateObject12),
102 LABEL: (0, _styledComponents2.default)(LABEL)(_templateObject13),
103 INPUT: (0, _styledComponents2.default)(_Checkbox2.default)(_templateObject5)
104};
105
106var SELECTONE = {
107 SOCKET: (0, _styledComponents2.default)(SOCKET)(_templateObject5),
108 LABEL: (0, _styledComponents2.default)(LABEL)(_templateObject14),
109 DROPDOWN: (0, _styledComponents2.default)('div')(_templateObject10)
110};
111
112var SELECTMANY = {
113 SOCKET: (0, _styledComponents2.default)(SOCKET)(_templateObject5),
114
115 LABEL: (0, _styledComponents2.default)(LABEL)(_templateObject15),
116 DROPDOWN: (0, _styledComponents2.default)('div')(_templateObject10)
117};
118
119var TEXTINPUT = {};
120
121TEXTINPUT.INPUT = (0, _styledComponents2.default)('input')(_templateObject16);
122TEXTINPUT.SOCKET = (0, _styledComponents2.default)(SOCKET)(_templateObject5);
123TEXTINPUT.LABEL = (0, _styledComponents2.default)(LABEL)(_templateObject17, TEXTINPUT.INPUT, TEXTINPUT.INPUT);
124TEXTINPUT.BAR = (0, _styledComponents2.default)('div')(_templateObject18, TEXTINPUT.INPUT);
125TEXTINPUT.SUBLABEL = (0, _styledComponents2.default)('div')(_templateObject19);
126
127var GROUP = {
128 SOCKET: (0, _styledComponents2.default)(SOCKET)(_templateObject20),
129 LABEL: (0, _styledComponents2.default)(LABEL)(_templateObject21),
130 CHILDREN: (0, _styledComponents2.default)('div')(_templateObject5)
131};
132
133exports.GROUP = GROUP;
134exports.ERROR = ERROR;
135exports.TEXTINPUT = TEXTINPUT;
136exports.SELECTONE = SELECTONE;
137exports.CONTAINER = CONTAINER;
138exports.SELECTMANY = SELECTMANY;
139exports.CHECKBOX = CHECKBOX;
140exports.TEXTAREA = TEXTAREA;
141exports.COMPOSITION = COMPOSITION;
\No newline at end of file