namirasoft-site-react 1.4.54 → 1.4.57
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/App.js +2 -2
- package/dist/App.js.map +1 -1
- package/dist/components/NSBoxBoolean.module.css +17 -4
- package/dist/components/NSDownTimer.js +3 -2
- package/dist/components/NSDownTimer.js.map +1 -1
- package/dist/components/NSDownTimer.module.css +26 -38
- package/dist/components/NSTabPage.module.css +1 -1
- package/dist/components/NSTable.module.css +1 -0
- package/package.json +2 -2
- package/src/App.css +28 -0
- package/src/App.tsx +10 -3
- package/src/components/NSBoxBoolean.module.css +17 -4
- package/src/components/NSDownTimer.module.css +26 -38
- package/src/components/NSDownTimer.tsx +36 -36
- package/src/components/NSTabPage.module.css +1 -1
- package/src/components/NSTable.module.css +1 -0
package/dist/App.js
CHANGED
|
@@ -11,7 +11,7 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
|
|
|
11
11
|
import './App.css';
|
|
12
12
|
import 'bootstrap/dist/css/bootstrap.min.css';
|
|
13
13
|
import { NSTable } from './components/NSTable';
|
|
14
|
-
import { NSBarAlert, NSBoxBoolean, NSBoxBooleans, NSBoxDate, NSBoxEnum, NSBoxInteger, NSBoxPhone, NSBoxSearch, NSButtonBlue, NSNotFoundPage } from './main';
|
|
14
|
+
import { NSBarAlert, NSBoxBoolean, NSBoxBooleans, NSBoxDate, NSBoxEnum, NSBoxInteger, NSBoxPhone, NSBoxSearch, NSButtonBlue, NSDownTimer, NSNotFoundPage } from './main';
|
|
15
15
|
import { useState } from 'react';
|
|
16
16
|
const fakeFormatter = {
|
|
17
17
|
format: (value) => { return value; }
|
|
@@ -180,7 +180,7 @@ export function App() {
|
|
|
180
180
|
} }), _jsx("div", { style: { width: "560px" }, children: _jsx(NSBoxSearch, { required: true, title: 'asdasd', style: { width: "100%", maxWidth: "100%" } }) }), _jsx(NSButtonBlue, { onClick: () => { }, title: 'sssssssssss', disabled: true }), _jsx(NSBarAlert, { isVisible: () => true, onContinue: () => window.open("/"), title: {
|
|
181
181
|
title: "Verify Your Email",
|
|
182
182
|
description: "Lorem ipsum dolor sit amet consectetur. In ipsum gravida libero vitae tempor.Ipsum"
|
|
183
|
-
} }), _jsx(NSBoxBoolean, { required: false, title: 'test', checked: true }), _jsx(NSBoxBooleans, { items: [
|
|
183
|
+
} }), _jsx(NSBoxBoolean, { required: false, title: 'test', checked: true }), _jsx("div", { className: 'out', children: _jsx("div", { className: "middle", children: _jsx("div", { className: 'in' }) }) }), _jsx(NSDownTimer, { date: new Date(), text: 'Test ' }), _jsx(NSBoxBooleans, { items: [
|
|
184
184
|
{ value: "test1", text: "test1" },
|
|
185
185
|
{ value: "test2", text: "test2" },
|
|
186
186
|
{ value: "test3", text: "test3" },
|
package/dist/App.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"App.js","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":";;;;;;;;;;AAAA,OAAO,WAAW,CAAC;AACnB,OAAO,sCAAsC,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAgD,MAAM,sBAAsB,CAAC;AAC7F,OAAO,EAAuB,UAAU,EAAE,YAAY,EAAE,aAAa,EAAE,SAAS,EAAE,SAAS,EAAE,YAAY,EAAE,UAAU,EAAE,WAAW,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;
|
|
1
|
+
{"version":3,"file":"App.js","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":"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"}
|
|
@@ -57,15 +57,28 @@
|
|
|
57
57
|
position: relative;
|
|
58
58
|
}
|
|
59
59
|
|
|
60
|
-
.ns_indeterminate::
|
|
61
|
-
content: "
|
|
60
|
+
.ns_indeterminate::before {
|
|
61
|
+
content: "";
|
|
62
62
|
display: block;
|
|
63
63
|
position: absolute;
|
|
64
64
|
width: 100%;
|
|
65
65
|
height: 100%;
|
|
66
66
|
top: 0;
|
|
67
|
-
|
|
68
|
-
border: 5px solid #
|
|
67
|
+
right: 0;
|
|
68
|
+
border: 5px solid #141b5c;
|
|
69
|
+
color: #141b5c;
|
|
70
|
+
background: #fffbff;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
.ns_indeterminate::after {
|
|
74
|
+
content: "";
|
|
75
|
+
display: block;
|
|
76
|
+
position: absolute;
|
|
77
|
+
width: 18px;
|
|
78
|
+
height: 18px;
|
|
79
|
+
top: 3px;
|
|
80
|
+
left: 3px;
|
|
81
|
+
border: 3px solid #fffbff;
|
|
69
82
|
color: #141b5c;
|
|
70
83
|
background: #141b5c;
|
|
71
84
|
}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import Styles from './NSDownTimer.module.css';
|
|
3
2
|
import { useEffect, useState } from 'react';
|
|
3
|
+
import Styles from './NSDownTimer.module.css';
|
|
4
4
|
export function NSDownTimer(props) {
|
|
5
|
+
var _a;
|
|
5
6
|
const [timeLeft, setTimeLeft] = useState(calculateTimeLeft(props.date));
|
|
6
7
|
useEffect(() => {
|
|
7
8
|
const timer = setInterval(() => {
|
|
@@ -23,7 +24,7 @@ export function NSDownTimer(props) {
|
|
|
23
24
|
}
|
|
24
25
|
return timeLeft;
|
|
25
26
|
}
|
|
26
|
-
return (
|
|
27
|
+
return (_jsxs("div", { id: props.id, className: `${Styles.ns_countdown_container} ${(_a = props.classList) === null || _a === void 0 ? void 0 : _a.join(" ")}`, style: props.style, children: [_jsxs("figure", { className: Styles.ns_figure, children: [_jsx("img", { src: 'https://static.namirasoft.com/image/concept/countdown/grey.svg', alt: 'CountDown', width: 48, height: 48 }), _jsx("figcaption", { children: props.text })] }), _jsxs("div", { className: Styles.ns_countdown_time_container, children: [_jsxs("div", { className: 'd-flex flex-column justify-content-center align-items-center', children: [_jsx("span", { className: Styles.ns_coundtdown_time_left, children: `${timeLeft.days} ` }), _jsx("span", { className: Styles.ns_coundtdown_time_left_unit, children: "DAY" })] }), _jsx("span", { className: `${Styles.ns_semi_colon} `, children: ":" }), _jsxs("div", { className: 'd-flex flex-column justify-content-center align-items-center', children: [_jsx("span", { className: Styles.ns_coundtdown_time_left, children: `${timeLeft.hours}` }), _jsx("span", { className: Styles.ns_coundtdown_time_left_unit, children: "HOUR" })] }), _jsx("span", { className: `${Styles.ns_semi_colon} `, children: ":" }), _jsxs("div", { className: 'd-flex flex-column justify-content-center align-items-center', children: [_jsx("span", { className: Styles.ns_coundtdown_time_left, children: `${timeLeft.minutes}` }), _jsx("span", { className: Styles.ns_coundtdown_time_left_unit, children: "MIN" })] }), _jsx("span", { className: `${Styles.ns_semi_colon} `, children: ":" }), _jsxs("div", { className: 'd-flex flex-column justify-content-center align-items-center', children: [_jsx("span", { className: Styles.ns_coundtdown_time_left, children: `${timeLeft.seconds} ` }), _jsx("span", { className: Styles.ns_coundtdown_time_left_unit, children: "SEC" })] })] })] }));
|
|
27
28
|
}
|
|
28
29
|
;
|
|
29
30
|
//# sourceMappingURL=NSDownTimer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NSDownTimer.js","sourceRoot":"","sources":["../../src/components/NSDownTimer.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"NSDownTimer.js","sourceRoot":"","sources":["../../src/components/NSDownTimer.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,63 +1,51 @@
|
|
|
1
|
-
.
|
|
1
|
+
.ns_countdown_container {
|
|
2
2
|
display: flex;
|
|
3
3
|
flex-direction: row;
|
|
4
4
|
align-items: center;
|
|
5
5
|
justify-content: left;
|
|
6
6
|
}
|
|
7
7
|
|
|
8
|
-
.
|
|
9
|
-
color: #141B5C;
|
|
10
|
-
font-size: 6px;
|
|
11
|
-
margin: 0;
|
|
12
|
-
padding-left: 2px;
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
.ns_payment_time_countdown {
|
|
8
|
+
.ns_figure {
|
|
16
9
|
display: flex;
|
|
17
10
|
flex-direction: row;
|
|
11
|
+
align-items: center;
|
|
18
12
|
justify-content: center;
|
|
19
|
-
|
|
20
|
-
align-items: flex-start;
|
|
21
|
-
padding: 0 8px;
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
.ns_semi_colon {
|
|
25
|
-
display: flex;
|
|
26
|
-
flex-direction: row;
|
|
27
|
-
padding: 0;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
.ns_payment_time_countdown Span {
|
|
31
|
-
font-size: 16px;
|
|
32
|
-
font-weight: 400;
|
|
33
|
-
color: #141B5C;
|
|
13
|
+
margin: 0;
|
|
34
14
|
}
|
|
35
15
|
|
|
36
|
-
.
|
|
37
|
-
font-size:
|
|
16
|
+
.ns_figure figcaption {
|
|
17
|
+
font-size: 18px;
|
|
18
|
+
font-weight: 500;
|
|
38
19
|
margin: 0;
|
|
39
20
|
color: #141B5C;
|
|
40
21
|
padding: 2px 0;
|
|
41
|
-
|
|
22
|
+
max-width: 100px;
|
|
42
23
|
}
|
|
43
24
|
|
|
44
|
-
.
|
|
25
|
+
.ns_countdown_time_container {
|
|
45
26
|
display: flex;
|
|
46
27
|
flex-direction: row;
|
|
47
|
-
align-items: center;
|
|
48
28
|
justify-content: center;
|
|
49
|
-
|
|
29
|
+
gap: 4px;
|
|
30
|
+
align-items: flex-start;
|
|
31
|
+
padding: 0 8px;
|
|
50
32
|
}
|
|
51
33
|
|
|
52
|
-
.
|
|
53
|
-
|
|
54
|
-
font-weight:
|
|
55
|
-
margin: 0;
|
|
34
|
+
.ns_coundtdown_time_left {
|
|
35
|
+
font-size: 16px;
|
|
36
|
+
font-weight: 600;
|
|
56
37
|
color: #141B5C;
|
|
57
|
-
|
|
58
|
-
|
|
38
|
+
margin: 0;
|
|
39
|
+
padding-left: 2px;
|
|
59
40
|
}
|
|
60
41
|
|
|
61
|
-
.
|
|
62
|
-
|
|
42
|
+
.ns_coundtdown_time_left_unit {
|
|
43
|
+
font-size: 12px;
|
|
44
|
+
font-weight: 400;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
.ns_semi_colon {
|
|
48
|
+
display: flex;
|
|
49
|
+
flex-direction: row;
|
|
50
|
+
padding: 0;
|
|
63
51
|
}
|
package/package.json
CHANGED
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
"framework": "npm",
|
|
9
9
|
"application": "package",
|
|
10
10
|
"private": false,
|
|
11
|
-
"version": "1.4.
|
|
11
|
+
"version": "1.4.57",
|
|
12
12
|
"author": "Amir Abolhasani, Alireza Esmaeeli",
|
|
13
13
|
"license": "MIT",
|
|
14
14
|
"main": "./dist/main.js",
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
},
|
|
23
23
|
"dependencies": {
|
|
24
24
|
"@ant-design/charts": "^2.2.3",
|
|
25
|
-
"@types/node": "^22.9.
|
|
25
|
+
"@types/node": "^22.9.1",
|
|
26
26
|
"@types/react": "^18.3.12",
|
|
27
27
|
"@types/react-bootstrap": "^0.32.37",
|
|
28
28
|
"@types/react-dom": "^18.3.1",
|
package/src/App.css
CHANGED
|
@@ -14,4 +14,32 @@
|
|
|
14
14
|
.ns_font_16_bold{
|
|
15
15
|
font-size: 16px;
|
|
16
16
|
font-weight: 600;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.out{
|
|
20
|
+
width: 24px;
|
|
21
|
+
height:24px;
|
|
22
|
+
background-color: red;
|
|
23
|
+
margin: auto;
|
|
24
|
+
display: flex;
|
|
25
|
+
justify-content: center;
|
|
26
|
+
align-items: center;
|
|
27
|
+
}
|
|
28
|
+
.middle{
|
|
29
|
+
width: 19px;
|
|
30
|
+
height: 19px;
|
|
31
|
+
background-color: #fff;
|
|
32
|
+
margin: auto;
|
|
33
|
+
display: flex;
|
|
34
|
+
justify-content: center;
|
|
35
|
+
align-items: center;
|
|
36
|
+
}
|
|
37
|
+
.in{
|
|
38
|
+
width: 14px;
|
|
39
|
+
height: 14px;
|
|
40
|
+
background-color: red;
|
|
41
|
+
margin: auto;
|
|
42
|
+
display: flex;
|
|
43
|
+
justify-content: center;
|
|
44
|
+
align-items: center;
|
|
17
45
|
}
|
package/src/App.tsx
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import './App.css';
|
|
2
2
|
import 'bootstrap/dist/css/bootstrap.min.css';
|
|
3
3
|
import { NSTable, INSTableProps, TableColumnInfo, TableRowInfo } from './components/NSTable';
|
|
4
|
-
import { BaseColumnFormatter, NSBarAlert, NSBoxBoolean, NSBoxBooleans, NSBoxDate, NSBoxEnum, NSBoxInteger, NSBoxPhone, NSBoxSearch, NSButtonBlue, NSNotFoundPage } from './main';
|
|
4
|
+
import { BaseColumnFormatter, NSBarAlert, NSBoxBoolean, NSBoxBooleans, NSBoxDate, NSBoxEnum, NSBoxInteger, NSBoxPhone, NSBoxSearch, NSButtonBlue, NSDownTimer, NSNotFoundPage } from './main';
|
|
5
5
|
import { useState } from 'react';
|
|
6
6
|
|
|
7
7
|
export interface INSBarActionState
|
|
@@ -267,8 +267,15 @@ export function App()
|
|
|
267
267
|
checked={true}
|
|
268
268
|
|
|
269
269
|
/>
|
|
270
|
-
|
|
271
|
-
|
|
270
|
+
<div className='out'>
|
|
271
|
+
<div className="middle">
|
|
272
|
+
<div className='in'></div>
|
|
273
|
+
</div>
|
|
274
|
+
</div>
|
|
275
|
+
<NSDownTimer
|
|
276
|
+
date={new Date()}
|
|
277
|
+
text='Test '
|
|
278
|
+
/>
|
|
272
279
|
<NSBoxBooleans
|
|
273
280
|
items={[
|
|
274
281
|
{ value: "test1", text: "test1" },
|
|
@@ -57,15 +57,28 @@
|
|
|
57
57
|
position: relative;
|
|
58
58
|
}
|
|
59
59
|
|
|
60
|
-
.ns_indeterminate::
|
|
61
|
-
content: "
|
|
60
|
+
.ns_indeterminate::before {
|
|
61
|
+
content: "";
|
|
62
62
|
display: block;
|
|
63
63
|
position: absolute;
|
|
64
64
|
width: 100%;
|
|
65
65
|
height: 100%;
|
|
66
66
|
top: 0;
|
|
67
|
-
|
|
68
|
-
border: 5px solid #
|
|
67
|
+
right: 0;
|
|
68
|
+
border: 5px solid #141b5c;
|
|
69
|
+
color: #141b5c;
|
|
70
|
+
background: #fffbff;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
.ns_indeterminate::after {
|
|
74
|
+
content: "";
|
|
75
|
+
display: block;
|
|
76
|
+
position: absolute;
|
|
77
|
+
width: 18px;
|
|
78
|
+
height: 18px;
|
|
79
|
+
top: 3px;
|
|
80
|
+
left: 3px;
|
|
81
|
+
border: 3px solid #fffbff;
|
|
69
82
|
color: #141b5c;
|
|
70
83
|
background: #141b5c;
|
|
71
84
|
}
|
|
@@ -1,63 +1,51 @@
|
|
|
1
|
-
.
|
|
1
|
+
.ns_countdown_container {
|
|
2
2
|
display: flex;
|
|
3
3
|
flex-direction: row;
|
|
4
4
|
align-items: center;
|
|
5
5
|
justify-content: left;
|
|
6
6
|
}
|
|
7
7
|
|
|
8
|
-
.
|
|
9
|
-
color: #141B5C;
|
|
10
|
-
font-size: 6px;
|
|
11
|
-
margin: 0;
|
|
12
|
-
padding-left: 2px;
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
.ns_payment_time_countdown {
|
|
8
|
+
.ns_figure {
|
|
16
9
|
display: flex;
|
|
17
10
|
flex-direction: row;
|
|
11
|
+
align-items: center;
|
|
18
12
|
justify-content: center;
|
|
19
|
-
|
|
20
|
-
align-items: flex-start;
|
|
21
|
-
padding: 0 8px;
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
.ns_semi_colon {
|
|
25
|
-
display: flex;
|
|
26
|
-
flex-direction: row;
|
|
27
|
-
padding: 0;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
.ns_payment_time_countdown Span {
|
|
31
|
-
font-size: 16px;
|
|
32
|
-
font-weight: 400;
|
|
33
|
-
color: #141B5C;
|
|
13
|
+
margin: 0;
|
|
34
14
|
}
|
|
35
15
|
|
|
36
|
-
.
|
|
37
|
-
font-size:
|
|
16
|
+
.ns_figure figcaption {
|
|
17
|
+
font-size: 18px;
|
|
18
|
+
font-weight: 500;
|
|
38
19
|
margin: 0;
|
|
39
20
|
color: #141B5C;
|
|
40
21
|
padding: 2px 0;
|
|
41
|
-
|
|
22
|
+
max-width: 100px;
|
|
42
23
|
}
|
|
43
24
|
|
|
44
|
-
.
|
|
25
|
+
.ns_countdown_time_container {
|
|
45
26
|
display: flex;
|
|
46
27
|
flex-direction: row;
|
|
47
|
-
align-items: center;
|
|
48
28
|
justify-content: center;
|
|
49
|
-
|
|
29
|
+
gap: 4px;
|
|
30
|
+
align-items: flex-start;
|
|
31
|
+
padding: 0 8px;
|
|
50
32
|
}
|
|
51
33
|
|
|
52
|
-
.
|
|
53
|
-
|
|
54
|
-
font-weight:
|
|
55
|
-
margin: 0;
|
|
34
|
+
.ns_coundtdown_time_left {
|
|
35
|
+
font-size: 16px;
|
|
36
|
+
font-weight: 600;
|
|
56
37
|
color: #141B5C;
|
|
57
|
-
|
|
58
|
-
|
|
38
|
+
margin: 0;
|
|
39
|
+
padding-left: 2px;
|
|
59
40
|
}
|
|
60
41
|
|
|
61
|
-
.
|
|
62
|
-
|
|
42
|
+
.ns_coundtdown_time_left_unit {
|
|
43
|
+
font-size: 12px;
|
|
44
|
+
font-weight: 400;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
.ns_semi_colon {
|
|
48
|
+
display: flex;
|
|
49
|
+
flex-direction: row;
|
|
50
|
+
padding: 0;
|
|
63
51
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
+
import { useEffect, useState } from 'react';
|
|
1
2
|
import { IBaseComponentProps } from '../props/IBaseComponentProps';
|
|
2
3
|
import Styles from './NSDownTimer.module.css';
|
|
3
|
-
import { useEffect, useState } from 'react';
|
|
4
4
|
export interface NSDownTimerProps extends IBaseComponentProps
|
|
5
5
|
{
|
|
6
6
|
date: Date;
|
|
@@ -39,40 +39,40 @@ export function NSDownTimer(props: NSDownTimerProps)
|
|
|
39
39
|
return timeLeft;
|
|
40
40
|
}
|
|
41
41
|
return (
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
42
|
+
<div
|
|
43
|
+
id={props.id}
|
|
44
|
+
className={`${Styles.ns_countdown_container} ${props.classList?.join(" ")}`}
|
|
45
|
+
style={props.style}
|
|
46
|
+
>
|
|
47
|
+
<figure className={Styles.ns_figure}>
|
|
48
|
+
<img
|
|
49
|
+
src='https://static.namirasoft.com/image/concept/countdown/grey.svg'
|
|
50
|
+
alt='CountDown'
|
|
51
|
+
width={48}
|
|
52
|
+
height={48} />
|
|
53
|
+
<figcaption>{props.text}</figcaption>
|
|
54
|
+
</figure>
|
|
55
|
+
<div className={Styles.ns_countdown_time_container}>
|
|
56
|
+
<div className='d-flex flex-column justify-content-center align-items-center'>
|
|
57
|
+
<span className={Styles.ns_coundtdown_time_left}>{`${timeLeft.days} `}</span>
|
|
58
|
+
<span className={Styles.ns_coundtdown_time_left_unit}>DAY</span>
|
|
59
|
+
</div>
|
|
60
|
+
<span className={`${Styles.ns_semi_colon} `}>:</span>
|
|
61
|
+
<div className='d-flex flex-column justify-content-center align-items-center'>
|
|
62
|
+
<span className={Styles.ns_coundtdown_time_left}>{`${timeLeft.hours}`}</span>
|
|
63
|
+
<span className={Styles.ns_coundtdown_time_left_unit}>HOUR</span>
|
|
64
|
+
</div>
|
|
65
|
+
<span className={`${Styles.ns_semi_colon} `}>:</span>
|
|
66
|
+
<div className='d-flex flex-column justify-content-center align-items-center'>
|
|
67
|
+
<span className={Styles.ns_coundtdown_time_left}>{`${timeLeft.minutes}`}</span>
|
|
68
|
+
<span className={Styles.ns_coundtdown_time_left_unit}>MIN</span>
|
|
69
|
+
</div>
|
|
70
|
+
<span className={`${Styles.ns_semi_colon} `}>:</span>
|
|
71
|
+
<div className='d-flex flex-column justify-content-center align-items-center'>
|
|
72
|
+
<span className={Styles.ns_coundtdown_time_left}>{`${timeLeft.seconds} `}</span>
|
|
73
|
+
<span className={Styles.ns_coundtdown_time_left_unit}>SEC</span>
|
|
74
|
+
</div>
|
|
75
|
+
</div>
|
|
76
|
+
</div>
|
|
77
77
|
);
|
|
78
78
|
};
|