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.
@@ -1,277 +1,277 @@
1
- .myEditorContainer {
2
- &.fullscreen {
3
- position: fixed;
4
- z-index: 9999;
5
- background: white;
6
- left: 0;
7
- top: 0;
8
- width: 100%;
9
- height: 100%;
10
- background-color: #091624c0;
11
-
12
- .myEditorContainerContent {
13
- position: absolute;
14
- top: 50%;
15
- left: 50%;
16
- transform: translate(-50%, -50%);
17
- height: 90vh;
18
- width: 95%;
19
- background: #fff;
20
- border-radius: 10px;
21
- padding: 10px;
22
-
23
- .myEditorContainerFullscreenButton{
24
- right: 15px;
25
- top: 15px;
26
- background: #7096b1;
27
- }
28
-
29
- .quill {
30
- height: calc(100% - 45px) !important;
31
- }
32
- }
33
- }
34
-
35
- .myEditorContainerContent {
36
- position: relative;
37
- height: 100%;
38
- width: 100%;
39
-
40
- .myEditorContainerFullscreenButton{
41
- position: absolute;
42
- right: 5px;
43
- top: 5px;
44
- z-index: 10000;
45
- background: #b8c1cf;
46
- border: none;
47
- cursor: pointer;
48
- display: flex;
49
- align-items: center;
50
- justify-content: center;
51
- width: 33px;
52
- height: 33px;
53
- padding: 7px;
54
- border-radius: 5px;
55
-
56
- svg{
57
- width: 100%;
58
- height: 100%;
59
- }
60
- }
61
-
62
- .quill {
63
- display: inline-block;
64
- width: 100%;
65
-
66
- .ql-toolbar {
67
- border-radius: 10px;
68
- background: #eaebec;
69
- // -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
70
- // -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
71
- box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.1);
72
- padding: 3px !important;
73
-
74
- .ql-formats {
75
- margin: 4px;
76
- background: #d9dce1;
77
- padding: 2px;
78
- border-radius: 5px;
79
- }
80
- }
81
-
82
- .ql-container {
83
- border-radius: 0 0 10px 10px;
84
- padding-right: 2px;
85
- }
86
-
87
- .ql-editor {
88
- &::-webkit-scrollbar {
89
- width: 8px;
90
- height: 8px;
91
- }
92
-
93
- &::-webkit-scrollbar-track {
94
- background: #f1f1f1;
95
- border-radius: 4px;
96
- }
97
-
98
- &::-webkit-scrollbar-thumb {
99
- background: #888;
100
- border-radius: 4px;
101
-
102
- &:hover {
103
- background: #555;
104
- }
105
- }
106
- }
107
- }
108
-
109
- .quill-editor-container .ql-formula {
110
- display: inline-block;
111
- vertical-align: middle;
112
- padding: 0 2px;
113
- }
114
-
115
- .quill-editor-container .katex {
116
- display: inline-block;
117
- font-size: 1.1em;
118
- }
119
-
120
- .ql-snow .ql-picker.ql-font .ql-picker-label::before,
121
- .ql-snow .ql-picker.ql-font .ql-picker-item::before {
122
- content: "";
123
- }
124
-
125
- .ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
126
- overflow: auto;
127
- max-height: 300px;
128
- }
129
-
130
- .ql-font-arial {
131
- font-family: Arial, sans-serif !important;
132
- }
133
-
134
- .ql-font-comic-sans {
135
- font-family: "Comic Sans MS", cursive, sans-serif !important;
136
- }
137
-
138
- .ql-font-courier-new {
139
- font-family: "Courier New", Courier, monospace !important;
140
- }
141
-
142
- .ql-font-georgia {
143
- font-family: Georgia, serif !important;
144
- }
145
-
146
- .ql-font-helvetica {
147
- font-family: Helvetica, sans-serif !important;
148
- }
149
-
150
- .ql-font-times-new-roman {
151
- font-family: "Times New Roman", Times, serif !important;
152
- }
153
-
154
- .ql-font-verdana {
155
- font-family: Verdana, sans-serif !important;
156
- }
157
-
158
- .ql-font-trebuchet-ms {
159
- font-family: "Trebuchet MS", sans-serif !important;
160
- }
161
-
162
- .ql-font-garamond {
163
- font-family: Garamond, serif !important;
164
- }
165
-
166
- .ql-font-palatino-linotype {
167
- font-family: "Palatino Linotype", serif !important;
168
- }
169
-
170
- .ql-font-consolas {
171
- font-family: Consolas, monospace !important;
172
- }
173
-
174
- .ql-font-lucida-console {
175
- font-family: "Lucida Console", monospace !important;
176
- }
177
-
178
- .ql-font-impact {
179
- font-family: Impact, sans-serif !important;
180
- }
181
-
182
- .ql-font-brush-script-mt {
183
- font-family: "Brush Script MT", cursive !important;
184
- }
185
-
186
- .ql-font-tahoma {
187
- font-family: Tahoma, sans-serif !important;
188
- }
189
-
190
- .ql-font-gill-sans {
191
- font-family: "Gill Sans", sans-serif !important;
192
- }
193
-
194
- .ql-font-franklin-gothic-medium {
195
- font-family: "Franklin Gothic Medium", sans-serif !important;
196
- }
197
-
198
- .ql-font-century-gothic {
199
- font-family: "Century Gothic", sans-serif !important;
200
- }
201
-
202
- .ql-font-bookman-old-style {
203
- font-family: "Bookman Old Style", serif !important;
204
- }
205
-
206
- .ql-font-candara {
207
- font-family: Candara, sans-serif !important;
208
- }
209
-
210
- .ql-font-didot {
211
- font-family: Didot, serif !important;
212
- }
213
-
214
- .ql-font-futura {
215
- font-family: Futura, sans-serif !important;
216
- }
217
-
218
- .ql-font-rockwell {
219
- font-family: Rockwell, serif !important;
220
- }
221
-
222
- .ql-font-baskerville {
223
- font-family: Baskerville, serif !important;
224
- }
225
-
226
- .ql-font-bodoni-mt {
227
- font-family: "Bodoni MT", serif !important;
228
- }
229
-
230
- .ql-font-copperplate {
231
- font-family: Copperplate, serif !important;
232
- }
233
-
234
- .ql-font-perpetua {
235
- font-family: Perpetua, serif !important;
236
- }
237
-
238
- .ql-font-monaco {
239
- font-family: Monaco, monospace !important;
240
- }
241
-
242
- .ql-font-century-schoolbook {
243
- font-family: "Century Schoolbook", serif !important;
244
- }
245
-
246
- .ql-font-segoe-ui {
247
- font-family: "Segoe UI", sans-serif !important;
248
- }
249
-
250
- .ql-snow .ql-toolbar button.ql-fullscreen {
251
- &:hover .ql-stroke {
252
- stroke: #06c;
253
- }
254
-
255
- .ql-stroke {
256
- stroke: #444;
257
- }
258
- }
259
- }
260
- }
261
-
262
-
263
- .ql-editor table {
264
- width: 100%;
265
- border-collapse: collapse;
266
- }
267
-
268
- .ql-editor table td,
269
- .ql-editor table th {
270
- border: 1px solid #ddd;
271
- padding: 8px;
272
- }
273
-
274
- .ql-editor table th {
275
- background-color: #f2f2f2;
276
- text-align: left;
1
+ .myEditorContainer {
2
+ &.fullscreen {
3
+ position: fixed;
4
+ z-index: 9999;
5
+ background: white;
6
+ left: 0;
7
+ top: 0;
8
+ width: 100%;
9
+ height: 100%;
10
+ background-color: #091624c0;
11
+
12
+ .myEditorContainerContent {
13
+ position: absolute;
14
+ top: 50%;
15
+ left: 50%;
16
+ transform: translate(-50%, -50%);
17
+ height: 90vh;
18
+ width: 95%;
19
+ background: #fff;
20
+ border-radius: 10px;
21
+ padding: 10px;
22
+
23
+ .myEditorContainerFullscreenButton{
24
+ right: 15px;
25
+ top: 15px;
26
+ background: #7096b1;
27
+ }
28
+
29
+ .quill {
30
+ height: calc(100% - 45px) !important;
31
+ }
32
+ }
33
+ }
34
+
35
+ .myEditorContainerContent {
36
+ position: relative;
37
+ height: 100%;
38
+ width: 100%;
39
+
40
+ .myEditorContainerFullscreenButton{
41
+ position: absolute;
42
+ right: 5px;
43
+ top: 5px;
44
+ z-index: 10000;
45
+ background: #b8c1cf;
46
+ border: none;
47
+ cursor: pointer;
48
+ display: flex;
49
+ align-items: center;
50
+ justify-content: center;
51
+ width: 33px;
52
+ height: 33px;
53
+ padding: 7px;
54
+ border-radius: 5px;
55
+
56
+ svg{
57
+ width: 100%;
58
+ height: 100%;
59
+ }
60
+ }
61
+
62
+ .quill {
63
+ display: inline-block;
64
+ width: 100%;
65
+
66
+ .ql-toolbar {
67
+ border-radius: 10px;
68
+ background: #eaebec;
69
+ // -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
70
+ // -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
71
+ box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.1);
72
+ padding: 3px !important;
73
+
74
+ .ql-formats {
75
+ margin: 4px;
76
+ background: #d9dce1;
77
+ padding: 2px;
78
+ border-radius: 5px;
79
+ }
80
+ }
81
+
82
+ .ql-container {
83
+ border-radius: 0 0 10px 10px;
84
+ padding-right: 2px;
85
+ }
86
+
87
+ .ql-editor {
88
+ &::-webkit-scrollbar {
89
+ width: 8px;
90
+ height: 8px;
91
+ }
92
+
93
+ &::-webkit-scrollbar-track {
94
+ background: #f1f1f1;
95
+ border-radius: 4px;
96
+ }
97
+
98
+ &::-webkit-scrollbar-thumb {
99
+ background: #888;
100
+ border-radius: 4px;
101
+
102
+ &:hover {
103
+ background: #555;
104
+ }
105
+ }
106
+ }
107
+ }
108
+
109
+ .quill-editor-container .ql-formula {
110
+ display: inline-block;
111
+ vertical-align: middle;
112
+ padding: 0 2px;
113
+ }
114
+
115
+ .quill-editor-container .katex {
116
+ display: inline-block;
117
+ font-size: 1.1em;
118
+ }
119
+
120
+ .ql-snow .ql-picker.ql-font .ql-picker-label::before,
121
+ .ql-snow .ql-picker.ql-font .ql-picker-item::before {
122
+ content: "";
123
+ }
124
+
125
+ .ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
126
+ overflow: auto;
127
+ max-height: 300px;
128
+ }
129
+
130
+ .ql-font-arial {
131
+ font-family: Arial, sans-serif !important;
132
+ }
133
+
134
+ .ql-font-comic-sans {
135
+ font-family: "Comic Sans MS", cursive, sans-serif !important;
136
+ }
137
+
138
+ .ql-font-courier-new {
139
+ font-family: "Courier New", Courier, monospace !important;
140
+ }
141
+
142
+ .ql-font-georgia {
143
+ font-family: Georgia, serif !important;
144
+ }
145
+
146
+ .ql-font-helvetica {
147
+ font-family: Helvetica, sans-serif !important;
148
+ }
149
+
150
+ .ql-font-times-new-roman {
151
+ font-family: "Times New Roman", Times, serif !important;
152
+ }
153
+
154
+ .ql-font-verdana {
155
+ font-family: Verdana, sans-serif !important;
156
+ }
157
+
158
+ .ql-font-trebuchet-ms {
159
+ font-family: "Trebuchet MS", sans-serif !important;
160
+ }
161
+
162
+ .ql-font-garamond {
163
+ font-family: Garamond, serif !important;
164
+ }
165
+
166
+ .ql-font-palatino-linotype {
167
+ font-family: "Palatino Linotype", serif !important;
168
+ }
169
+
170
+ .ql-font-consolas {
171
+ font-family: Consolas, monospace !important;
172
+ }
173
+
174
+ .ql-font-lucida-console {
175
+ font-family: "Lucida Console", monospace !important;
176
+ }
177
+
178
+ .ql-font-impact {
179
+ font-family: Impact, sans-serif !important;
180
+ }
181
+
182
+ .ql-font-brush-script-mt {
183
+ font-family: "Brush Script MT", cursive !important;
184
+ }
185
+
186
+ .ql-font-tahoma {
187
+ font-family: Tahoma, sans-serif !important;
188
+ }
189
+
190
+ .ql-font-gill-sans {
191
+ font-family: "Gill Sans", sans-serif !important;
192
+ }
193
+
194
+ .ql-font-franklin-gothic-medium {
195
+ font-family: "Franklin Gothic Medium", sans-serif !important;
196
+ }
197
+
198
+ .ql-font-century-gothic {
199
+ font-family: "Century Gothic", sans-serif !important;
200
+ }
201
+
202
+ .ql-font-bookman-old-style {
203
+ font-family: "Bookman Old Style", serif !important;
204
+ }
205
+
206
+ .ql-font-candara {
207
+ font-family: Candara, sans-serif !important;
208
+ }
209
+
210
+ .ql-font-didot {
211
+ font-family: Didot, serif !important;
212
+ }
213
+
214
+ .ql-font-futura {
215
+ font-family: Futura, sans-serif !important;
216
+ }
217
+
218
+ .ql-font-rockwell {
219
+ font-family: Rockwell, serif !important;
220
+ }
221
+
222
+ .ql-font-baskerville {
223
+ font-family: Baskerville, serif !important;
224
+ }
225
+
226
+ .ql-font-bodoni-mt {
227
+ font-family: "Bodoni MT", serif !important;
228
+ }
229
+
230
+ .ql-font-copperplate {
231
+ font-family: Copperplate, serif !important;
232
+ }
233
+
234
+ .ql-font-perpetua {
235
+ font-family: Perpetua, serif !important;
236
+ }
237
+
238
+ .ql-font-monaco {
239
+ font-family: Monaco, monospace !important;
240
+ }
241
+
242
+ .ql-font-century-schoolbook {
243
+ font-family: "Century Schoolbook", serif !important;
244
+ }
245
+
246
+ .ql-font-segoe-ui {
247
+ font-family: "Segoe UI", sans-serif !important;
248
+ }
249
+
250
+ .ql-snow .ql-toolbar button.ql-fullscreen {
251
+ &:hover .ql-stroke {
252
+ stroke: #06c;
253
+ }
254
+
255
+ .ql-stroke {
256
+ stroke: #444;
257
+ }
258
+ }
259
+ }
260
+ }
261
+
262
+
263
+ .ql-editor table {
264
+ width: 100%;
265
+ border-collapse: collapse;
266
+ }
267
+
268
+ .ql-editor table td,
269
+ .ql-editor table th {
270
+ border: 1px solid #ddd;
271
+ padding: 8px;
272
+ }
273
+
274
+ .ql-editor table th {
275
+ background-color: #f2f2f2;
276
+ text-align: left;
277
277
  }