studiokit-scaffolding-js 7.0.12-next.1.7 → 7.0.12-next.1.9

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 (27) hide show
  1. package/LICENSE +21 -21
  2. package/README.md +137 -137
  3. package/lib/components/Impersonation/UserDetail.css +22 -22
  4. package/lib/components/Quill/TableModule/index.css +171 -171
  5. package/lib/config/eslint/react.js +4 -1
  6. package/lib/css/base/_base.css +98 -98
  7. package/lib/css/base/_typography.css +130 -130
  8. package/lib/css/components/_alert.css +86 -86
  9. package/lib/css/components/_bootstrap-grid.css +28 -28
  10. package/lib/css/components/_buttons.css +397 -397
  11. package/lib/css/components/_forms.css +101 -101
  12. package/lib/css/components/_menu.css +56 -56
  13. package/lib/css/components/_modals.css +46 -46
  14. package/lib/css/components/_quill.css +315 -315
  15. package/lib/css/components/_tables.css +497 -497
  16. package/lib/css/components/_tags.css +12 -12
  17. package/lib/css/index-with-variables.css +15 -15
  18. package/lib/css/index.css +14 -14
  19. package/lib/css/utils/_border.css +463 -463
  20. package/lib/css/utils/_color.css +317 -317
  21. package/lib/css/utils/_display.css +305 -305
  22. package/lib/css/utils/_general.css +48 -48
  23. package/lib/css/utils/_icon.css +16 -16
  24. package/lib/css/utils/_text.css +25 -25
  25. package/lib/css/utils/_width.css +60 -60
  26. package/lib/css/variables.css +84 -84
  27. package/package.json +215 -214
package/lib/css/components/_forms.css CHANGED
@@ -1,101 +1,101 @@
1
- /**
2
- * Overrides the font of all the FormControl input text in React-Bootstrap
3
- **/
4
- .form-control {
5
- font-family: var(--text-font-stack);
6
- font-size: 1rem;
7
- padding: 0.5rem;
8
- line-height: 1.5;
9
- border-color: var(--color-light-grey);
10
- border-bottom-color: var(--color-medium-dark-grey);
11
- box-shadow: none;
12
- }
13
-
14
- select.form-control {
15
- padding: 0.375rem 0.75rem;
16
- }
17
-
18
- /* MATERIAL UI STYLE OVERRIDES */
19
-
20
- .MuiInputBase-input:invalid {
21
- border-color: var(--color-red);
22
-
23
- & ::after {
24
- border-color: var(--color-red);
25
- }
26
- }
27
-
28
- /* material labels and form fields */
29
- .material-text-field-date,
30
- .material-text-field-time {
31
- margin-top: 0.5rem;
32
- padding-bottom: 0.5rem;
33
- width: 100%;
34
-
35
- & hr {
36
- display: none;
37
- }
38
-
39
- & div {
40
- height: auto;
41
- width: auto;
42
- margin-top: 0;
43
- }
44
-
45
- & label {
46
- font-size: 0.75rem;
47
- font-weight: bold;
48
- color: var(--color-dark-grey);
49
- transform: none;
50
- position: static;
51
- }
52
-
53
- & input,
54
- & textarea {
55
- background-color: var(--color-white);
56
- border: 1px solid var(--color-light-grey);
57
- padding: 0.5rem;
58
- border-radius: 0.25rem;
59
- height: auto;
60
- line-height: 1;
61
- min-height: 1rem;
62
- min-width: 100px;
63
- }
64
- }
65
-
66
- /* ALIGN SEARCH BOXES ON MANAGE PAGES */
67
- .date-align {
68
- & .MuiFormControl-root {
69
- vertical-align: unset;
70
- }
71
-
72
- & .MuiFormLabel-root,
73
- & .MuiInputBase-root {
74
- font-family: var(--text-font-stack);
75
- line-height: unset;
76
- letter-spacing: unset;
77
- }
78
-
79
- & .material-text-field-date {
80
- margin-top: unset;
81
- padding-bottom: unset;
82
- line-height: 1.5;
83
-
84
- /* override Material UI attributes with Bootstrap's */
85
- & input {
86
- height: 1.275rem;
87
- line-height: 1.5;
88
- }
89
- }
90
-
91
- &#and-or-label {
92
- margin-top: 1.4rem;
93
- }
94
- }
95
-
96
- /* making disabled color darker to meet accessibility standards */
97
- .MuiFormControlLabel-label.Mui-disabled,
98
- .MuiFormLabel-root.Mui-disabled,
99
- .MuiIconButton-root.Mui-disabled {
100
- color: var(--color-disabled);
101
- }
1
+ /**
2
+ * Overrides the font of all the FormControl input text in React-Bootstrap
3
+ **/
4
+ .form-control {
5
+ font-family: var(--text-font-stack);
6
+ font-size: 1rem;
7
+ padding: 0.5rem;
8
+ line-height: 1.5;
9
+ border-color: var(--color-light-grey);
10
+ border-bottom-color: var(--color-medium-dark-grey);
11
+ box-shadow: none;
12
+ }
13
+
14
+ select.form-control {
15
+ padding: 0.375rem 0.75rem;
16
+ }
17
+
18
+ /* MATERIAL UI STYLE OVERRIDES */
19
+
20
+ .MuiInputBase-input:invalid {
21
+ border-color: var(--color-red);
22
+
23
+ & ::after {
24
+ border-color: var(--color-red);
25
+ }
26
+ }
27
+
28
+ /* material labels and form fields */
29
+ .material-text-field-date,
30
+ .material-text-field-time {
31
+ margin-top: 0.5rem;
32
+ padding-bottom: 0.5rem;
33
+ width: 100%;
34
+
35
+ & hr {
36
+ display: none;
37
+ }
38
+
39
+ & div {
40
+ height: auto;
41
+ width: auto;
42
+ margin-top: 0;
43
+ }
44
+
45
+ & label {
46
+ font-size: 0.75rem;
47
+ font-weight: bold;
48
+ color: var(--color-dark-grey);
49
+ transform: none;
50
+ position: static;
51
+ }
52
+
53
+ & input,
54
+ & textarea {
55
+ background-color: var(--color-white);
56
+ border: 1px solid var(--color-light-grey);
57
+ padding: 0.5rem;
58
+ border-radius: 0.25rem;
59
+ height: auto;
60
+ line-height: 1;
61
+ min-height: 1rem;
62
+ min-width: 100px;
63
+ }
64
+ }
65
+
66
+ /* ALIGN SEARCH BOXES ON MANAGE PAGES */
67
+ .date-align {
68
+ & .MuiFormControl-root {
69
+ vertical-align: unset;
70
+ }
71
+
72
+ & .MuiFormLabel-root,
73
+ & .MuiInputBase-root {
74
+ font-family: var(--text-font-stack);
75
+ line-height: unset;
76
+ letter-spacing: unset;
77
+ }
78
+
79
+ & .material-text-field-date {
80
+ margin-top: unset;
81
+ padding-bottom: unset;
82
+ line-height: 1.5;
83
+
84
+ /* override Material UI attributes with Bootstrap's */
85
+ & input {
86
+ height: 1.275rem;
87
+ line-height: 1.5;
88
+ }
89
+ }
90
+
91
+ &#and-or-label {
92
+ margin-top: 1.4rem;
93
+ }
94
+ }
95
+
96
+ /* making disabled color darker to meet accessibility standards */
97
+ .MuiFormControlLabel-label.Mui-disabled,
98
+ .MuiFormLabel-root.Mui-disabled,
99
+ .MuiIconButton-root.Mui-disabled {
100
+ color: var(--color-disabled);
101
+ }
package/lib/css/components/_menu.css CHANGED
@@ -1,56 +1,56 @@
1
-
2
- /* Entity Menus */
3
-
4
- .entity-menu {
5
- & .col {
6
- display: flex;
7
- align-items: center;
8
-
9
- @media (--lt-sm) {
10
- display: block;
11
- }
12
- }
13
-
14
- & h1 {
15
- font-weight: var(--font-weight-semibold);
16
- font-size: 1.25rem;
17
- white-space: nowrap;
18
- overflow: hidden;
19
- text-overflow: ellipsis;
20
- flex-grow: 1;
21
- }
22
-
23
- & .entity-menu-links {
24
- display: block;
25
-
26
- @media (--sm) {
27
- display: flex;
28
- }
29
-
30
- & a {
31
- display: block;
32
- padding: 16px 20px;
33
- font-weight: var(--font-weight-semibold);
34
- font-size: 1rem;
35
- text-transform: capitalize;
36
- color: var(--color-blue-grey);
37
-
38
- &:hover {
39
- padding-bottom: 12px;
40
- text-decoration: none;
41
- border-bottom-width: 4px;
42
- border-bottom-style: solid;
43
- }
44
-
45
- &.active {
46
- padding-bottom: 14px;
47
- border-bottom-width: 2px;
48
- border-bottom-style: solid;
49
- }
50
-
51
- @media (--xs) {
52
- display: inline-block;
53
- }
54
- }
55
- }
56
- }
1
+
2
+ /* Entity Menus */
3
+
4
+ .entity-menu {
5
+ & .col {
6
+ display: flex;
7
+ align-items: center;
8
+
9
+ @media (--lt-sm) {
10
+ display: block;
11
+ }
12
+ }
13
+
14
+ & h1 {
15
+ font-weight: var(--font-weight-semibold);
16
+ font-size: 1.25rem;
17
+ white-space: nowrap;
18
+ overflow: hidden;
19
+ text-overflow: ellipsis;
20
+ flex-grow: 1;
21
+ }
22
+
23
+ & .entity-menu-links {
24
+ display: block;
25
+
26
+ @media (--sm) {
27
+ display: flex;
28
+ }
29
+
30
+ & a {
31
+ display: block;
32
+ padding: 16px 20px;
33
+ font-weight: var(--font-weight-semibold);
34
+ font-size: 1rem;
35
+ text-transform: capitalize;
36
+ color: var(--color-blue-grey);
37
+
38
+ &:hover {
39
+ padding-bottom: 12px;
40
+ text-decoration: none;
41
+ border-bottom-width: 4px;
42
+ border-bottom-style: solid;
43
+ }
44
+
45
+ &.active {
46
+ padding-bottom: 14px;
47
+ border-bottom-width: 2px;
48
+ border-bottom-style: solid;
49
+ }
50
+
51
+ @media (--xs) {
52
+ display: inline-block;
53
+ }
54
+ }
55
+ }
56
+ }
package/lib/css/components/_modals.css CHANGED
@@ -1,46 +1,46 @@
1
- .ReactModal__Body--open {
2
- overflow: hidden;
3
- }
4
-
5
- .modal-dialog {
6
- max-width: none;
7
- width: auto;
8
- margin: 10px;
9
-
10
- @media (--md) {
11
- width: 600px;
12
- margin: 30px auto;
13
- }
14
-
15
- & .modal-content {
16
- box-shadow: 0 0.75rem 0.9rem 0.1rem #0006;
17
- }
18
-
19
- & .modal-header {
20
- position: relative;
21
- min-height: 4.25rem;
22
-
23
- & .modal-title {
24
- width: 100%;
25
- height: auto;
26
- font-size: 1.25rem;
27
- font-weight: 600;
28
- }
29
-
30
- & .close {
31
- position: absolute;
32
- top: 1rem;
33
- right: 1rem;
34
- }
35
- }
36
-
37
- & .modal-footer {
38
- display: block;
39
- text-align: right;
40
- }
41
- }
42
-
43
- /* Always display sentry feedback dialog on top of everything else. */
44
- .sentry-error-embed-wrapper {
45
- z-index: 9999 !important;
46
- }
1
+ .ReactModal__Body--open {
2
+ overflow: hidden;
3
+ }
4
+
5
+ .modal-dialog {
6
+ max-width: none;
7
+ width: auto;
8
+ margin: 10px;
9
+
10
+ @media (--md) {
11
+ width: 600px;
12
+ margin: 30px auto;
13
+ }
14
+
15
+ & .modal-content {
16
+ box-shadow: 0 0.75rem 0.9rem 0.1rem #0006;
17
+ }
18
+
19
+ & .modal-header {
20
+ position: relative;
21
+ min-height: 4.25rem;
22
+
23
+ & .modal-title {
24
+ width: 100%;
25
+ height: auto;
26
+ font-size: 1.25rem;
27
+ font-weight: 600;
28
+ }
29
+
30
+ & .close {
31
+ position: absolute;
32
+ top: 1rem;
33
+ right: 1rem;
34
+ }
35
+ }
36
+
37
+ & .modal-footer {
38
+ display: block;
39
+ text-align: right;
40
+ }
41
+ }
42
+
43
+ /* Always display sentry feedback dialog on top of everything else. */
44
+ .sentry-error-embed-wrapper {
45
+ z-index: 9999 !important;
46
+ }