trepur_components 0.2.37 → 0.2.38
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Accordion/index.js +1 -2
- package/dist/components/AlertBar/index.js +8 -14
- package/dist/components/Breadcrumbs/index.js +1 -2
- package/dist/components/BreadcrumbsBordered/index.js +0 -1
- package/dist/components/BreadcrumbsItem/index.js +1 -1
- package/dist/components/Button/index.js +2 -0
- package/dist/components/Card/index.js +53 -26
- package/dist/components/Carousel/index.js +2 -2
- package/dist/components/FyreCard/index.js +7 -7
- package/dist/components/InformationIcon/index.css +5 -0
- package/dist/components/InformationIcon/index.js +8 -3
- package/dist/components/Nav/index.js +2 -2
- package/dist/components/TextAndTitle/index.js +7 -4
- package/dist/components/Tubestops/index.css +8 -8
- package/dist/components/index.css +56 -0
- package/dist/index.js +2 -0
- package/dist/typography/index.js +52 -0
- package/package.json +4 -3
|
@@ -27,9 +27,8 @@ const Accordion = _ref => {
|
|
|
27
27
|
id: id
|
|
28
28
|
}, {
|
|
29
29
|
className: classes
|
|
30
|
-
}), items && items.map(
|
|
30
|
+
}), items && items.map(item => {
|
|
31
31
|
return /*#__PURE__*/_react.default.createElement(_Collapsible.default, {
|
|
32
|
-
key: item.id + '_' + i,
|
|
33
32
|
id: item.id,
|
|
34
33
|
title: item.title,
|
|
35
34
|
subtitle: item.subtitle,
|
|
@@ -1,15 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
require("core-js/modules/es.object.assign.js");
|
|
4
|
-
|
|
5
3
|
Object.defineProperty(exports, "__esModule", {
|
|
6
4
|
value: true
|
|
7
5
|
});
|
|
8
6
|
exports.default = void 0;
|
|
9
7
|
|
|
10
|
-
require("core-js/modules/
|
|
8
|
+
require("core-js/modules/es.object.assign.js");
|
|
11
9
|
|
|
12
|
-
var _react =
|
|
10
|
+
var _react = _interopRequireDefault(require("react"));
|
|
13
11
|
|
|
14
12
|
var _Icon = _interopRequireDefault(require("../Icon"));
|
|
15
13
|
|
|
@@ -17,10 +15,6 @@ require("../index.css");
|
|
|
17
15
|
|
|
18
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
17
|
|
|
20
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
21
|
-
|
|
22
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
23
|
-
|
|
24
18
|
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
25
19
|
|
|
26
20
|
const AlertBar = _ref => {
|
|
@@ -63,15 +57,15 @@ const AlertBar = _ref => {
|
|
|
63
57
|
type: rightIcon,
|
|
64
58
|
onClick: () => closeAlertBar()
|
|
65
59
|
}) : null;
|
|
66
|
-
const
|
|
60
|
+
const styles = {
|
|
67
61
|
'color': textColor
|
|
68
|
-
}
|
|
69
|
-
const
|
|
62
|
+
};
|
|
63
|
+
const leftIconStyles = {
|
|
70
64
|
'color': leftIconColor
|
|
71
|
-
}
|
|
72
|
-
const
|
|
65
|
+
};
|
|
66
|
+
const rightIconStyles = {
|
|
73
67
|
'color': rightIconColor
|
|
74
|
-
}
|
|
68
|
+
};
|
|
75
69
|
return /*#__PURE__*/_react.default.createElement("div", _extends({}, id ? {
|
|
76
70
|
id: id
|
|
77
71
|
} : {
|
|
@@ -25,8 +25,7 @@ const Breadcrumbs = _ref => {
|
|
|
25
25
|
className: classList
|
|
26
26
|
}, links && links.map((link, i) => {
|
|
27
27
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
|
|
28
|
-
className: "flex"
|
|
29
|
-
key: i
|
|
28
|
+
className: "flex"
|
|
30
29
|
}, /*#__PURE__*/_react.default.createElement("li", {
|
|
31
30
|
className: "h-8"
|
|
32
31
|
}, i + 1 >= linksLength ? /*#__PURE__*/_react.default.createElement("p", {
|
|
@@ -77,7 +77,7 @@ const BreadcrumbsItem = _ref => {
|
|
|
77
77
|
setStyles({
|
|
78
78
|
'backgroundColor': bgColor ? bgColor : 'grey',
|
|
79
79
|
'color': textColor ? textColor : 'black',
|
|
80
|
-
'
|
|
80
|
+
'borderColor': borderColor ? borderColor : 'white'
|
|
81
81
|
});
|
|
82
82
|
setHoverStyles({
|
|
83
83
|
'backgroundColor': 'transparent',
|
|
@@ -15,6 +15,8 @@ var _Icon = _interopRequireDefault(require("../Icon"));
|
|
|
15
15
|
|
|
16
16
|
require("../index.css");
|
|
17
17
|
|
|
18
|
+
require("./index.css");
|
|
19
|
+
|
|
18
20
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
21
|
|
|
20
22
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
@@ -17,6 +17,8 @@ require("../index.css");
|
|
|
17
17
|
|
|
18
18
|
var _Video = _interopRequireDefault(require("../Video"));
|
|
19
19
|
|
|
20
|
+
var _classnames = _interopRequireDefault(require("classnames"));
|
|
21
|
+
|
|
20
22
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
21
23
|
|
|
22
24
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
@@ -83,24 +85,46 @@ const Card = _ref => {
|
|
|
83
85
|
} = _ref;
|
|
84
86
|
const [showHoverButtons, setShowHoverButtons] = (0, _react.useState)(false);
|
|
85
87
|
let orderClass = cardImageBelowTitle ? ' order-first ' : '';
|
|
86
|
-
let titleWrapperClass = 'p-3 ';
|
|
87
|
-
titleWrapperClass += orderClass ? orderClass : '';
|
|
88
|
-
let contentWrapperClass = 'px-3 ';
|
|
89
88
|
let btnClass = 'w-full p-3 ';
|
|
90
89
|
let border = cardBordered ? 'border border-grey border-opacity-100 ' : '';
|
|
91
90
|
let cardTitleFont = cardTitleBold ? 'font-bold' : '';
|
|
92
91
|
let cardTitlePosition = cardTitleLeft ? 'text-left ' : cardTitleRight ? 'text-right ' : 'text-center ';
|
|
93
92
|
let roundedImage = cardRounded ? 'rounded-t-2xl ' : '';
|
|
94
93
|
let roundedCard = cardRounded ? 'rounded-2xl ' : '';
|
|
95
|
-
let
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
94
|
+
let contentWrapperClass = 'px-3 order-3';
|
|
95
|
+
const titleWrapperClass = (0, _classnames.default)({
|
|
96
|
+
[orderClass]: orderClass
|
|
97
|
+
}, 'pt-3');
|
|
98
|
+
const cardTitleClasses = (0, _classnames.default)({
|
|
99
|
+
[cardTitleFont]: cardTitleFont
|
|
100
|
+
}, cardTitlePosition, 'font-medium text-md text-grey');
|
|
101
|
+
const cardSubTitleClassList = (0, _classnames.default)({
|
|
102
|
+
[cardSubTitleClass]: cardSubTitleClass
|
|
103
|
+
}, 'font-light text-sm text-grey');
|
|
104
|
+
const cardDescriptionClassList = (0, _classnames.default)({
|
|
105
|
+
[cardDescriptionClass]: cardDescriptionClass
|
|
106
|
+
}, 'font-extraLight text-xs text-light-grey');
|
|
107
|
+
const classList = (0, _classnames.default)({
|
|
108
|
+
[border]: border,
|
|
109
|
+
[roundedCard]: roundedCard,
|
|
110
|
+
[cardClasses]: cardClasses
|
|
111
|
+
}, 'flex flex-col ');
|
|
112
|
+
const imageClassList = (0, _classnames.default)({
|
|
113
|
+
[roundedImage]: !cardImageBelowTitle,
|
|
114
|
+
[cardImageClass]: cardImageClass
|
|
115
|
+
}, ' w-full object-cover h-full ');
|
|
116
|
+
const videoClassList = (0, _classnames.default)({
|
|
117
|
+
[roundedImage]: !cardImageBelowTitle,
|
|
118
|
+
[videoClasses]: videoClasses
|
|
119
|
+
}, ' w-full object-cover h-full ');
|
|
120
|
+
const cardExtraTextClassList = (0, _classnames.default)({
|
|
121
|
+
[cardExtraTextClass]: cardExtraTextClass,
|
|
122
|
+
['pb-4']: !cardHasCta
|
|
123
|
+
}, 'w-full object-cover h-full font-extraLight text-xs text-light-grey');
|
|
124
|
+
const imageWrapperClassList = (0, _classnames.default)({
|
|
125
|
+
[' order-2']: cardImageBelowTitle,
|
|
126
|
+
["".concat(roundedImage, " order-1")]: !cardImageBelowTitle
|
|
127
|
+
}, ' h-64 overflow-hidden object-cover ');
|
|
104
128
|
|
|
105
129
|
const toggleHover = isHovering => {
|
|
106
130
|
onHover && isHovering ? setShowHoverButtons(true) : setShowHoverButtons(false);
|
|
@@ -117,10 +141,10 @@ const Card = _ref => {
|
|
|
117
141
|
}), /*#__PURE__*/_react.default.createElement("div", {
|
|
118
142
|
className: "card-content flex flex-1 flex-col"
|
|
119
143
|
}, mp4File || webmFile || ogvFile ? /*#__PURE__*/_react.default.createElement("div", {
|
|
120
|
-
className:
|
|
144
|
+
className: imageWrapperClassList
|
|
121
145
|
}, /*#__PURE__*/_react.default.createElement(_Video.default, _extends({
|
|
122
146
|
id: videoId,
|
|
123
|
-
classes:
|
|
147
|
+
classes: videoClassList,
|
|
124
148
|
autoPlay: autoPlay,
|
|
125
149
|
muted: muted
|
|
126
150
|
}, poster && {
|
|
@@ -137,25 +161,27 @@ const Card = _ref => {
|
|
|
137
161
|
withControls: withControls,
|
|
138
162
|
withPoster: withPoster
|
|
139
163
|
}))) : cardImage && /*#__PURE__*/_react.default.createElement("div", {
|
|
140
|
-
className:
|
|
164
|
+
className: imageWrapperClassList
|
|
141
165
|
}, /*#__PURE__*/_react.default.createElement("img", {
|
|
142
166
|
className: imageClassList,
|
|
143
167
|
src: cardImage,
|
|
144
168
|
alt: cardAltText
|
|
145
|
-
})), !showHoverButtons ? /*#__PURE__*/_react.default.createElement(
|
|
169
|
+
})), !showHoverButtons ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
|
|
170
|
+
className: cardImageBelowTitle ? 'order-1' : 'order-3'
|
|
171
|
+
}, cardTitle && /*#__PURE__*/_react.default.createElement("div", {
|
|
146
172
|
className: titleWrapperClass
|
|
147
173
|
}, /*#__PURE__*/_react.default.createElement("h1", {
|
|
148
174
|
className: cardTitleClasses
|
|
149
|
-
}, cardTitle)), /*#__PURE__*/_react.default.createElement("div", {
|
|
175
|
+
}, cardTitle))), /*#__PURE__*/_react.default.createElement("div", {
|
|
150
176
|
className: contentWrapperClass
|
|
151
177
|
}, cardSubTitle && /*#__PURE__*/_react.default.createElement("h2", {
|
|
152
|
-
className:
|
|
153
|
-
}, cardSubTitle), cardDescription && /*#__PURE__*/_react.default.createElement("
|
|
154
|
-
className:
|
|
155
|
-
}, cardDescription), cardExtraText && /*#__PURE__*/_react.default.createElement("
|
|
156
|
-
className:
|
|
157
|
-
}, cardExtraText))) : /*#__PURE__*/_react.default.createElement("div",
|
|
158
|
-
className: "flex
|
|
178
|
+
className: cardSubTitleClassList
|
|
179
|
+
}, cardSubTitle), cardDescription && /*#__PURE__*/_react.default.createElement("p", {
|
|
180
|
+
className: cardDescriptionClassList
|
|
181
|
+
}, cardDescription), cardExtraText && /*#__PURE__*/_react.default.createElement("p", {
|
|
182
|
+
className: cardExtraTextClassList
|
|
183
|
+
}, cardExtraText))) : /*#__PURE__*/_react.default.createElement("div", {
|
|
184
|
+
className: "flex p-2 order-last h-24"
|
|
159
185
|
}, /*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
160
186
|
buttonType: "icon",
|
|
161
187
|
buttonUrl: "/",
|
|
@@ -167,10 +193,11 @@ const Card = _ref => {
|
|
|
167
193
|
buttonHoverTextColor: "white",
|
|
168
194
|
buttonHoverBorderColor: "black",
|
|
169
195
|
buttonBordered: true,
|
|
196
|
+
buttonClasses: "mt-8",
|
|
170
197
|
iconSize: 1,
|
|
171
198
|
iconHollow: true
|
|
172
199
|
}), /*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
173
|
-
buttonClasses: "ml-2 w-full",
|
|
200
|
+
buttonClasses: "ml-2 w-full mt-8",
|
|
174
201
|
buttonText: "Add to basket",
|
|
175
202
|
buttonBordered: true,
|
|
176
203
|
buttonRounded: false,
|
|
@@ -178,7 +205,7 @@ const Card = _ref => {
|
|
|
178
205
|
buttonBgColor: "#2f4848",
|
|
179
206
|
buttonBorderColor: "#2f4848",
|
|
180
207
|
buttonTextColor: "white"
|
|
181
|
-
})))
|
|
208
|
+
}))), cardHasCta && /*#__PURE__*/_react.default.createElement("div", {
|
|
182
209
|
className: btnClass
|
|
183
210
|
}, /*#__PURE__*/_react.default.createElement(_Button.default, _extends({
|
|
184
211
|
buttonId: buttonId,
|
|
@@ -79,9 +79,9 @@ const Carousel = _ref => {
|
|
|
79
79
|
centerPadding
|
|
80
80
|
} = _ref;
|
|
81
81
|
const slider = (0, _react.useRef)(null);
|
|
82
|
-
let previousArrowClassList = 'absolute z-10 -left-12
|
|
82
|
+
let previousArrowClassList = 'absolute z-10 -left-12 top-2/4 ';
|
|
83
83
|
previousArrowClassList += previousArrowClasses ? previousArrowClasses : '';
|
|
84
|
-
let nextArrowClassList = 'absolute z-10 -right-12
|
|
84
|
+
let nextArrowClassList = 'absolute z-10 -right-12 top-2/4 ';
|
|
85
85
|
nextArrowClassList += nextArrowClasses ? nextArrowClasses : '';
|
|
86
86
|
|
|
87
87
|
const NextArrow = () => {
|
|
@@ -57,15 +57,15 @@ const FyreCard = _ref => {
|
|
|
57
57
|
})), /*#__PURE__*/_react.default.createElement("div", {
|
|
58
58
|
className: "flex justify-end"
|
|
59
59
|
}, /*#__PURE__*/_react.default.createElement(_Button.default, _extends({
|
|
60
|
-
|
|
60
|
+
buttonText: ctaText,
|
|
61
61
|
buttonType: buttonType,
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
62
|
+
buttonUrl: url,
|
|
63
|
+
buttonBgColor: buttonBgColor,
|
|
64
|
+
buttonTextColor: buttonTextColor,
|
|
65
65
|
borderColor: buttonBorderColor,
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
66
|
+
buttonHoverBgColor: hoverButtonBgColor,
|
|
67
|
+
buttonHoverTextColor: hoverButtonTextColor,
|
|
68
|
+
buttonHoverBorderColor: hoverButtonBorderColor
|
|
69
69
|
}, buttonDesign && {
|
|
70
70
|
buttonDesign: buttonDesign
|
|
71
71
|
})))));
|
|
@@ -15,6 +15,8 @@ var _Icon = _interopRequireDefault(require("../Icon"));
|
|
|
15
15
|
|
|
16
16
|
require("../index.css");
|
|
17
17
|
|
|
18
|
+
require("./index.css");
|
|
19
|
+
|
|
18
20
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
21
|
|
|
20
22
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
@@ -43,7 +45,7 @@ const InformationIcon = _ref => {
|
|
|
43
45
|
let loaded = (0, _react.useRef)(false);
|
|
44
46
|
let imageClassList = 'mx-auto pt-2 ';
|
|
45
47
|
imageClassList += imageClasses ? imageClasses : '';
|
|
46
|
-
let classList = '
|
|
48
|
+
let classList = 'flex flex-col my-6 mx-8 ';
|
|
47
49
|
classList += bordered ? 'border ' : '';
|
|
48
50
|
classList += rounded ? 'rounded-2xl ' : '';
|
|
49
51
|
classList += classes ? classes : '';
|
|
@@ -103,7 +105,10 @@ const InformationIcon = _ref => {
|
|
|
103
105
|
}; //-----------------------------------
|
|
104
106
|
|
|
105
107
|
|
|
106
|
-
return /*#__PURE__*/_react.default.createElement("div",
|
|
108
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
109
|
+
id: "wrapper",
|
|
110
|
+
className: "h-48"
|
|
111
|
+
}, /*#__PURE__*/_react.default.createElement("div", _extends({}, id && {
|
|
107
112
|
id: id
|
|
108
113
|
}, {
|
|
109
114
|
style: styles,
|
|
@@ -119,7 +124,7 @@ const InformationIcon = _ref => {
|
|
|
119
124
|
className: numberClasses
|
|
120
125
|
}, number), /*#__PURE__*/_react.default.createElement("p", {
|
|
121
126
|
className: textClasses
|
|
122
|
-
}, text));
|
|
127
|
+
}, text)));
|
|
123
128
|
};
|
|
124
129
|
|
|
125
130
|
var _default = InformationIcon;
|
|
@@ -140,7 +140,7 @@ const Nav = _ref => {
|
|
|
140
140
|
className: mobileClassList,
|
|
141
141
|
style: {
|
|
142
142
|
'backgroundColor': bgColor,
|
|
143
|
-
'
|
|
143
|
+
'borderColor': borderBottomColor
|
|
144
144
|
}
|
|
145
145
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
146
146
|
id: "nav-collapse-btn-wrapper",
|
|
@@ -184,7 +184,7 @@ const Nav = _ref => {
|
|
|
184
184
|
className: desktopClassList,
|
|
185
185
|
style: {
|
|
186
186
|
'backgroundColor': bgColor,
|
|
187
|
-
'
|
|
187
|
+
'borderColor': borderBottomColor
|
|
188
188
|
}
|
|
189
189
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
190
190
|
className: 'flex ' + firstRowClasses
|
|
@@ -26,15 +26,18 @@ const TextAndTitle = _ref => {
|
|
|
26
26
|
titleBold,
|
|
27
27
|
bgColor,
|
|
28
28
|
textColor,
|
|
29
|
-
titleColor
|
|
29
|
+
titleColor,
|
|
30
|
+
textCenter,
|
|
31
|
+
titleCenter
|
|
30
32
|
} = _ref;
|
|
33
|
+
let classList = classes ? classes : '';
|
|
31
34
|
let titleClassList = 'text-2xl ';
|
|
32
35
|
titleClassList += titleBold ? 'font-bold ' : '';
|
|
36
|
+
titleClassList += titleCenter ? 'text-center ' : '';
|
|
33
37
|
titleClassList += titleClasses ? titleClasses : '';
|
|
34
38
|
let textClassList = '';
|
|
35
|
-
textClassList +=
|
|
36
|
-
|
|
37
|
-
classList += classes ? classes : ''; //---------- Styling ---------------
|
|
39
|
+
textClassList += textCenter ? 'text-center ' : '';
|
|
40
|
+
textClassList += textClasses ? textClasses : ''; //---------- Styling ---------------
|
|
38
41
|
|
|
39
42
|
const textStyles = {
|
|
40
43
|
'backgroundColor': bgColor,
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
.tubestop.flex-col.none-reverse .status-flow-item:not(:first-child):before {
|
|
3
3
|
@apply absolute;
|
|
4
4
|
@apply block;
|
|
5
|
-
|
|
5
|
+
|
|
6
6
|
content: "";
|
|
7
7
|
width: 1px;
|
|
8
8
|
height: 100%;
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
.tubestop.flex-col.none-reverse .status-flow-item:not(:last-child):after {
|
|
14
14
|
@apply absolute;
|
|
15
15
|
@apply block;
|
|
16
|
-
|
|
16
|
+
|
|
17
17
|
content: "";
|
|
18
18
|
width: 1px;
|
|
19
19
|
height: 100%;
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
.tubestop.flex-col.reverse .status-flow-item:not(:first-child):before {
|
|
26
26
|
@apply absolute;
|
|
27
27
|
@apply block;
|
|
28
|
-
|
|
28
|
+
|
|
29
29
|
content: "";
|
|
30
30
|
width: 1px;
|
|
31
31
|
height: 100%;
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
.tubestop.flex-col.reverse .status-flow-item:not(:last-child):after {
|
|
37
37
|
@apply absolute;
|
|
38
38
|
@apply block;
|
|
39
|
-
|
|
39
|
+
|
|
40
40
|
content: "";
|
|
41
41
|
width: 1px;
|
|
42
42
|
height: 100%;
|
|
@@ -48,7 +48,7 @@
|
|
|
48
48
|
.tubestop.flex-row.none-reverse .status-flow-item:not(:first-child):after {
|
|
49
49
|
@apply absolute;
|
|
50
50
|
@apply block;
|
|
51
|
-
|
|
51
|
+
|
|
52
52
|
content: "";
|
|
53
53
|
width: 100%;
|
|
54
54
|
height: 1px;
|
|
@@ -60,7 +60,7 @@
|
|
|
60
60
|
.status-flow-item:not(:first-child):after {
|
|
61
61
|
@apply absolute;
|
|
62
62
|
@apply block;
|
|
63
|
-
|
|
63
|
+
|
|
64
64
|
content: "";
|
|
65
65
|
width: 100%;
|
|
66
66
|
height: 1px;
|
|
@@ -72,7 +72,7 @@
|
|
|
72
72
|
.tubestop.flex-row.reverse .status-flow-item:not(:first-child):after {
|
|
73
73
|
@apply absolute;
|
|
74
74
|
@apply block;
|
|
75
|
-
|
|
75
|
+
|
|
76
76
|
content: "";
|
|
77
77
|
width: 100%;
|
|
78
78
|
height: 1px;
|
|
@@ -83,7 +83,7 @@
|
|
|
83
83
|
.tubestop.flex-row.reverse .status-flow-item:not(:first-child):after {
|
|
84
84
|
@apply absolute;
|
|
85
85
|
@apply block;
|
|
86
|
-
|
|
86
|
+
|
|
87
87
|
content: "";
|
|
88
88
|
width: 100%;
|
|
89
89
|
height: 1px;
|
|
@@ -3,6 +3,62 @@
|
|
|
3
3
|
@tailwind utilities;
|
|
4
4
|
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.0/css/all.min.css");
|
|
5
5
|
|
|
6
|
+
@font-face {
|
|
7
|
+
font-family: "Sora";
|
|
8
|
+
src: url("../../fonts/Sora/static/Sora-Thin.ttf") format("truetype");
|
|
9
|
+
font-weight: 100;
|
|
10
|
+
font-style: normal;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
@font-face {
|
|
14
|
+
font-family: "Sora";
|
|
15
|
+
src: url("../../fonts/Sora/static/Sora-ExtraLight.ttf") format("truetype");
|
|
16
|
+
font-weight: 200;
|
|
17
|
+
font-style: normal;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
@font-face {
|
|
21
|
+
font-family: "Sora";
|
|
22
|
+
src: url("../../fonts/Sora/static/Sora-Light.ttf") format("truetype");
|
|
23
|
+
font-weight: 300;
|
|
24
|
+
font-style: normal;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
@font-face {
|
|
28
|
+
font-family: "Sora";
|
|
29
|
+
src: url("../../fonts/Sora/static/Sora-Regular.ttf") format("truetype");
|
|
30
|
+
font-weight: 400;
|
|
31
|
+
font-style: normal;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
@font-face {
|
|
35
|
+
font-family: "Sora";
|
|
36
|
+
src: url("../../fonts/Sora/static/Sora-Medium.ttf") format("truetype");
|
|
37
|
+
font-weight: 500;
|
|
38
|
+
font-style: normal;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
@font-face {
|
|
42
|
+
font-family: "Sora";
|
|
43
|
+
src: url("../../fonts/Sora/static/Sora-SemiBold.ttf") format("truetype");
|
|
44
|
+
font-weight: 600;
|
|
45
|
+
font-style: normal;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
@font-face {
|
|
49
|
+
font-family: "Sora";
|
|
50
|
+
src: url("../../fonts/Sora/static/Sora-Bold.ttf") format("truetype");
|
|
51
|
+
font-weight: 700;
|
|
52
|
+
font-style: normal;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
@font-face {
|
|
56
|
+
font-family: "Sora";
|
|
57
|
+
src: url("../../fonts/Sora/static/Sora-ExtraBold.ttf") format("truetype");
|
|
58
|
+
font-weight: 800;
|
|
59
|
+
font-style: normal;
|
|
60
|
+
}
|
|
61
|
+
|
|
6
62
|
.slick-track {
|
|
7
63
|
display: flex !important;
|
|
8
64
|
}
|
package/dist/index.js
CHANGED
|
@@ -284,4 +284,6 @@ var _UserIcon = _interopRequireDefault(require("./components/UserIcon"));
|
|
|
284
284
|
|
|
285
285
|
var _Video = _interopRequireDefault(require("./components/Video"));
|
|
286
286
|
|
|
287
|
+
require("../fonts/Sora/static/Sora-Bold.ttf");
|
|
288
|
+
|
|
287
289
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
require("../components/index.css");
|
|
11
|
+
|
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
+
|
|
14
|
+
const Fonts = _ref => {
|
|
15
|
+
let {} = _ref;
|
|
16
|
+
return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("p", {
|
|
17
|
+
className: "font-regular text-xs"
|
|
18
|
+
}, "This text is xs"), /*#__PURE__*/_react.default.createElement("p", {
|
|
19
|
+
className: "font-regular text-sm"
|
|
20
|
+
}, "This text is sm"), /*#__PURE__*/_react.default.createElement("p", {
|
|
21
|
+
className: "font-regular text-md"
|
|
22
|
+
}, "This text is md"), /*#__PURE__*/_react.default.createElement("p", {
|
|
23
|
+
className: "font-regular text-lg"
|
|
24
|
+
}, "This text is lg"), /*#__PURE__*/_react.default.createElement("p", {
|
|
25
|
+
className: "font-regular text-xl"
|
|
26
|
+
}, "This text is xl"), /*#__PURE__*/_react.default.createElement("p", {
|
|
27
|
+
className: "font-regular text-2xl"
|
|
28
|
+
}, "This text is 2xl"), /*#__PURE__*/_react.default.createElement("p", {
|
|
29
|
+
className: "font-regular text-3xl"
|
|
30
|
+
}, "This text is 3xl"), /*#__PURE__*/_react.default.createElement("p", {
|
|
31
|
+
className: "font-regular text-4xl"
|
|
32
|
+
}, "This text is 4xl"), /*#__PURE__*/_react.default.createElement("p", {
|
|
33
|
+
className: "text-md font-thin"
|
|
34
|
+
}, "This font is thin"), /*#__PURE__*/_react.default.createElement("p", {
|
|
35
|
+
className: "text-md font-extraLight"
|
|
36
|
+
}, "This font is extra light"), /*#__PURE__*/_react.default.createElement("p", {
|
|
37
|
+
className: "text-md font-light"
|
|
38
|
+
}, "This font is light"), /*#__PURE__*/_react.default.createElement("p", {
|
|
39
|
+
className: "text-md font-regular"
|
|
40
|
+
}, "This font is regular"), /*#__PURE__*/_react.default.createElement("p", {
|
|
41
|
+
className: "text-md font-medium"
|
|
42
|
+
}, "This font is medium"), /*#__PURE__*/_react.default.createElement("p", {
|
|
43
|
+
className: "text-md font-semiBold"
|
|
44
|
+
}, "This font is semi bold"), /*#__PURE__*/_react.default.createElement("p", {
|
|
45
|
+
className: "text-md font-bold"
|
|
46
|
+
}, "This font is bold"), /*#__PURE__*/_react.default.createElement("p", {
|
|
47
|
+
className: "text-md font-extraBold"
|
|
48
|
+
}, "This font is extra bold"));
|
|
49
|
+
};
|
|
50
|
+
|
|
51
|
+
var _default = Fonts;
|
|
52
|
+
exports.default = _default;
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "trepur_components",
|
|
3
3
|
"description": "component lib",
|
|
4
4
|
"author": "trepur_ttenneb",
|
|
5
|
-
"version": "0.2.
|
|
5
|
+
"version": "0.2.38",
|
|
6
6
|
"private": false,
|
|
7
7
|
"keywords": [
|
|
8
8
|
"react",
|
|
@@ -20,8 +20,9 @@
|
|
|
20
20
|
"@testing-library/jest-dom": "^5.16.2",
|
|
21
21
|
"@testing-library/react": "^12.1.3",
|
|
22
22
|
"@testing-library/user-event": "^13.5.0",
|
|
23
|
-
"
|
|
24
|
-
"react
|
|
23
|
+
"classnames": "^2.3.1",
|
|
24
|
+
"react": "^18.1.0",
|
|
25
|
+
"react-dom": "^18.1.0",
|
|
25
26
|
"react-scripts": "5.0.0",
|
|
26
27
|
"react-slick": "^0.28.1",
|
|
27
28
|
"slick-carousel": "^1.8.1",
|