sccoreui 6.2.69 → 6.2.71

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.
Files changed (87) hide show
  1. package/dist/App.js +1 -1
  2. package/dist/assets/sccoreui.css +292 -291
  3. package/dist/components/ag-grid/parent-for-grid.js +9 -8
  4. package/dist/components/formula-template/FormulaCoponent.js +7 -1
  5. package/dist/components/list-box-dropdown/list-box-dropdown.js +1 -1
  6. package/dist/directives/svg-icons.js +9 -0
  7. package/package.json +1 -1
  8. package/dist/assets/assets/App.css +0 -96
  9. package/dist/assets/assets/App.css.map +0 -1
  10. package/dist/assets/assets/App.scss +0 -130
  11. package/dist/assets/assets/flex.css +0 -21652
  12. package/dist/assets/assets/fonts/Lato-Black.ttf +0 -0
  13. package/dist/assets/assets/fonts/Lato-Bold.ttf +0 -0
  14. package/dist/assets/assets/fonts/Lato-Light.ttf +0 -0
  15. package/dist/assets/assets/fonts/Lato-Regular.ttf +0 -0
  16. package/dist/assets/assets/fonts/Lato-Thin.ttf +0 -0
  17. package/dist/assets/assets/fonts/Roboto-Bold.ttf +0 -0
  18. package/dist/assets/assets/fonts/Roboto-Italic.ttf +0 -0
  19. package/dist/assets/assets/fonts/Roboto-Medium.ttf +0 -0
  20. package/dist/assets/assets/fonts/Roboto-Regular.ttf +0 -0
  21. package/dist/assets/assets/fonts/primeicons.eot +0 -0
  22. package/dist/assets/assets/fonts/primeicons.svg +0 -292
  23. package/dist/assets/assets/fonts/primeicons.ttf +0 -0
  24. package/dist/assets/assets/fonts/primeicons.woff +0 -0
  25. package/dist/assets/assets/fonts/primeicons.woff2 +0 -0
  26. package/dist/assets/assets/images/Payment-method-apple-card.png +0 -0
  27. package/dist/assets/assets/images/Payment-method-card-white.png +0 -0
  28. package/dist/assets/assets/images/Payment-method-master-card.png +0 -0
  29. package/dist/assets/assets/images/avatar.png +0 -0
  30. package/dist/assets/assets/images/avatar1.png +0 -0
  31. package/dist/assets/assets/images/avatar2.png +0 -0
  32. package/dist/assets/assets/images/avatar3.png +0 -0
  33. package/dist/assets/assets/images/avatar4.png +0 -0
  34. package/dist/assets/assets/images/avatar5.png +0 -0
  35. package/dist/assets/assets/images/avatar6.png +0 -0
  36. package/dist/assets/assets/images/avatar7.png +0 -0
  37. package/dist/assets/assets/images/avatar8.png +0 -0
  38. package/dist/assets/assets/images/avatar9.png +0 -0
  39. package/dist/assets/assets/images/company.png +0 -0
  40. package/dist/assets/assets/images/company1.png +0 -0
  41. package/dist/assets/assets/images/company2.png +0 -0
  42. package/dist/assets/assets/images/company3.png +0 -0
  43. package/dist/assets/assets/images/company4.png +0 -0
  44. package/dist/assets/assets/images/company5.png +0 -0
  45. package/dist/assets/assets/images/company6.png +0 -0
  46. package/dist/assets/assets/images/demoImage.png +0 -0
  47. package/dist/assets/assets/images/drag-and-drop-icon.png +0 -0
  48. package/dist/assets/assets/images/drag.svg +0 -8
  49. package/dist/assets/assets/images/empty-state-icon.svg +0 -53
  50. package/dist/assets/assets/images/label-image.png +0 -0
  51. package/dist/assets/assets/images/profile-square-image.png +0 -0
  52. package/dist/assets/assets/png/checkbox_fill_icon.png +0 -0
  53. package/dist/assets/assets/png/checkbox_minus_icon.png +0 -0
  54. package/dist/assets/assets/png/checkbox_outline_icon.png +0 -0
  55. package/dist/assets/assets/png/salseforce-img.png +0 -0
  56. package/dist/assets/assets/sccoreicons.css +0 -1105
  57. package/dist/assets/assets/sccoreui.css +0 -8930
  58. package/dist/assets/assets/svg/add.svg +0 -3
  59. package/dist/assets/assets/svg/back-button.svg +0 -3
  60. package/dist/assets/assets/svg/check-white.svg +0 -3
  61. package/dist/assets/assets/svg/check.svg +0 -3
  62. package/dist/assets/assets/svg/check2.svg +0 -3
  63. package/dist/assets/assets/svg/close.svg +0 -3
  64. package/dist/assets/assets/svg/delete.svg +0 -3
  65. package/dist/assets/assets/svg/done_all.svg +0 -3
  66. package/dist/assets/assets/svg/dot_list.svg +0 -3
  67. package/dist/assets/assets/svg/down_arrow.svg +0 -3
  68. package/dist/assets/assets/svg/drag.svg +0 -8
  69. package/dist/assets/assets/svg/edit.svg +0 -3
  70. package/dist/assets/assets/svg/gallery.svg +0 -3
  71. package/dist/assets/assets/svg/heading1.svg +0 -3
  72. package/dist/assets/assets/svg/heading2.svg +0 -3
  73. package/dist/assets/assets/svg/hyphen.svg +0 -3
  74. package/dist/assets/assets/svg/info.svg +0 -3
  75. package/dist/assets/assets/svg/input-info.svg +0 -0
  76. package/dist/assets/assets/svg/italic.svg +0 -3
  77. package/dist/assets/assets/svg/link.svg +0 -3
  78. package/dist/assets/assets/svg/message-info.svg +0 -3
  79. package/dist/assets/assets/svg/number_list.svg +0 -3
  80. package/dist/assets/assets/svg/payment_method.svg +0 -7
  81. package/dist/assets/assets/svg/quotes.svg +0 -3
  82. package/dist/assets/assets/svg/remove.svg +0 -3
  83. package/dist/assets/assets/svg/sort-down-arrow.svg +0 -3
  84. package/dist/assets/assets/svg/sort-up-arrow.svg +0 -8
  85. package/dist/assets/assets/svg/svg.js +0 -176
  86. package/dist/assets/assets/svg/user.svg +0 -3
  87. package/dist/assets/assets/theme.css +0 -6459
@@ -117,11 +117,12 @@ function ParentForGrid(props) {
117
117
  };
118
118
  // Callback to products for getting data
119
119
  const getData = (startRow, endRow, currentFeatures, params) => tslib_1.__awaiter(this, void 0, void 0, function* () {
120
+ var _r, _s;
120
121
  if (!(props === null || props === void 0 ? void 0 : props.getRowData)) {
121
122
  return emptyResponse; // If callback function to get row data is not provided
122
123
  }
123
124
  if (props.rowModelType !== constants_1.ROWMODELTYPE.SERVER_SIDE) {
124
- gridRef.current.api.showLoadingOverlay();
125
+ (_s = (_r = gridRef === null || gridRef === void 0 ? void 0 : gridRef.current) === null || _r === void 0 ? void 0 : _r.api) === null || _s === void 0 ? void 0 : _s.showLoadingOverlay();
125
126
  }
126
127
  const response = yield (props === null || props === void 0 ? void 0 : props.getRowData(startRow, endRow, currentFeatures, params));
127
128
  setGridData(Object.assign(Object.assign({}, gridData), { rowData: [] }));
@@ -143,7 +144,7 @@ function ParentForGrid(props) {
143
144
  });
144
145
  // Gets call onLoad,scroll and whenever any featureDetails changed
145
146
  const onGridReady = (params, updatedFeatures) => tslib_1.__awaiter(this, void 0, void 0, function* () {
146
- var _r, _s;
147
+ var _t, _u;
147
148
  params && setApi(params === null || params === void 0 ? void 0 : params.api);
148
149
  setGridReadyEvent(params);
149
150
  let currentFeatures = updatedFeatures;
@@ -156,21 +157,21 @@ function ParentForGrid(props) {
156
157
  if (result.rowData) {
157
158
  setGridData(Object.assign(Object.assign({}, gridData), { rowData: result.rowData }));
158
159
  gridRef.current.api.hideOverlay();
159
- (_r = params === null || params === void 0 ? void 0 : params.api) === null || _r === void 0 ? void 0 : _r.applyTransaction({ add: result.rowData });
160
+ (_t = params === null || params === void 0 ? void 0 : params.api) === null || _t === void 0 ? void 0 : _t.applyTransaction({ add: result.rowData });
160
161
  }
161
162
  else {
162
- (_s = params === null || params === void 0 ? void 0 : params.api) === null || _s === void 0 ? void 0 : _s.applyTransaction({ add: [] });
163
+ (_u = params === null || params === void 0 ? void 0 : params.api) === null || _u === void 0 ? void 0 : _u.applyTransaction({ add: [] });
163
164
  }
164
165
  }
165
166
  else if (props.rowModelType === constants_1.ROWMODELTYPE.SERVER_SIDE) {
166
167
  const dataSource = {
167
168
  getRows: (params) => tslib_1.__awaiter(this, void 0, void 0, function* () {
168
- var _t, _u, _v;
169
+ var _v, _w, _x;
169
170
  const startRow = params.request.startRow;
170
171
  const endRow = params.request.endRow;
171
172
  // Scroll should not exit MAX_RECORDS_TO_LOAD
172
173
  if (endRow > maxLength && maxLength > 0) {
173
- (_t = gridRef === null || gridRef === void 0 ? void 0 : gridRef.current.api) === null || _t === void 0 ? void 0 : _t.hideOverlay();
174
+ (_v = gridRef === null || gridRef === void 0 ? void 0 : gridRef.current.api) === null || _v === void 0 ? void 0 : _v.hideOverlay();
174
175
  // supply rows for requested block to grid
175
176
  params.success({
176
177
  rowData: gridData.rowData,
@@ -181,7 +182,7 @@ function ParentForGrid(props) {
181
182
  // get data for request from our fake server
182
183
  const response = yield getData(startRow, endRow, currentFeatures, params);
183
184
  // simulating real server call with a 500ms delay
184
- if (((_u = response.rowData) === null || _u === void 0 ? void 0 : _u.length) > 0) {
185
+ if (((_w = response.rowData) === null || _w === void 0 ? void 0 : _w.length) > 0) {
185
186
  setGridData(Object.assign(Object.assign({}, gridData), { rowData: response.rowData }));
186
187
  gridRef.current.api.hideOverlay();
187
188
  // supply rows for requested block to grid
@@ -191,7 +192,7 @@ function ParentForGrid(props) {
191
192
  else {
192
193
  // params.fail();
193
194
  const gridRows = startRow >= constants_1.BLOCK_SIZE ? gridData.rowData : [];
194
- if (!((_v = params === null || params === void 0 ? void 0 : params.parentNode) === null || _v === void 0 ? void 0 : _v.id))
195
+ if (!((_x = params === null || params === void 0 ? void 0 : params.parentNode) === null || _x === void 0 ? void 0 : _x.id))
195
196
  gridRef.current.api.showNoRowsOverlay();
196
197
  params.success({ rowData: gridRows });
197
198
  return;
@@ -493,7 +493,13 @@ const FormulaComponent = (props) => {
493
493
  }
494
494
  case "INCREASE_BY_PERCENTAGE":
495
495
  case "DECREASE_BY_PERCENTAGE": {
496
- return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "w-6 relative" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "absolute left-0 h-full flex align-items-center px-2" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "percent-01", size: 16, color: "#344054" }) })), (0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, Object.assign({ useGrouping: false, min: 0, max: 99, minFractionDigits: 2, maxFractionDigits: 2, maxLength: (props === null || props === void 0 ? void 0 : props.maxLength) || Infinity }, props === null || props === void 0 ? void 0 : props.field, { onValueChange: (e) => (props === null || props === void 0 ? void 0 : props.onChange) && (props === null || props === void 0 ? void 0 : props.onChange(e)), placeholder: "Enter Number", value: props === null || props === void 0 ? void 0 : props.inputValue, className: "border-none w-full", inputClassName: "border-none pl-8 focus:shadow-none" }))] })));
496
+ return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "w-6 relative" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "absolute left-0 h-full flex align-items-center px-2" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "percent-01", size: 16, color: "#344054" }) })), (0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, Object.assign({ useGrouping: false, min: 0, max: 100, minFractionDigits: 2, maxFractionDigits: 2, maxLength: (props === null || props === void 0 ? void 0 : props.maxLength) || Infinity }, props === null || props === void 0 ? void 0 : props.field, { onChange: (e) => {
497
+ const value = e.value > 100 ? 100 : e.value;
498
+ e.originalEvent.target.value = value
499
+ ? value === null || value === void 0 ? void 0 : value.toFixed(2)
500
+ : 0;
501
+ console.log(e.value + "onCHange");
502
+ }, onValueChange: (e) => (props === null || props === void 0 ? void 0 : props.onChange) && (props === null || props === void 0 ? void 0 : props.onChange(e)), placeholder: "Enter Number", value: props === null || props === void 0 ? void 0 : props.inputValue, className: "border-none w-full", inputClassName: "border-none pl-8 focus:shadow-none" }))] })));
497
503
  }
498
504
  case "MANUAL": {
499
505
  return ((0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, Object.assign({ useGrouping: false, min: 0, minFractionDigits: 2, maxFractionDigits: 2, maxLength: (props === null || props === void 0 ? void 0 : props.maxLength) || Infinity }, props === null || props === void 0 ? void 0 : props.field, { onValueChange: (e) => (props === null || props === void 0 ? void 0 : props.onChange) && (props === null || props === void 0 ? void 0 : props.onChange(e)), placeholder: "Enter Number", value: props === null || props === void 0 ? void 0 : props.inputValue, className: "border-none w-6", inputClassName: "border-none focus:shadow-none" })));
@@ -113,7 +113,7 @@ onChange, footeTemplate, headerTemplate, labelIcon, labelIconPos, label, labelIc
113
113
  },
114
114
  ] }), !showChips ? ((0, jsx_runtime_1.jsx)(button_1.Button, { type: "button", className: `list_box_button focus:shadow-none p-0 h-max h-auto p-0 mx-2 ${buttonClassName}`, link: link ? true : false, icon: labelIcon ? labelIcon : "", size: labelIconSize ? labelIconSize : "", iconPos: labelIconPos ? labelIconPos : "", label: label, onClick: (event) => optionsMenuRef.current.toggle(event) })) : ((0, jsx_runtime_1.jsxs)("ul", Object.assign({ className: `pl-0 grid row-gap-2 list_box_chips ${chipsParentClassName}` }, { children: [(0, jsx_runtime_1.jsx)("li", Object.assign({ className: `cursor-pointer min-w-max mx-2 max-w-max ${buttonClassName}` }, { children: (0, jsx_runtime_1.jsx)(button_1.Button, { type: "button",
115
115
  // className={`list_box_button focus:shadow-none p-0 h-max h-auto mx-2`}
116
- link: link ? true : false, icon: labelIcon ? labelIcon : "", size: labelIconSize ? labelIconSize : "", iconPos: labelIconPos ? labelIconPos : "", label: label, onClick: (event) => optionsMenuRef.current.toggle(event), "aria-controls": "popup_menu_right", "aria-haspopup": true, ref: buttonRef }) })), selectedItems &&
116
+ link: link ? true : false, icon: labelIcon ? labelIcon : "", size: labelIconSize ? labelIconSize : "", iconPos: labelIconPos ? labelIconPos : "", label: label, onClick: (event) => optionsMenuRef.current.toggle(event), "aria-controls": "popup_menu_right", "aria-haspopup": true, ref: buttonRef, className: "btn-text-primary" }) })), selectedItems &&
117
117
  (selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.map((item, index) => {
118
118
  var _a, _b;
119
119
  return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isDraggable !== undefined ? ((0, jsx_runtime_1.jsx)("li", Object.assign({ draggable: isDraggable, onDragStart: (e) => handleDragStart(e, index), onDragOver: (e) => handleDragOver(e), onDrop: (e) => handleDrop(e, index), className: `${chipClassName ? chipClassName : ""} cursor-pointer min-w-max mx-2 max-w-max p-1 flex align-items-center bg-gray-50 text-gray-700 text-base border-1 border-gray-300 border-round-lg ${showRemoveIcon ? "pr-6 relative" : ""}` }, { children: chipTemplate ? (chipTemplate(item)) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { children: [" ", typeof item === "object"
@@ -9080,6 +9080,15 @@ exports.iconList = [
9080
9080
  svg: `<svg xmlns="http://www.w3.org/2000/svg" width="14" height="13" viewBox="0 0 14 13" fill="none">
9081
9081
  <path d="M11.1654 3.375L5.4362 9.10417L2.83203 6.5" stroke="white" stroke-width="2.08333" stroke-linecap="round" stroke-linejoin="round"/>
9082
9082
  </svg>`,
9083
+ },
9084
+ {
9085
+ name: "verified-check-circle",
9086
+ svg: `<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
9087
+ <rect x="0.625" y="0.625" width="18.75" height="18.75" rx="9.375" fill="#132067"/>
9088
+ <rect x="0.625" y="0.625" width="18.75" height="18.75" rx="9.375" stroke="#132067" stroke-width="1.25"/>
9089
+ <path d="M14.1615 6.875L8.43229 12.6042L5.82812 10" stroke="white" stroke-width="2.08333" stroke-linecap="round" stroke-linejoin="round"/>
9090
+ </svg>
9091
+ `,
9083
9092
  },
9084
9093
  {
9085
9094
  name: "drag-and-drop",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sccoreui",
3
- "version": "6.2.69",
3
+ "version": "6.2.71",
4
4
  "description": "ui-sccore",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.js",
@@ -1,96 +0,0 @@
1
- @import url("./assets/theme.css");
2
- @import url("./assets/sccoreui.css");
3
- @import url("./assets/sccoreicons.css");
4
- @import url("./assets/flex.css");
5
- @import url("https://fonts.googleapis.com/css2?family=Lato:wght@100;300;400;700;900&display=swap");
6
- :root {
7
- --fw-600: 600;
8
- --fw-400: 400;
9
- --fs-24: 24px;
10
- --fs-18: 18px;
11
- --fs-16: 16px;
12
- --lh: 24px;
13
- --fs-14: 14px;
14
- --grey-bg: #101828;
15
- --border-none: border-none;
16
- }
17
-
18
- body {
19
- font-family: "Lato", sans-serif;
20
- -webkit-font-smoothing: antialiased;
21
- -moz-osx-font-smoothing: grayscale;
22
- line-height: var(--lh);
23
- padding: 0;
24
- margin: 0;
25
- }
26
-
27
- code {
28
- font-family: "Lato", sans-serif;
29
- }
30
-
31
- h1 {
32
- font-size: var(--fs-24);
33
- font-weight: var(--fw-600);
34
- }
35
-
36
- h2 {
37
- font-size: var(--fs-18);
38
- font-weight: var(--fw-600);
39
- }
40
-
41
- h3 {
42
- font-size: var(--fs-16);
43
- font-weight: var(--fw-400);
44
- }
45
-
46
- .progress-container {
47
- isolation: isolate;
48
- }
49
- .progress-container::before {
50
- content: "";
51
- background-color: var(--gray-200);
52
- position: absolute;
53
- z-index: -1;
54
- }
55
- .progress-container.horizontal::before {
56
- height: 2px;
57
- width: 100%;
58
- top: 11%;
59
- }
60
- .progress-container.vertical::before {
61
- height: 100%;
62
- width: 2px;
63
- left: 5%;
64
- top: 0;
65
- }
66
-
67
- .progressbar {
68
- z-index: -1;
69
- transition: all 0.6s ease;
70
- }
71
- .progressbar.horizontal {
72
- left: 0;
73
- height: 2px;
74
- top: 11%;
75
- }
76
- .progressbar.vertical {
77
- width: 2px;
78
- left: 5%;
79
- top: 0;
80
- }
81
-
82
- .progress-step-item.horizontal:nth-of-type(1) {
83
- transform: translateX(-50%);
84
- }
85
- .progress-step-item.horizontal:last-child {
86
- transform: translateX(50%);
87
- }
88
- .progress-step-item.vertical {
89
- transform: translateY(50%);
90
- }
91
- .progress-step-item.vertical:nth-of-type(1) {
92
- transform: translateY(-5%);
93
- }
94
- .progress-step-item.vertical:last-child {
95
- transform: translateY(100%);
96
- }/*# sourceMappingURL=App.css.map */
@@ -1 +0,0 @@
1
- {"version":3,"sources":["App.scss","App.css"],"names":[],"mappings":"AAAQ,iCAAA;AACA,oCAAA;AACA,uCAAA;AACA,gCAAA;AACA,kGAAA;AAER;EACE,aAAA;EACA,aAAA;EACA,aAAA;EACA,aAAA;EACA,aAAA;EACA,UAAA;EACA,aAAA;EACA,kBAAA;EACA,0BAAA;ACAF;;ADmBA;EACE,+BAAA;EACA,mCAAA;EACA,kCAAA;EACA,sBAAA;EACA,UAAA;EACA,SAAA;AChBF;;ADmBA;EACE,+BAAA;AChBF;;ADmBA;EACE,uBAAA;EACA,0BAAA;AChBF;;ADmBA;EACE,uBAAA;EACA,0BAAA;AChBF;;ADmBA;EACE,uBAAA;EACA,0BAAA;AChBF;;ADqBA;EACE,kBAAA;AClBF;ADoBE;EACE,WAAA;EACA,iCAAA;EACA,kBAAA;EACA,WAAA;AClBJ;ADqBE;EACE,WAAA;EACA,WAAA;EACA,QAAA;ACnBJ;ADsBE;EACE,YAAA;EACA,UAAA;EACA,QAAA;EACA,MAAA;ACpBJ;;ADwBA;EACE,WAAA;EACA,yBAAA;ACrBF;ADuBE;EACE,OAAA;EACA,WAAA;EACA,QAAA;ACrBJ;ADwBE;EACE,UAAA;EACA,QAAA;EACA,MAAA;ACtBJ;;AD8BI;EACE,2BAAA;AC3BN;AD8BI;EACE,0BAAA;AC5BN;ADgCE;EACE,0BAAA;AC9BJ;ADgCI;EACE,0BAAA;AC9BN;ADiCI;EACE,2BAAA;AC/BN","file":"App.css"}
@@ -1,130 +0,0 @@
1
- @import url("./assets/theme.css");
2
- @import url("./assets/sccoreui.css");
3
- @import url("./assets/sccoreicons.css");
4
- @import url("./assets/flex.css");
5
- @import url('https://fonts.googleapis.com/css2?family=Lato:wght@100;300;400;700;900&display=swap');
6
-
7
- :root {
8
- --fw-600: 600;
9
- --fw-400: 400;
10
- --fs-24: 24px;
11
- --fs-18: 18px;
12
- --fs-16: 16px;
13
- --lh: 24px;
14
- --fs-14: 14px;
15
- --grey-bg: #101828;
16
- --border-none: border-none;
17
- }
18
-
19
- // @font-face {
20
- // font-family: "Lato";
21
- // src: url("./assets/fonts/Lato-Regular.ttf") format("truetype");
22
- // }
23
-
24
- // @font-face {
25
- // font-family: "Lato-600";
26
- // font-weight: 600;
27
- // src: url("./assets/fonts/Lato-Regular.ttf") format("truetype");
28
- // }
29
-
30
- // * {
31
- // padding: 0;
32
- // margin: 0;
33
- // }
34
-
35
- body {
36
- font-family: 'Lato', sans-serif;
37
- -webkit-font-smoothing: antialiased;
38
- -moz-osx-font-smoothing: grayscale;
39
- line-height: var(--lh);
40
- padding: 0;
41
- margin: 0;
42
- }
43
-
44
- code {
45
- font-family: 'Lato', sans-serif;
46
- }
47
-
48
- h1 {
49
- font-size: var(--fs-24);
50
- font-weight: var(--fw-600);
51
- }
52
-
53
- h2 {
54
- font-size: var(--fs-18);
55
- font-weight: var(--fw-600);
56
- }
57
-
58
- h3 {
59
- font-size: var(--fs-16);
60
- font-weight: var(--fw-400);
61
- }
62
-
63
- // ============= custom progress steps =============== //
64
-
65
- .progress-container {
66
- isolation: isolate;
67
-
68
- &::before {
69
- content: "";
70
- background-color: var(--gray-200);
71
- position: absolute;
72
- z-index: -1;
73
- }
74
-
75
- &.horizontal::before {
76
- height: 2px;
77
- width: 100%;
78
- top: 11%;
79
- }
80
-
81
- &.vertical::before {
82
- height: 100%;
83
- width: 2px;
84
- left: 5%;
85
- top: 0;
86
- }
87
- }
88
-
89
- .progressbar {
90
- z-index: -1;
91
- transition: all 0.6s ease;
92
-
93
- &.horizontal {
94
- left: 0;
95
- height: 2px;
96
- top: 11%;
97
- }
98
-
99
- &.vertical {
100
- width: 2px;
101
- left: 5%;
102
- top: 0;
103
- }
104
- }
105
-
106
- .progress-step-item {
107
- &.horizontal {
108
- // transform: translateX(10%);
109
-
110
- &:nth-of-type(1) {
111
- transform: translateX(-50%);
112
- }
113
-
114
- &:last-child {
115
- transform: translateX(50%);
116
- }
117
- }
118
-
119
- &.vertical {
120
- transform: translateY(50%);
121
-
122
- &:nth-of-type(1) {
123
- transform: translateY(-5%);
124
- }
125
-
126
- &:last-child {
127
- transform: translateY(100%);
128
- }
129
- }
130
- }