px-react-ui-components 1.1.8 → 1.1.10

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 (13) hide show
  1. package/dist/components/MyAlert/MyAlert.css +117 -117
  2. package/dist/components/MyContainer/MyContainer.module.css +95 -109
  3. package/dist/components/MyEditor/MyEditor.scss +276 -276
  4. package/dist/components/MyFileUpload/MyFileUpload.module.css +86 -86
  5. package/dist/components/MyInput/MyInput.module.css +4 -4
  6. package/dist/components/MyMenu/MyMenu.module.css +101 -101
  7. package/dist/components/MyModal/MyModal.css +84 -84
  8. package/dist/components/MyModal/MyModal.js +1 -1
  9. package/dist/components/MyNotFound/MyNotFound.css +21 -21
  10. package/dist/components/MyTable/MyTable.module.css +357 -357
  11. package/dist/components/MyTabs/MyTabs.css +105 -105
  12. package/dist/components/MyWaiting/MyWaiting.css +32 -32
  13. package/package.json +1 -1
package/dist/components/MyFileUpload/MyFileUpload.module.css CHANGED
@@ -1,86 +1,86 @@
1
- .myFileUploadContainer {
2
- display: flex;
3
- width: 100%;
4
- flex-direction: row;
5
- gap: 5px;
6
- }
7
-
8
- .myFileUploadContainer .myFileUploadContainerItem {
9
- width: 100%;
10
- padding: 5px;
11
- background-color: #f0f0f0;
12
- border-radius: 5px;
13
- border: 1px dashed #ccc;
14
- display: flex;
15
- flex-direction: row;
16
- justify-content: center;
17
- align-items: center;
18
- gap: 3px;
19
- }
20
-
21
- .myFileUploadContainer
22
- .myFileUploadContainerItem
23
- .myFileUploadContainerItemIcon {
24
- display: flex;
25
- width: 100%;
26
-
27
- flex-direction: row;
28
- justify-content: center;
29
- align-items: center;
30
- gap: 1px;
31
- }
32
-
33
- .myFileUploadContainer
34
- .myFileUploadContainerItem
35
- .myFileUploadContainerItemIcon
36
- .Icon {
37
- font-size: 35px;
38
- color: #17305b;
39
- }
40
-
41
- .myFileUploadContainer
42
- .myFileUploadContainerItem
43
- .myFileUploadContainerItemIcon
44
- .myFileUploadContainerItemIconText {
45
- width: 100%;
46
-
47
- text-align: center;
48
- font-weight: normal;
49
- color: #636363;
50
- font-size: 12px;
51
- line-height: 1.3;
52
- }
53
-
54
- .myFileUploadContainer
55
- .myFileUploadContainerItem
56
- .myFileUploadContainerItemFile {
57
- display: flex;
58
- flex-direction: row;
59
- justify-content: center;
60
- align-items: center;
61
- }
62
-
63
- .myFileUploadContainer
64
- .myFileUploadContainerItem
65
- .myFileUploadContainerItemFile
66
- .myFileUploadButton {
67
- display: flex;
68
- width: 200px;
69
- height: 35px;
70
- flex-direction: column;
71
- align-items: center;
72
- justify-content: center;
73
- gap: 10px;
74
- flex-shrink: 0;
75
- background-color: #334f7f;
76
- color: #fff;
77
- border-radius: 15px;
78
- cursor: pointer;
79
- font-size: 13px;
80
- }
81
- .myFileUploadContainer
82
- .myFileUploadContainerItem
83
- .myFileUploadContainerItemFile
84
- .myFileUploadButton:hover {
85
- background-color: #2a436a;
86
- }
1
+ .myFileUploadContainer {
2
+ display: flex;
3
+ width: 100%;
4
+ flex-direction: row;
5
+ gap: 5px;
6
+ }
7
+
8
+ .myFileUploadContainer .myFileUploadContainerItem {
9
+ width: 100%;
10
+ padding: 5px;
11
+ background-color: #f0f0f0;
12
+ border-radius: 5px;
13
+ border: 1px dashed #ccc;
14
+ display: flex;
15
+ flex-direction: row;
16
+ justify-content: center;
17
+ align-items: center;
18
+ gap: 3px;
19
+ }
20
+
21
+ .myFileUploadContainer
22
+ .myFileUploadContainerItem
23
+ .myFileUploadContainerItemIcon {
24
+ display: flex;
25
+ width: 100%;
26
+
27
+ flex-direction: row;
28
+ justify-content: center;
29
+ align-items: center;
30
+ gap: 1px;
31
+ }
32
+
33
+ .myFileUploadContainer
34
+ .myFileUploadContainerItem
35
+ .myFileUploadContainerItemIcon
36
+ .Icon {
37
+ font-size: 35px;
38
+ color: #17305b;
39
+ }
40
+
41
+ .myFileUploadContainer
42
+ .myFileUploadContainerItem
43
+ .myFileUploadContainerItemIcon
44
+ .myFileUploadContainerItemIconText {
45
+ width: 100%;
46
+
47
+ text-align: center;
48
+ font-weight: normal;
49
+ color: #636363;
50
+ font-size: 12px;
51
+ line-height: 1.3;
52
+ }
53
+
54
+ .myFileUploadContainer
55
+ .myFileUploadContainerItem
56
+ .myFileUploadContainerItemFile {
57
+ display: flex;
58
+ flex-direction: row;
59
+ justify-content: center;
60
+ align-items: center;
61
+ }
62
+
63
+ .myFileUploadContainer
64
+ .myFileUploadContainerItem
65
+ .myFileUploadContainerItemFile
66
+ .myFileUploadButton {
67
+ display: flex;
68
+ width: 200px;
69
+ height: 35px;
70
+ flex-direction: column;
71
+ align-items: center;
72
+ justify-content: center;
73
+ gap: 10px;
74
+ flex-shrink: 0;
75
+ background-color: #334f7f;
76
+ color: #fff;
77
+ border-radius: 15px;
78
+ cursor: pointer;
79
+ font-size: 13px;
80
+ }
81
+ .myFileUploadContainer
82
+ .myFileUploadContainerItem
83
+ .myFileUploadContainerItemFile
84
+ .myFileUploadButton:hover {
85
+ background-color: #2a436a;
86
+ }
package/dist/components/MyInput/MyInput.module.css CHANGED
@@ -74,9 +74,9 @@
74
74
  -moz-appearance: none; /* Firefox */
75
75
  appearance: none;
76
76
 
77
- background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.41 0.590088L6 5.17009L10.59 0.590088L12 2.00009L6 8.00009L0 2.00009L1.41 0.590088Z' fill='%2373889D'/%3E%3C/svg%3E");
78
- background-repeat: no-repeat;
79
- background-position: right 10px center;
77
+ background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.41 0.590088L6 5.17009L10.59 0.590088L12 2.00009L6 8.00009L0 2.00009L1.41 0.590088Z' fill='%2373889D'/%3E%3C/svg%3E") !important;
78
+ background-repeat: no-repeat !important;
79
+ background-position: right 10px center !important;
80
80
  }
81
81
 
82
82
  .fileinput::placeholder,
@@ -185,7 +185,7 @@
185
185
  position: absolute;
186
186
  left: 5px;
187
187
  top: 41px;
188
- max-height: 300px;
188
+ max-height: 250px;
189
189
  width: calc(100% - 10px);
190
190
  z-index: 99;
191
191
  background-color: #fff;
package/dist/components/MyMenu/MyMenu.module.css CHANGED
@@ -1,102 +1,102 @@
1
- .menuItem{
2
- display: flex;
3
- width: 100%;
4
- flex-direction: row;
5
- align-items: center;
6
- gap: 15px;
7
- padding: 10px 16px 10px 20px;
8
- cursor: pointer;
9
- border-bottom: 1px solid #0000001c;
10
- font-weight: 300;
11
- font-size: 14px;
12
- color: #fff !important;
13
- text-decoration: none !important;
14
- }
15
- .menuItem.selected{
16
- background-color: #fff1c939 !important;
17
- }
18
- .menuItem:last-child{
19
- border-bottom: none;
20
- }
21
- .menuItem:hover{
22
- background-color: #00000039;
23
- }
24
- .menuItem .menuItemIcon{
25
- font-size: 20px;
26
- }
27
- .menuItem .menuItemText{
28
- display: block;
29
- position: relative;
30
- width: 100%;
31
- padding-right: 35px;
32
- }
33
- .menuItem .menuItemText .menuItemBadge{
34
- position: absolute;
35
- right: 0px;
36
- top: 50%;
37
- padding: 0px 8px;
38
- transform: translateY(-50%);
39
- background-color: #0000003d;
40
- color: #fff;
41
- border-radius: 10px;
42
- padding-top: 1px;
43
- font-size: 12px;
44
- min-width: 25px;
45
- font-weight: normal;
46
- text-align: center;
47
- }
48
-
49
- .menuItem.menuItemShortMenu{
50
- position: relative;
51
- padding: 10px 10px;
52
- justify-content: center;
53
- }
54
- .menuItem.menuItemShortMenu .menuItemIcon{
55
- font-size: 24px;
56
- }
57
-
58
- .menuItem.menuItemShortMenu .menuItemText{
59
- display: none;
60
- }
61
-
62
- .menuItem.menuItemShortMenu .menuItemIconSubMenu{
63
- font-size: 13px;
64
- position: absolute;
65
- right: 8px;
66
- top: 50%;
67
- transform: translateY(-50%);
68
- }
69
-
70
- .menuItem.menuItemShortMenu:hover .menuItemText{
71
- display: block;
72
- position: absolute;
73
- width: auto;
74
- left: calc(100% + 5px);
75
- top: 50%;
76
- transform: translateY(-50%);
77
- padding: 10px;
78
- background-color: #000000;
79
- color: #fff !important;
80
- border-radius: 10px;
81
- z-index: 1000;
82
- white-space: nowrap;
83
- }
84
- .menuItem.menuItemShortMenu:hover .menuItemText.menuItemTextBadge{
85
- padding-right: 50px;
86
- }
87
- .menuItem.menuItemShortMenu:hover .menuItemText.menuItemTextBadge .menuItemBadge{
88
- right: 8px;
89
- background-color: #ffffff46;
90
- }
91
- .menuItemOwner .menuItemOpen{
92
- background-color: #283b5c;
93
- }
94
-
95
- .menuItemOwner .menuItemChildren{
96
- display: none;
97
- background-color: #30425f;
98
-
99
- }
100
- .menuItemOwner .menuItemChildrenOpen{
101
- display: block;
1
+ .menuItem{
2
+ display: flex;
3
+ width: 100%;
4
+ flex-direction: row;
5
+ align-items: center;
6
+ gap: 15px;
7
+ padding: 10px 16px 10px 20px;
8
+ cursor: pointer;
9
+ border-bottom: 1px solid #0000001c;
10
+ font-weight: 300;
11
+ font-size: 14px;
12
+ color: #fff !important;
13
+ text-decoration: none !important;
14
+ }
15
+ .menuItem.selected{
16
+ background-color: #fff1c939 !important;
17
+ }
18
+ .menuItem:last-child{
19
+ border-bottom: none;
20
+ }
21
+ .menuItem:hover{
22
+ background-color: #00000039;
23
+ }
24
+ .menuItem .menuItemIcon{
25
+ font-size: 20px;
26
+ }
27
+ .menuItem .menuItemText{
28
+ display: block;
29
+ position: relative;
30
+ width: 100%;
31
+ padding-right: 35px;
32
+ }
33
+ .menuItem .menuItemText .menuItemBadge{
34
+ position: absolute;
35
+ right: 0px;
36
+ top: 50%;
37
+ padding: 0px 8px;
38
+ transform: translateY(-50%);
39
+ background-color: #0000003d;
40
+ color: #fff;
41
+ border-radius: 10px;
42
+ padding-top: 1px;
43
+ font-size: 12px;
44
+ min-width: 25px;
45
+ font-weight: normal;
46
+ text-align: center;
47
+ }
48
+
49
+ .menuItem.menuItemShortMenu{
50
+ position: relative;
51
+ padding: 10px 10px;
52
+ justify-content: center;
53
+ }
54
+ .menuItem.menuItemShortMenu .menuItemIcon{
55
+ font-size: 24px;
56
+ }
57
+
58
+ .menuItem.menuItemShortMenu .menuItemText{
59
+ display: none;
60
+ }
61
+
62
+ .menuItem.menuItemShortMenu .menuItemIconSubMenu{
63
+ font-size: 13px;
64
+ position: absolute;
65
+ right: 8px;
66
+ top: 50%;
67
+ transform: translateY(-50%);
68
+ }
69
+
70
+ .menuItem.menuItemShortMenu:hover .menuItemText{
71
+ display: block;
72
+ position: absolute;
73
+ width: auto;
74
+ left: calc(100% + 5px);
75
+ top: 50%;
76
+ transform: translateY(-50%);
77
+ padding: 10px;
78
+ background-color: #000000;
79
+ color: #fff !important;
80
+ border-radius: 10px;
81
+ z-index: 1000;
82
+ white-space: nowrap;
83
+ }
84
+ .menuItem.menuItemShortMenu:hover .menuItemText.menuItemTextBadge{
85
+ padding-right: 50px;
86
+ }
87
+ .menuItem.menuItemShortMenu:hover .menuItemText.menuItemTextBadge .menuItemBadge{
88
+ right: 8px;
89
+ background-color: #ffffff46;
90
+ }
91
+ .menuItemOwner .menuItemOpen{
92
+ background-color: #283b5c;
93
+ }
94
+
95
+ .menuItemOwner .menuItemChildren{
96
+ display: none;
97
+ background-color: #30425f;
98
+
99
+ }
100
+ .menuItemOwner .menuItemChildrenOpen{
101
+ display: block;
102
102
  }
package/dist/components/MyModal/MyModal.css CHANGED
@@ -1,84 +1,84 @@
1
- .modal-overlay {
2
- position: fixed;
3
- top: 0;
4
- left: 0;
5
- right: 0;
6
- bottom: 0;
7
- padding: 25px 0;
8
- background-color: rgba(0, 0, 0, 0.5);
9
- display: flex;
10
- justify-content: center;
11
- /* align-items: center; */
12
- /* Overlay için overflow özelliği */
13
- overflow-y: auto;
14
- z-index: 99;
15
- }
16
- .modal-overlay.top {
17
- align-items: baseline;
18
- }
19
-
20
- .modal-overlay .modal {
21
- /* Modal için maksimum yükseklik ve scroll */
22
-
23
- /* Modalın üst ve alt kısmında boşluk bırakmak için */
24
- /* margin: 20px 0; */
25
- height: max-content;
26
- background-color: #ebeef3;
27
- padding: 0 12px;
28
- border-radius: 10px;
29
- min-width: 200px;
30
- max-width: 100%;
31
- box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
32
- }
33
-
34
- .modal-overlay .modal .modal-header {
35
- display: flex;
36
- width: 100%;
37
- justify-content: space-between;
38
- align-items: center;
39
- padding: 15px 0;
40
- }
41
- .modal-overlay .modal .modal-header h4 {
42
- margin-top: 0px;
43
- padding-left: 8px;
44
- }
45
-
46
- .modal-overlay .modal .modal-header .close-button {
47
- background: none;
48
- border: none;
49
- height: 25px;
50
- font-size: 32px;
51
- color: #cdcdcd;
52
- background: none;
53
- padding: 0px;
54
- cursor: pointer;
55
- margin: -10px 10px 0 0;
56
- }
57
-
58
- .modal-overlay .modal .modal-header .close-button:hover {
59
- background: none;
60
- color: #9c9c9c;
61
- }
62
-
63
- .modal-overlay .modal .modal-content {
64
- display: block;
65
- width: 100%;
66
- padding: 0px 0 15px 0;
67
- /* max-height: calc(100vh - 80px); */
68
- /* overflow-y: auto; */
69
- }
70
-
71
- .MyModalTagBody {
72
- display: block;
73
- width: 100%;
74
- padding: 12px;
75
- background: #fff;
76
- border-radius: 12px;
77
- }
78
-
79
- .MyModalTagFooter {
80
- display: flex;
81
- justify-content: flex-end;
82
- gap: 10px;
83
- padding: 12px 0px;
84
- }
1
+ .modal-overlay {
2
+ position: fixed;
3
+ top: 0;
4
+ left: 0;
5
+ right: 0;
6
+ bottom: 0;
7
+ padding: 25px 0;
8
+ background-color: rgba(0, 0, 0, 0.5);
9
+ display: flex;
10
+ justify-content: center;
11
+ /* align-items: center; */
12
+ /* Overlay için overflow özelliği */
13
+ overflow-y: auto;
14
+ z-index: 99;
15
+ }
16
+ .modal-overlay.top {
17
+ align-items: baseline;
18
+ }
19
+
20
+ .modal-overlay .modal {
21
+ height: max-content;
22
+ background-color: #ebeef3;
23
+ padding: 12px 15px !important;
24
+ border-radius: 10px;
25
+ min-width: 200px;
26
+ max-width: 100%;
27
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
28
+ display: flex;
29
+ flex-direction: column;
30
+ gap: 10px;
31
+ }
32
+
33
+ .modal-overlay .modal .modal-header {
34
+ display: flex;
35
+ width: 100%;
36
+ justify-content: space-between;
37
+ align-items: center;
38
+ padding: 8px 0 !important;
39
+ }
40
+ .modal-overlay .modal .modal-header h4 {
41
+ margin-top: 0px;
42
+ padding-left: 8px;
43
+ }
44
+
45
+ .modal-overlay .modal .modal-header .close-button {
46
+ background: none;
47
+ border: none;
48
+ height: 25px;
49
+ font-size: 32px;
50
+ color: #cdcdcd;
51
+ background: none;
52
+ padding: 0px;
53
+ cursor: pointer;
54
+ margin: -10px 10px 0 0;
55
+ }
56
+
57
+ .modal-overlay .modal .modal-header .close-button:hover {
58
+ background: none;
59
+ color: #9c9c9c;
60
+ }
61
+
62
+ .modal-overlay .modal .modal-content {
63
+ display: block;
64
+ width: 100%;
65
+ padding: 0px !important;
66
+ /* max-height: calc(100vh - 80px); */
67
+ /* overflow-y: auto; */
68
+ }
69
+
70
+ .MyModalTagBody {
71
+ display: block;
72
+ width: 100%;
73
+ padding: 12px;
74
+ background: #fff;
75
+ border-radius: 12px;
76
+ }
77
+
78
+ .MyModalTagFooter {
79
+ display: flex;
80
+ justify-content: flex-end;
81
+ gap: 10px;
82
+ padding: 0px;
83
+ margin-top: 0px !important;
84
+ }
package/dist/components/MyModal/MyModal.js CHANGED
@@ -77,7 +77,7 @@ const MyModal = ({
77
77
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
78
78
  className: "modal-content",
79
79
  children: childBody
80
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
80
+ }), childFooter && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
81
81
  className: "modal-footer",
82
82
  children: childFooter
83
83
  })]
package/dist/components/MyNotFound/MyNotFound.css CHANGED
@@ -1,22 +1,22 @@
1
- .my-nodata{
2
- display: flex;
3
- flex-direction: column;
4
- width: 100%;
5
- justify-content: center;
6
- align-items: center;
7
- padding: 25px;
8
- font-size: 17px;
9
- color: #444;
10
- }
11
-
12
- .my-nodata .icon{
13
- font-size: 42px;
14
- color: #adadad;
15
- margin-bottom: 10px;
16
- }
17
-
18
- .my-nodata span{
19
- display: block;
20
- width: 100%;
21
- text-align: center;
1
+ .my-nodata{
2
+ display: flex;
3
+ flex-direction: column;
4
+ width: 100%;
5
+ justify-content: center;
6
+ align-items: center;
7
+ padding: 25px;
8
+ font-size: 17px;
9
+ color: #444;
10
+ }
11
+
12
+ .my-nodata .icon{
13
+ font-size: 42px;
14
+ color: #adadad;
15
+ margin-bottom: 10px;
16
+ }
17
+
18
+ .my-nodata span{
19
+ display: block;
20
+ width: 100%;
21
+ text-align: center;
22
22
  }