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

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 (26) 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/css/base/_base.css +98 -98
  6. package/lib/css/base/_typography.css +130 -130
  7. package/lib/css/components/_alert.css +86 -86
  8. package/lib/css/components/_bootstrap-grid.css +28 -28
  9. package/lib/css/components/_buttons.css +397 -397
  10. package/lib/css/components/_forms.css +101 -101
  11. package/lib/css/components/_menu.css +56 -56
  12. package/lib/css/components/_modals.css +46 -46
  13. package/lib/css/components/_quill.css +315 -315
  14. package/lib/css/components/_tables.css +497 -497
  15. package/lib/css/components/_tags.css +12 -12
  16. package/lib/css/index-with-variables.css +15 -15
  17. package/lib/css/index.css +14 -14
  18. package/lib/css/utils/_border.css +463 -463
  19. package/lib/css/utils/_color.css +317 -317
  20. package/lib/css/utils/_display.css +305 -305
  21. package/lib/css/utils/_general.css +48 -48
  22. package/lib/css/utils/_icon.css +16 -16
  23. package/lib/css/utils/_text.css +25 -25
  24. package/lib/css/utils/_width.css +60 -60
  25. package/lib/css/variables.css +84 -84
  26. package/package.json +214 -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
+ }