px-react-ui-components 1.1.9 → 1.1.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.
@@ -0,0 +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;
277
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "px-react-ui-components",
3
- "version": "1.1.9",
3
+ "version": "1.1.11",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/index.js",
6
6
  "type": "commonjs",