@selfcommunity/react-theme-default 0.4.2-courses.186 → 0.4.2-courses.188

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 (38) hide show
  1. package/lib/cjs/components/SCAddUsersButton.d.ts +7 -1
  2. package/lib/cjs/components/SCAddUsersButton.js +6 -1
  3. package/lib/cjs/components/SCCourseDashboard.d.ts +8 -11
  4. package/lib/cjs/components/SCCourseDashboard.js +13 -16
  5. package/lib/cjs/components/SCCourseForm.d.ts +20 -8
  6. package/lib/cjs/components/SCCourseForm.js +17 -7
  7. package/lib/cjs/components/SCCourseTypePopover.d.ts +23 -0
  8. package/lib/cjs/components/SCCourseTypePopover.js +24 -0
  9. package/lib/cjs/components/SCCourseUsersTable.d.ts +5 -3
  10. package/lib/cjs/components/SCCourseUsersTable.js +5 -4
  11. package/lib/cjs/components/SCCourses.d.ts +1 -1
  12. package/lib/cjs/components/SCCourses.js +2 -2
  13. package/lib/cjs/components/SCEditCourse.d.ts +50 -29
  14. package/lib/cjs/components/SCEditCourse.js +52 -31
  15. package/lib/cjs/components/SCEmptyStatus.d.ts +1 -0
  16. package/lib/cjs/components/SCEmptyStatus.js +1 -0
  17. package/lib/cjs/index.d.ts +114 -53
  18. package/lib/cjs/index.js +2 -0
  19. package/lib/esm/components/SCAddUsersButton.d.ts +7 -1
  20. package/lib/esm/components/SCAddUsersButton.js +6 -1
  21. package/lib/esm/components/SCCourseDashboard.d.ts +8 -11
  22. package/lib/esm/components/SCCourseDashboard.js +13 -16
  23. package/lib/esm/components/SCCourseForm.d.ts +20 -8
  24. package/lib/esm/components/SCCourseForm.js +17 -7
  25. package/lib/esm/components/SCCourseTypePopover.d.ts +23 -0
  26. package/lib/esm/components/SCCourseTypePopover.js +22 -0
  27. package/lib/esm/components/SCCourseUsersTable.d.ts +5 -3
  28. package/lib/esm/components/SCCourseUsersTable.js +5 -4
  29. package/lib/esm/components/SCCourses.d.ts +1 -1
  30. package/lib/esm/components/SCCourses.js +2 -2
  31. package/lib/esm/components/SCEditCourse.d.ts +50 -29
  32. package/lib/esm/components/SCEditCourse.js +52 -31
  33. package/lib/esm/components/SCEmptyStatus.d.ts +1 -0
  34. package/lib/esm/components/SCEmptyStatus.js +1 -0
  35. package/lib/esm/index.d.ts +114 -53
  36. package/lib/esm/index.js +2 -0
  37. package/lib/umd/react-theme-default.js +1 -1
  38. package/package.json +2 -2
package/lib/esm/components/SCCourseDashboard.js CHANGED
@@ -8,9 +8,6 @@ const Component = {
8
8
  '& .SCCourseDashboard-contrast-color': {
9
9
  color: getContrastRatio(theme.palette.background.default, theme.palette.common.white) > 4.5 ? theme.palette.common.white : undefined
10
10
  },
11
- '& .SCCourseDashboard-contrast-bg-color': {
12
- backgroundColor: getContrastRatio(theme.palette.background.default, theme.palette.common.white) > 4.5 ? theme.palette.common.white : undefined
13
- },
14
11
  '& .SCCourseDashboard-header': {
15
12
  [theme.breakpoints.down('sm')]: {
16
13
  paddingLeft: '14px',
@@ -52,15 +49,7 @@ const Component = {
52
49
  '& .SCCourseDashboard-header-icon-wrapper': {
53
50
  flexDirection: 'row',
54
51
  alignItems: 'center',
55
- gap: theme.spacing(1),
56
- '& .SCCourseDashboard-header-button-popover': {
57
- padding: 0,
58
- textDecoration: 'underline',
59
- '&:hover': {
60
- backgroundColor: 'unset',
61
- textDecoration: 'underline'
62
- }
63
- }
52
+ gap: theme.spacing(1)
64
53
  }
65
54
  }
66
55
  }
@@ -80,8 +69,9 @@ const Component = {
80
69
  flex: 1,
81
70
  gap: '6px',
82
71
  border: `1px solid ${theme.palette.grey['300']}`,
83
- borderRadius: '10px',
72
+ borderRadius: '5px',
84
73
  padding: theme.spacing('17px', 3, '19px'),
74
+ backgroundColor: theme.palette.common.white,
85
75
  '& .SCCourseParticipantsButton-root': {
86
76
  justifyContent: 'flex-start',
87
77
  padding: 0
@@ -101,13 +91,17 @@ const Component = {
101
91
  }
102
92
  },
103
93
  '& .SCCourseDashboard-tab-panel': {
104
- padding: theme.spacing(3, 0, 0),
94
+ padding: theme.spacing(3, 0),
105
95
  [theme.breakpoints.down('md')]: {
106
96
  paddingLeft: '14px',
107
97
  paddingRight: '14px'
108
98
  }
109
99
  },
110
100
  '& .SCCourseDashboard-comments-container': {
101
+ backgroundColor: theme.palette.common.white,
102
+ border: `1px solid ${theme.palette.grey['300']}`,
103
+ borderRadius: '5px',
104
+ padding: '5px 0',
111
105
  [theme.breakpoints.up('sm')]: {
112
106
  paddingLeft: '36px',
113
107
  paddingRight: '36px'
@@ -156,6 +150,7 @@ const Component = {
156
150
  flexDirection: 'row',
157
151
  alignItems: 'center',
158
152
  justifyContent: 'space-between',
153
+ backgroundColor: theme.palette.common.white,
159
154
  '& .SCCourseDashboard-user': {
160
155
  flexDirection: 'row',
161
156
  alignItems: 'center',
@@ -192,6 +187,7 @@ const Component = {
192
187
  borderTopLeftRadius: '5px',
193
188
  borderTopRightRadius: '5px',
194
189
  padding: '19px 24px',
190
+ backgroundColor: theme.palette.common.white,
195
191
  '& .SCCourseDashboard-circle': {
196
192
  width: '6px',
197
193
  height: '6px',
@@ -207,7 +203,8 @@ const Component = {
207
203
  gap: '13px',
208
204
  border: `1px solid ${theme.palette.grey['300']}`,
209
205
  borderRadius: '5px',
210
- padding: '11px 24px'
206
+ padding: '11px 24px',
207
+ backgroundColor: theme.palette.common.white
211
208
  },
212
209
  '& .SCCourseDashboard-percentage-wrapper': {
213
210
  justifyContent: 'space-between',
@@ -288,7 +285,7 @@ const Component = {
288
285
  flex: 1,
289
286
  gap: '6px',
290
287
  border: `1px solid ${theme.palette.grey['300']}`,
291
- borderRadius: '10px',
288
+ borderRadius: '5px',
292
289
  padding: theme.spacing('17px', 3, '19px'),
293
290
  '& .SCCourseParticipantsButton-root': {
294
291
  justifyContent: 'flex-start',
package/lib/esm/components/SCCourseForm.d.ts CHANGED
@@ -1,12 +1,11 @@
1
1
  declare const Component: {
2
2
  styleOverrides: {
3
- root: ({ theme }: any) => {
3
+ root: ({ theme }: {
4
+ theme: any;
5
+ }) => {
4
6
  '& .SCCourseForm-contrast-color': {
5
7
  color: any;
6
8
  };
7
- '& .SCCourseForm-contrast-bg-color': {
8
- backgroundColor: any;
9
- };
10
9
  '& .SCCourseForm-cover': {
11
10
  position: string;
12
11
  height: number;
@@ -24,10 +23,16 @@ declare const Component: {
24
23
  marginTop: any;
25
24
  color: any;
26
25
  };
26
+ '& h5': {
27
+ padding: any;
28
+ };
27
29
  '& .SCCourseForm-form': {
28
- '& h5': {
29
- padding: any;
30
- };
30
+ border: string;
31
+ borderBottom: string;
32
+ borderRadius: string;
33
+ borderBottomLeftRadius: string;
34
+ borderBottomRightRadius: string;
35
+ backgroundColor: any;
31
36
  '& .SCCourseForm-name': {
32
37
  marginTop: any;
33
38
  };
@@ -35,6 +40,7 @@ declare const Component: {
35
40
  marginTop: any;
36
41
  };
37
42
  '& .SCCourseForm-edit-root': {
43
+ backgroundColor: any;
38
44
  marginTop: any;
39
45
  '& .SCCourseForm-edit-card': {
40
46
  display: string;
@@ -127,7 +133,13 @@ declare const Component: {
127
133
  color: any;
128
134
  };
129
135
  '& .SCCourseForm-actions': {
130
- marginTop: any;
136
+ border: string;
137
+ borderTop: string;
138
+ borderRadius: string;
139
+ borderTopLeftRadius: string;
140
+ borderTopRightRadius: string;
141
+ backgroundColor: any;
142
+ padding: any;
131
143
  display: string;
132
144
  justifyContent: string;
133
145
  gap: any;
package/lib/esm/components/SCCourseForm.js CHANGED
@@ -5,9 +5,6 @@ const Component = {
5
5
  '& .SCCourseForm-contrast-color': {
6
6
  color: getContrastRatio(theme.palette.background.default, theme.palette.common.white) > 4.5 ? theme.palette.common.white : undefined
7
7
  },
8
- '& .SCCourseForm-contrast-bg-color': {
9
- backgroundColor: getContrastRatio(theme.palette.background.default, theme.palette.common.white) > 4.5 ? theme.palette.common.white : undefined
10
- },
11
8
  '& .SCCourseForm-cover': {
12
9
  position: 'relative',
13
10
  height: 103,
@@ -25,10 +22,16 @@ const Component = {
25
22
  marginTop: theme.spacing(4.5),
26
23
  color: theme.palette.text.secondary
27
24
  },
25
+ '& h5': {
26
+ padding: theme.spacing(1)
27
+ },
28
28
  '& .SCCourseForm-form': {
29
- '& h5': {
30
- padding: theme.spacing(1)
31
- },
29
+ border: `1px solid ${theme.palette.grey['300']}`,
30
+ borderBottom: 'unset',
31
+ borderRadius: '5px',
32
+ borderBottomLeftRadius: 'unset',
33
+ borderBottomRightRadius: 'unset',
34
+ backgroundColor: theme.palette.common.white,
32
35
  '& .SCCourseForm-name': {
33
36
  marginTop: theme.spacing(3)
34
37
  },
@@ -36,6 +39,7 @@ const Component = {
36
39
  marginTop: theme.spacing(1)
37
40
  },
38
41
  '& .SCCourseForm-edit-root': {
42
+ backgroundColor: theme.palette.common.white,
39
43
  marginTop: theme.spacing(1),
40
44
  '& .SCCourseForm-edit-card': {
41
45
  display: 'flex',
@@ -128,7 +132,13 @@ const Component = {
128
132
  color: theme.palette.error.main
129
133
  },
130
134
  '& .SCCourseForm-actions': {
131
- marginTop: theme.spacing(2),
135
+ border: `1px solid ${theme.palette.grey['300']}`,
136
+ borderTop: 'unset',
137
+ borderRadius: '5px',
138
+ borderTopLeftRadius: 'unset',
139
+ borderTopRightRadius: 'unset',
140
+ backgroundColor: theme.palette.common.white,
141
+ padding: theme.spacing(2, 0),
132
142
  display: 'flex',
133
143
  justifyContent: 'flex-end',
134
144
  gap: theme.spacing(2),
package/lib/esm/components/SCCourseTypePopover.d.ts ADDED
@@ -0,0 +1,23 @@
1
+ declare const Component: {
2
+ styleOverrides: {
3
+ root: ({ theme }: {
4
+ theme: any;
5
+ }) => {
6
+ flexDirection: string;
7
+ alignItems: string;
8
+ gap: any;
9
+ '&.SCCourseTypePopover-contrast-color': {
10
+ color: any;
11
+ };
12
+ '& .SCCourseTypePopover-button': {
13
+ padding: number;
14
+ textDecoration: string;
15
+ '&:hover': {
16
+ backgroundColor: string;
17
+ textDecoration: string;
18
+ };
19
+ };
20
+ };
21
+ };
22
+ };
23
+ export default Component;
package/lib/esm/components/SCCourseTypePopover.js ADDED
@@ -0,0 +1,22 @@
1
+ import { getContrastRatio } from '@mui/material';
2
+ const Component = {
3
+ styleOverrides: {
4
+ root: ({ theme }) => ({
5
+ flexDirection: 'row',
6
+ alignItems: 'center',
7
+ gap: theme.spacing(1),
8
+ '&.SCCourseTypePopover-contrast-color': {
9
+ color: getContrastRatio(theme.palette.background.default, theme.palette.common.white) > 4.5 ? theme.palette.common.white : undefined
10
+ },
11
+ '& .SCCourseTypePopover-button': {
12
+ padding: 0,
13
+ textDecoration: 'underline',
14
+ '&:hover': {
15
+ backgroundColor: 'unset',
16
+ textDecoration: 'underline'
17
+ }
18
+ }
19
+ })
20
+ }
21
+ };
22
+ export default Component;
package/lib/esm/components/SCCourseUsersTable.d.ts CHANGED
@@ -3,9 +3,11 @@ declare const Component: {
3
3
  root: ({ theme }: {
4
4
  theme: any;
5
5
  }) => {
6
- '&.SCCourseUsersTable-contrast-bg-color': {
7
- backgroundColor: any;
8
- };
6
+ border: string;
7
+ borderTop: string;
8
+ borderRadius: string;
9
+ paddingBottom: string;
10
+ backgroundColor: any;
9
11
  '& .SCCourseUsersTable-search': {
10
12
  '& > .MuiInputBase-root': {
11
13
  borderBottomLeftRadius: string;
package/lib/esm/components/SCCourseUsersTable.js CHANGED
@@ -1,10 +1,11 @@
1
- import { getContrastRatio } from '@mui/material';
2
1
  const Component = {
3
2
  styleOverrides: {
4
3
  root: ({ theme }) => ({
5
- '&.SCCourseUsersTable-contrast-bg-color': {
6
- backgroundColor: getContrastRatio(theme.palette.background.default, theme.palette.common.white) > 4.5 ? theme.palette.common.white : undefined
7
- },
4
+ border: `1px solid ${theme.palette.grey['300']}`,
5
+ borderTop: 'unset',
6
+ borderRadius: '5px',
7
+ paddingBottom: '5px',
8
+ backgroundColor: theme.palette.common.white,
8
9
  '& .SCCourseUsersTable-search': {
9
10
  '& > .MuiInputBase-root': {
10
11
  borderBottomLeftRadius: 'unset',
package/lib/esm/components/SCCourses.d.ts CHANGED
@@ -123,7 +123,7 @@ declare const Component: {
123
123
  };
124
124
  };
125
125
  };
126
- coursesChipRoot: ({ theme, showForMe, showMyCourses }: any) => {
126
+ coursesChipRoot: ({ theme, showMine, showManagedCourses }: any) => {
127
127
  height: any;
128
128
  borderRadius: any;
129
129
  color: any;
package/lib/esm/components/SCCourses.js CHANGED
@@ -123,10 +123,10 @@ const Component = {
123
123
  }
124
124
  }
125
125
  }),
126
- coursesChipRoot: ({ theme, showForMe, showMyCourses }) => ({
126
+ coursesChipRoot: ({ theme, showMine, showManagedCourses }) => ({
127
127
  height: theme.spacing(5.25),
128
128
  borderRadius: theme.spacing(0.5),
129
- color: showForMe || showMyCourses ? theme.palette.common.white : theme.palette.text.primary,
129
+ color: showMine || showManagedCourses ? theme.palette.common.white : theme.palette.text.primary,
130
130
  '& .MuiIcon-root': {
131
131
  fontSize: '1rem',
132
132
  color: theme.palette.common.white
package/lib/esm/components/SCEditCourse.d.ts CHANGED
@@ -9,9 +9,6 @@ declare const Component: {
9
9
  '& .SCEditCourse-contrast-color': {
10
10
  color: any;
11
11
  };
12
- '& .SCEditCourse-contrast-bg-color': {
13
- backgroundColor: any;
14
- };
15
12
  '& .SCEditCourse-header': {
16
13
  [x: number]: {
17
14
  paddingLeft: any;
@@ -57,6 +54,14 @@ declare const Component: {
57
54
  };
58
55
  '& .SCEditCourse-status': {
59
56
  borderRadius: any;
57
+ '& .MuiButtonBase-root': {
58
+ padding: number;
59
+ textDecoration: string;
60
+ '&:hover': {
61
+ backgroundColor: string;
62
+ textDecoration: string;
63
+ };
64
+ };
60
65
  };
61
66
  '& .SCEditCourse-lesson-empty-status': {
62
67
  border: string;
@@ -75,6 +80,7 @@ declare const Component: {
75
80
  borderBottom: string;
76
81
  borderTopLeftRadius: string;
77
82
  borderTopRightRadius: string;
83
+ backgroundColor: any;
78
84
  '& .SCEditCourse-lessons-sections': {
79
85
  flexDirection: string;
80
86
  alignItems: string;
@@ -98,6 +104,7 @@ declare const Component: {
98
104
  border: string;
99
105
  borderBottomLeftRadius: string;
100
106
  borderBottomRightRadius: string;
107
+ backgroundColor: any;
101
108
  '& .SCEditCourse-table': {
102
109
  '& .SCEditCourse-cell-width': {
103
110
  width: string;
@@ -180,19 +187,25 @@ declare const Component: {
180
187
  marginTop: string;
181
188
  marginBottom: any;
182
189
  };
183
- '& .SCEditCourse-options-wrapper': {
184
- gap: any;
185
- maxWidth: string;
186
- margin: string;
187
- };
188
- '& .SCEditCourse-options-divider': {
189
- marginTop: string;
190
- marginBottom: any;
191
- };
192
- '& .SCEditCourse-options-button-wrapper': {
193
- alignItems: string;
194
- maxWidth: string;
195
- margin: string;
190
+ '& .SCEditCourse-options-container': {
191
+ border: string;
192
+ borderRadius: string;
193
+ padding: string;
194
+ backgroundColor: any;
195
+ '& .SCEditCourse-options-wrapper': {
196
+ gap: any;
197
+ maxWidth: string;
198
+ margin: string;
199
+ };
200
+ '& .SCEditCourse-options-divider': {
201
+ marginTop: string;
202
+ marginBottom: any;
203
+ };
204
+ '& .SCEditCourse-options-button-wrapper': {
205
+ alignItems: string;
206
+ maxWidth: string;
207
+ margin: string;
208
+ };
196
209
  };
197
210
  };
198
211
  };
@@ -241,12 +254,14 @@ declare const Component: {
241
254
  padding: any;
242
255
  border: string;
243
256
  borderRadius: string;
257
+ backgroundColor: any;
244
258
  };
245
259
  '& .SCEditCourse-table-container': {
246
260
  width: string;
247
261
  border: string;
248
262
  borderBottomLeftRadius: string;
249
263
  borderBottomRightRadius: string;
264
+ backgroundColor: any;
250
265
  '& .SCEditCourse-margin': {
251
266
  margin: string;
252
267
  };
@@ -265,19 +280,25 @@ declare const Component: {
265
280
  marginTop: string;
266
281
  marginBottom: any;
267
282
  };
268
- '& .SCEditCourse-options-wrapper': {
269
- gap: any;
270
- maxWidth: string;
271
- margin: string;
272
- };
273
- '& .SCEditCourse-options-divider': {
274
- marginTop: string;
275
- marginBottom: any;
276
- };
277
- '& .SCEditCourse-options-button-wrapper': {
278
- alignItems: string;
279
- maxWidth: string;
280
- margin: string;
283
+ '& .SCEditCourse-options-container': {
284
+ border: string;
285
+ borderRadius: string;
286
+ paddingBottom: string;
287
+ backgroundColor: any;
288
+ '& .SCEditCourse-options-wrapper': {
289
+ gap: any;
290
+ maxWidth: string;
291
+ margin: string;
292
+ };
293
+ '& .SCEditCourse-options-divider': {
294
+ marginTop: string;
295
+ marginBottom: any;
296
+ };
297
+ '& .SCEditCourse-options-button-wrapper': {
298
+ alignItems: string;
299
+ maxWidth: string;
300
+ margin: string;
301
+ };
281
302
  };
282
303
  };
283
304
  };
package/lib/esm/components/SCEditCourse.js CHANGED
@@ -8,9 +8,6 @@ const Component = {
8
8
  '& .SCEditCourse-contrast-color': {
9
9
  color: getContrastRatio(theme.palette.background.default, theme.palette.common.white) > 4.5 ? theme.palette.common.white : undefined
10
10
  },
11
- '& .SCEditCourse-contrast-bg-color': {
12
- backgroundColor: getContrastRatio(theme.palette.background.default, theme.palette.common.white) > 4.5 ? theme.palette.common.white : undefined
13
- },
14
11
  '& .SCEditCourse-header': {
15
12
  flexDirection: 'row',
16
13
  alignItems: 'center',
@@ -55,7 +52,15 @@ const Component = {
55
52
  }
56
53
  },
57
54
  '& .SCEditCourse-status': {
58
- borderRadius: theme.spacing(1)
55
+ borderRadius: theme.spacing(1),
56
+ '& .MuiButtonBase-root': {
57
+ padding: 0,
58
+ textDecoration: 'underline',
59
+ '&:hover': {
60
+ backgroundColor: 'unset',
61
+ textDecoration: 'underline'
62
+ }
63
+ }
59
64
  },
60
65
  '& .SCEditCourse-lesson-empty-status': {
61
66
  border: `1px solid ${theme.palette.grey[300]}`,
@@ -74,6 +79,7 @@ const Component = {
74
79
  borderBottom: 'unset',
75
80
  borderTopLeftRadius: '5px',
76
81
  borderTopRightRadius: '5px',
82
+ backgroundColor: theme.palette.common.white,
77
83
  '& .SCEditCourse-lessons-sections': {
78
84
  flexDirection: 'row',
79
85
  alignItems: 'center',
@@ -97,6 +103,7 @@ const Component = {
97
103
  border: `1px solid ${theme.palette.grey[300]}`,
98
104
  borderBottomLeftRadius: '5px',
99
105
  borderBottomRightRadius: '5px',
106
+ backgroundColor: theme.palette.common.white,
100
107
  '& .SCEditCourse-table': {
101
108
  '& .SCEditCourse-cell-width': {
102
109
  width: '3%'
@@ -179,19 +186,25 @@ const Component = {
179
186
  marginTop: '7px',
180
187
  marginBottom: theme.spacing(2)
181
188
  },
182
- '& .SCEditCourse-options-wrapper': {
183
- gap: theme.spacing(5),
184
- maxWidth: '600px',
185
- margin: 'auto'
186
- },
187
- '& .SCEditCourse-options-divider': {
188
- marginTop: '21px',
189
- marginBottom: theme.spacing(3)
190
- },
191
- '& .SCEditCourse-options-button-wrapper': {
192
- alignItems: 'flex-end',
193
- maxWidth: '600px',
194
- margin: 'auto'
189
+ '& .SCEditCourse-options-container': {
190
+ border: `1px solid ${theme.palette.grey['300']}`,
191
+ borderRadius: '5px',
192
+ padding: '10px 0',
193
+ backgroundColor: theme.palette.common.white,
194
+ '& .SCEditCourse-options-wrapper': {
195
+ gap: theme.spacing(5),
196
+ maxWidth: '600px',
197
+ margin: 'auto'
198
+ },
199
+ '& .SCEditCourse-options-divider': {
200
+ marginTop: '21px',
201
+ marginBottom: theme.spacing(3)
202
+ },
203
+ '& .SCEditCourse-options-button-wrapper': {
204
+ alignItems: 'flex-end',
205
+ maxWidth: '600px',
206
+ margin: 'auto'
207
+ }
195
208
  }
196
209
  }
197
210
  }),
@@ -237,13 +250,15 @@ const Component = {
237
250
  marginTop: '9px',
238
251
  padding: theme.spacing(2),
239
252
  border: `1px solid ${theme.palette.grey[300]}`,
240
- borderRadius: '5px'
253
+ borderRadius: '5px',
254
+ backgroundColor: theme.palette.common.white
241
255
  },
242
256
  '& .SCEditCourse-table-container': {
243
257
  width: 'auto',
244
258
  border: `1px solid ${theme.palette.grey[300]}`,
245
259
  borderBottomLeftRadius: '5px',
246
260
  borderBottomRightRadius: '5px',
261
+ backgroundColor: theme.palette.common.white,
247
262
  '& .SCEditCourse-margin': {
248
263
  margin: 'auto'
249
264
  },
@@ -262,19 +277,25 @@ const Component = {
262
277
  marginTop: '7px',
263
278
  marginBottom: theme.spacing(2)
264
279
  },
265
- '& .SCEditCourse-options-wrapper': {
266
- gap: theme.spacing(5),
267
- maxWidth: '600px',
268
- margin: 'auto'
269
- },
270
- '& .SCEditCourse-options-divider': {
271
- marginTop: '21px',
272
- marginBottom: theme.spacing(3)
273
- },
274
- '& .SCEditCourse-options-button-wrapper': {
275
- alignItems: 'flex-end',
276
- maxWidth: '600px',
277
- margin: 'auto'
280
+ '& .SCEditCourse-options-container': {
281
+ border: `1px solid ${theme.palette.grey['300']}`,
282
+ borderRadius: '5px',
283
+ paddingBottom: '10px',
284
+ backgroundColor: theme.palette.common.white,
285
+ '& .SCEditCourse-options-wrapper': {
286
+ gap: theme.spacing(5),
287
+ maxWidth: '600px',
288
+ margin: 'auto'
289
+ },
290
+ '& .SCEditCourse-options-divider': {
291
+ marginTop: '21px',
292
+ marginBottom: theme.spacing(3)
293
+ },
294
+ '& .SCEditCourse-options-button-wrapper': {
295
+ alignItems: 'flex-end',
296
+ maxWidth: '600px',
297
+ margin: 'auto'
298
+ }
278
299
  }
279
300
  })
280
301
  }
package/lib/esm/components/SCEmptyStatus.d.ts CHANGED
@@ -8,6 +8,7 @@ declare const Component: {
8
8
  gap: string;
9
9
  padding: any;
10
10
  marginTop: string;
11
+ backgroundColor: any;
11
12
  '& .SCEmptyStatus-box': {
12
13
  width: string;
13
14
  height: string;
package/lib/esm/components/SCEmptyStatus.js CHANGED
@@ -6,6 +6,7 @@ const Component = {
6
6
  gap: '10px',
7
7
  padding: theme.spacing(3),
8
8
  marginTop: '9px',
9
+ backgroundColor: theme.palette.common.white,
9
10
  '& .SCEmptyStatus-box': {
10
11
  width: '130px',
11
12
  height: '130px',