impaktapps-ui-builder 1.0.147-test.1 → 1.0.147-test.11

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.
@@ -1,224 +1,160 @@
1
1
  export default function Card(theme){
2
- const uiSchema = {
2
+ const uiSchema =
3
+ {
3
4
  type: "WrapperLayout",
4
5
  config: {
5
6
  main: {},
6
- style:{
7
- wrapperStyle: {
7
+ style: {
8
+ wrapperStyle: {
8
9
  position: "relative",
9
10
  top: "50%",
10
11
  transform: "translateY(-50%)",
11
- marginBottom: 0
12
+ marginBottom: 0,
13
+ borderRadius: "8px"
12
14
  },
13
15
  componentsBoxStyle: {
14
- boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)",
15
- flexDirection: "row",
16
- flexWrap: "nowrap",
17
- width: "100% !important",
18
- background: "transparent",
19
- border: `1.5px solid ${theme.palette.primary.light}`,
20
- borderRadius: "8px",
21
- padding: "0px 4px",
22
- height: "100%",
23
- alignItems: "center",
24
- marginLeft: "0px",
25
- "&: hover": {
26
- background: `${theme.palette.primary.main}`,
27
- border: `1.5px solid black`,
28
- "& p": {
29
- color: "white",
16
+ boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)",
17
+ flexDirection: "column",
18
+ flexWrap: "nowrap",
19
+ width: "100% !important",
20
+ background: "transparent",
21
+ // border: `1.5px solid ${theme.palette.primary.light}`,
22
+ borderRadius: "8px",
23
+ padding: "20px 20px 20px 14px",
24
+ height: "100%",
25
+ minHeight: "140px",
26
+ position: "relative",
27
+ marginLeft: "0px",
28
+ "&: hover": {
29
+ background: `${theme.palette.primary.main}`,
30
+ // border: `1.5px solid black`,
31
+ // "& p": {
32
+ // color: "white",
33
+ // },
30
34
  },
31
35
  },
32
36
  },
33
- },
34
-
35
- layout: { xs: 12, sm: 12, md: 6, lg: 6 },
37
+
38
+ layout: { xs: 12, sm: 12, md: 6, lg: 3 },
36
39
  },
37
40
  elements: [
38
41
  {
39
- type: "HorizontalLayout",
42
+ type: "Control",
43
+ scope: "#/properties/programType",
40
44
  config: {
41
- layout: 9,
42
- },
43
- elements: [
44
- {
45
- type: "WrapperLayout",
46
- config: {
47
- main: {
48
- columnSpacing: 0,
49
- gap: 0,
50
- },
51
- style:{
52
- wrapperStyle: {
53
- background: "transparent",
54
- marginBottom: 0
55
- },
56
- componentsBoxStyle: {
57
- flexDirection: "column",
58
- flexWrap: "nowrap",
59
- width: "100%",
60
- height: "inherit",
61
- background: "transparent",
62
- borderRadius: "0px",
63
- paddingRight: 0
64
- },
65
- },
66
-
67
- layout: 12,
45
+ main: {
46
+ url: "https://www.svgrepo.com/show/500606/loading.svg",
47
+ },
48
+ style: {
49
+ containerStyle: {
50
+ position: "absolute",
51
+ top: "12px",
52
+ right: "12px",
53
+ display: "flex",
54
+ justifyContent: "flex-end",
55
+ alignItems: "flex-start",
68
56
  },
69
- elements: [
70
- {
71
- type: "WrapperLayout",
72
- config: {
73
- main: {
74
- columnSpacing: 0,
75
- gap: 0,
76
- },
77
- style:{
78
- wrapperStyle: {
79
- background: "transparent",
80
- marginBottom: 0
81
- },
82
- componentsBoxStyle: {
83
- flexDirection: "row",
84
- flexWrap: "nowrap",
85
- width: "100%",
86
- height: "0",
87
- background: "transparent",
88
- borderRadius: "0px",
89
- marginLeft: "-10px",
90
- marginTop: "-8px",
91
- justifyContent: "start",
92
- position: "relative",
93
-
94
- },
95
- },
96
-
97
- layout: 12,
98
- },
99
- elements: [
100
- {
101
- type: "Control",
102
- scope: "#/properties/programType",
103
- config: {
104
- main: {
105
- heading: "",
106
- },
107
- style: {
108
- color: "black",
109
- display: "flex",
110
- fontSize: { xs: "24px", md: "28px" },
111
- fontWeight: "bold",
112
- background: "inherit",
113
- justifyContent: "flex-start",
114
- width: "auto",
115
- margin: "-8px",
116
- marginLeft: "-24px",
117
- height: 0
118
- },
119
- // layout: 1,
120
- },
121
- options: {
122
- widget: "Box",
123
- },
124
- },
125
- {
126
- type: "Control",
127
- scope: "#/properties/programType",
128
- config: {
129
- main: {
130
- heading: "5000.00",
131
- },
132
- style: {
133
- color: "black",
134
- display: "flex",
135
- fontSize: { xs: "24px", md: "25px" },
136
- fontWeight: "bold",
137
- background: "inherit",
138
- justifyContent: "flex-start",
139
- width: "auto",
140
- margin: "-8px",
141
- marginTop: "-6px",
142
- position: "absolute",
143
- left: "7px",
144
- whiteSpace: "nowrap",
145
- overflowX: "auto",
146
- overflowY: "hidden",
147
- scrollbarWidth: "none",
148
- msOverflowStyle: "none",
149
- maxWidth: "calc(100% + 20px)",
150
- "&::-webkit-scrollbar": {
151
- display: "none",
152
- }
153
- },
154
- // layout: 11,
155
- },
156
- options: {
157
- widget: "Box",
158
- },
159
- },
160
- ],
161
- },
162
- {
163
- type: "Control",
164
- scope: "#/properties/programType",
165
- config: {
166
- main: {
167
- heading: "Total Earnings",
168
- },
169
- style: {
170
- color: "black",
171
- fontSize: "16px",
172
- justifyContent: "center",
173
- whiteSpace: "nowrap",
174
- overflowX: "auto",
175
- overflowY: "hidden",
176
- scrollbarWidth: "none",
177
- msOverflowStyle: "none",
178
- background: "inherit",
179
- width: "calc(100% + 8px)",
180
- margin: "-8px",
181
- marginTop: { xs: "16px", md: "20px" },
182
- "&::-webkit-scrollbar": {
183
- display: "none",
184
- }
185
- },
186
- layout: 12,
187
- },
57
+ imageStyle: {
58
+ width: "48px",
59
+ height: "48px",
60
+ padding: "0px",
61
+ margin: "0px",
62
+ },
63
+ },
64
+ },
65
+ options: {
66
+ widget: "Image",
67
+ },
68
+ },
69
+ {
70
+ type: "Control",
71
+ scope: "#/properties/programType",
72
+ config: {
73
+ main: {
74
+ heading: "Total Earnings",
75
+ },
76
+ style: {
77
+ color: "black",
78
+ fontSize: "17px",
79
+ fontWeight: "200",
80
+ justifyContent: "flex-start",
81
+ background: "inherit",
82
+ margin: "0px",
83
+ marginTop: "-8px",
84
+ marginBottom:"12px",
188
85
 
189
- options: {
190
- widget: "Box",
191
- },
192
- },
193
- ],
86
+ maxWidth: "160px",
87
+ whiteSpace: "nowrap",
88
+ overflowX: "auto",
89
+ scrollbarWidth: "none",
90
+ "&::-webkit-scrollbar": {
91
+ display: "none",
92
+ },
194
93
  },
195
- ],
94
+ },
95
+ options: {
96
+ widget: "Box",
97
+ },
196
98
  },
197
99
  {
198
100
  type: "Control",
199
101
  scope: "#/properties/programType",
200
102
  config: {
201
103
  main: {
202
- url: "https://www.svgrepo.com/show/500606/loading.svg",
104
+ heading: "5000.00",
203
105
  },
204
106
  style: {
205
- containerStyle: {
206
- height: "100%",
207
- display: "flex",
208
- justifyContent: "end",
107
+ color: "black",
108
+ display: "flex",
109
+ fontSize: { xs: "22px", md: "30px" },
110
+ fontWeight: "450",
111
+ background: "inherit",
112
+ justifyContent: "flex-start",
113
+ width: "100%",
114
+ margin: "0px",
115
+ marginBottom: "8px",
116
+ lineHeight: "1",
117
+
118
+ maxWidth: "200px",
119
+ whiteSpace: "nowrap",
120
+ overflowX: "auto",
121
+ scrollbarWidth: "none",
122
+ "&::-webkit-scrollbar": {
123
+ display: "none",
209
124
  },
210
- imageStyle: {
211
- width: "unset",
212
- fontSize: "none",
213
- padding: "4px",
214
- margin: "0px 0px 0px 8px",
215
- height: "64px",
125
+ },
126
+ },
127
+ options: {
128
+ widget: "Box",
129
+ },
130
+ },
131
+ {
132
+ type: "Control",
133
+ scope: "#/properties/programType",
134
+ config: {
135
+ main: {
136
+ heading: "Increased from last month",
137
+ },
138
+ style: {
139
+ color: "#767677ff",
140
+ fontSize: "11px",
141
+ fontWeight: "400",
142
+ justifyContent: "flex-start",
143
+ background: "inherit",
144
+ margin: "0px",
145
+ paddingLeft: "2px",
146
+
147
+ maxWidth: "200px",
148
+ whiteSpace: "nowrap",
149
+ overflowX: "auto",
150
+ scrollbarWidth: "none",
151
+ "&::-webkit-scrollbar": {
152
+ display: "none",
216
153
  },
217
154
  },
218
- layout: 3,
219
155
  },
220
156
  options: {
221
- widget: "Image",
157
+ widget: "Box",
222
158
  },
223
159
  },
224
160
  ],
@@ -0,0 +1,219 @@
1
+ export default function Cardasd(theme){
2
+ const uiSchema = {
3
+ type: "WrapperLayout",
4
+ config: {
5
+ main: {},
6
+ wrapperStyle: {
7
+ position: "relative",
8
+ top: "50%",
9
+ transform: "translateY(-50%)",
10
+ marginBottom: 0
11
+ },
12
+ componentsBoxStyle: {
13
+ boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)",
14
+ flexDirection: "row",
15
+ flexWrap: "nowrap",
16
+ width: "100% !important",
17
+ background: "transparent",
18
+ border: `1.5px solid ${theme.palette.primary.light}`,
19
+ borderRadius: "8px",
20
+ padding: "0px 4px",
21
+ height: "100%",
22
+ alignItems: "center",
23
+ marginLeft: "0px",
24
+ "&: hover": {
25
+ background: `${theme.palette.primary.main}`,
26
+ border: `1.5px solid black`,
27
+ "& p": {
28
+ color: "white",
29
+ },
30
+ },
31
+ },
32
+ layout: { xs: 12, sm: 12, md: 6, lg: 6 },
33
+ },
34
+ elements: [
35
+ {
36
+ type: "HorizontalLayout",
37
+ config: {
38
+ layout: 9,
39
+ },
40
+ elements: [
41
+ {
42
+ type: "WrapperLayout",
43
+ config: {
44
+ main: {
45
+ columnSpacing: 0,
46
+ gap: 0,
47
+ },
48
+ wrapperStyle: {
49
+ background: "transparent",
50
+ marginBottom: 0
51
+ },
52
+ componentsBoxStyle: {
53
+ flexDirection: "column",
54
+ flexWrap: "nowrap",
55
+ width: "100%",
56
+ height: "inherit",
57
+ background: "transparent",
58
+ borderRadius: "0px",
59
+ paddingRight: 0
60
+ },
61
+ layout: 12,
62
+ },
63
+ elements: [
64
+ {
65
+ type: "WrapperLayout",
66
+ config: {
67
+ main: {
68
+ columnSpacing: 0,
69
+ gap: 0,
70
+ },
71
+ wrapperStyle: {
72
+ background: "transparent",
73
+ marginBottom: 0
74
+ },
75
+ componentsBoxStyle: {
76
+ flexDirection: "row",
77
+ flexWrap: "nowrap",
78
+ width: "100%",
79
+ height: "0",
80
+ background: "transparent",
81
+ borderRadius: "0px",
82
+ marginLeft: "-10px",
83
+ marginTop: "-8px",
84
+ justifyContent: "start",
85
+ position: "relative",
86
+
87
+ },
88
+ layout: 12,
89
+ },
90
+ elements: [
91
+ {
92
+ type: "Control",
93
+ scope: "#/properties/programType",
94
+ config: {
95
+ main: {
96
+ heading: "",
97
+ },
98
+ style: {
99
+ color: "black",
100
+ display: "flex",
101
+ fontSize: { xs: "24px", md: "28px" },
102
+ fontWeight: "bold",
103
+ background: "inherit",
104
+ justifyContent: "flex-start",
105
+ width: "auto",
106
+ margin: "-8px",
107
+ marginLeft: "-24px",
108
+ height: 0
109
+ },
110
+ // layout: 1,
111
+ },
112
+ options: {
113
+ widget: "Box",
114
+ },
115
+ },
116
+ {
117
+ type: "Control",
118
+ scope: "#/properties/programType",
119
+ config: {
120
+ main: {
121
+ heading: "5000.00",
122
+ },
123
+ style: {
124
+ color: "black",
125
+ display: "flex",
126
+ fontSize: { xs: "24px", md: "25px" },
127
+ fontWeight: "bold",
128
+ background: "inherit",
129
+ justifyContent: "flex-start",
130
+ width: "auto",
131
+ margin: "-8px",
132
+ marginTop: "-6px",
133
+ position: "absolute",
134
+ left: "7px",
135
+ whiteSpace: "nowrap",
136
+ overflowX: "auto",
137
+ overflowY: "hidden",
138
+ scrollbarWidth: "none",
139
+ msOverflowStyle: "none",
140
+ maxWidth: "calc(100% + 20px)",
141
+ "&::-webkit-scrollbar": {
142
+ display: "none",
143
+ }
144
+ },
145
+ // layout: 11,
146
+ },
147
+ options: {
148
+ widget: "Box",
149
+ },
150
+ },
151
+ ],
152
+ },
153
+ {
154
+ type: "Control",
155
+ scope: "#/properties/programType",
156
+ config: {
157
+ main: {
158
+ heading: "Total Earnings",
159
+ },
160
+ style: {
161
+ color: "black",
162
+ fontSize: "16px",
163
+ justifyContent: "center",
164
+ whiteSpace: "nowrap",
165
+ overflowX: "auto",
166
+ overflowY: "hidden",
167
+ scrollbarWidth: "none",
168
+ msOverflowStyle: "none",
169
+ background: "inherit",
170
+ width: "calc(100% + 8px)",
171
+ margin: "-8px",
172
+ marginTop: { xs: "16px", md: "20px" },
173
+ "&::-webkit-scrollbar": {
174
+ display: "none",
175
+ }
176
+ },
177
+ layout: 12,
178
+ },
179
+
180
+ options: {
181
+ widget: "Box",
182
+ },
183
+ },
184
+ ],
185
+ },
186
+ ],
187
+ },
188
+ {
189
+ type: "Control",
190
+ scope: "#/properties/programType",
191
+ config: {
192
+ main: {
193
+ url: "https://www.svgrepo.com/show/500606/loading.svg",
194
+ },
195
+ style: {
196
+ containerStyle: {
197
+ height: "100%",
198
+ display: "flex",
199
+ justifyContent: "end",
200
+ },
201
+ imageStyle: {
202
+ width: "unset",
203
+ fontSize: "none",
204
+ padding: "4px",
205
+ margin: "0px 0px 0px 8px",
206
+ height: "64px",
207
+ },
208
+ },
209
+ layout: 3,
210
+ },
211
+ options: {
212
+ widget: "Image",
213
+ },
214
+ },
215
+ ],
216
+ };
217
+
218
+ return uiSchema
219
+ }