lakelib 0.0.1

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 (126) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +32 -0
  3. package/dist/codemirror.min.js +1 -0
  4. package/dist/lake-all.css +1328 -0
  5. package/dist/lake-all.min.js +84 -0
  6. package/dist/lake.css +907 -0
  7. package/dist/lake.min.js +75 -0
  8. package/lib/lake.css +907 -0
  9. package/lib/lake.js +8315 -0
  10. package/lib/types/boxes/code-block.d.ts +2 -0
  11. package/lib/types/boxes/hr.d.ts +2 -0
  12. package/lib/types/boxes/image.d.ts +3 -0
  13. package/lib/types/codemirror.d.ts +8 -0
  14. package/lib/types/config/element-rules.d.ts +1 -0
  15. package/lib/types/config/menu-items.d.ts +9 -0
  16. package/lib/types/config/tag-names.d.ts +6 -0
  17. package/lib/types/config/toolbar-items.d.ts +2 -0
  18. package/lib/types/css/index.d.ts +15 -0
  19. package/lib/types/editor.d.ts +73 -0
  20. package/lib/types/elements/bookmark.d.ts +2 -0
  21. package/lib/types/elements/box.d.ts +2 -0
  22. package/lib/types/icons/index.d.ts +1 -0
  23. package/lib/types/index.d.ts +29 -0
  24. package/lib/types/managers/box-manager.d.ts +13 -0
  25. package/lib/types/managers/command.d.ts +11 -0
  26. package/lib/types/managers/history.d.ts +26 -0
  27. package/lib/types/managers/keystroke.d.ts +12 -0
  28. package/lib/types/managers/plugin.d.ts +9 -0
  29. package/lib/types/managers/selection.d.ts +41 -0
  30. package/lib/types/models/box.d.ts +28 -0
  31. package/lib/types/models/fragment.d.ts +7 -0
  32. package/lib/types/models/nodes.d.ts +96 -0
  33. package/lib/types/models/range.d.ts +53 -0
  34. package/lib/types/operations/add-mark.d.ts +3 -0
  35. package/lib/types/operations/delete-contents.d.ts +2 -0
  36. package/lib/types/operations/fix-list.d.ts +2 -0
  37. package/lib/types/operations/insert-bookmark.d.ts +6 -0
  38. package/lib/types/operations/insert-box.d.ts +4 -0
  39. package/lib/types/operations/insert-contents.d.ts +2 -0
  40. package/lib/types/operations/insert-fragment.d.ts +2 -0
  41. package/lib/types/operations/insert-link.d.ts +3 -0
  42. package/lib/types/operations/insert-node.d.ts +4 -0
  43. package/lib/types/operations/remove-box.d.ts +3 -0
  44. package/lib/types/operations/remove-mark.d.ts +2 -0
  45. package/lib/types/operations/set-blocks.d.ts +3 -0
  46. package/lib/types/operations/split-block.d.ts +3 -0
  47. package/lib/types/operations/split-marks.d.ts +3 -0
  48. package/lib/types/operations/to-bookmark.d.ts +6 -0
  49. package/lib/types/parsers/html-parser.d.ts +14 -0
  50. package/lib/types/parsers/text-parser.d.ts +6 -0
  51. package/lib/types/plugins/align.d.ts +3 -0
  52. package/lib/types/plugins/arrow-keys.d.ts +3 -0
  53. package/lib/types/plugins/backspace-key.d.ts +3 -0
  54. package/lib/types/plugins/block-quote.d.ts +3 -0
  55. package/lib/types/plugins/bold.d.ts +3 -0
  56. package/lib/types/plugins/code-block.d.ts +3 -0
  57. package/lib/types/plugins/code.d.ts +3 -0
  58. package/lib/types/plugins/copy.d.ts +3 -0
  59. package/lib/types/plugins/cut.d.ts +3 -0
  60. package/lib/types/plugins/delete-key.d.ts +3 -0
  61. package/lib/types/plugins/enter-key.d.ts +3 -0
  62. package/lib/types/plugins/font-color.d.ts +3 -0
  63. package/lib/types/plugins/font-family.d.ts +3 -0
  64. package/lib/types/plugins/font-size.d.ts +3 -0
  65. package/lib/types/plugins/format-painter.d.ts +3 -0
  66. package/lib/types/plugins/heading.d.ts +3 -0
  67. package/lib/types/plugins/highlight.d.ts +3 -0
  68. package/lib/types/plugins/hr.d.ts +3 -0
  69. package/lib/types/plugins/image.d.ts +3 -0
  70. package/lib/types/plugins/indent.d.ts +3 -0
  71. package/lib/types/plugins/italic.d.ts +3 -0
  72. package/lib/types/plugins/link.d.ts +3 -0
  73. package/lib/types/plugins/list.d.ts +3 -0
  74. package/lib/types/plugins/markdown.d.ts +3 -0
  75. package/lib/types/plugins/paste.d.ts +3 -0
  76. package/lib/types/plugins/redo.d.ts +3 -0
  77. package/lib/types/plugins/remove-format.d.ts +3 -0
  78. package/lib/types/plugins/select-all.d.ts +3 -0
  79. package/lib/types/plugins/shift-enter-key.d.ts +3 -0
  80. package/lib/types/plugins/strikethrough.d.ts +3 -0
  81. package/lib/types/plugins/subscript.d.ts +3 -0
  82. package/lib/types/plugins/superscript.d.ts +3 -0
  83. package/lib/types/plugins/tab-key.d.ts +3 -0
  84. package/lib/types/plugins/underline.d.ts +3 -0
  85. package/lib/types/plugins/undo.d.ts +3 -0
  86. package/lib/types/plugins/unlink.d.ts +3 -0
  87. package/lib/types/storage/box-instances.d.ts +2 -0
  88. package/lib/types/storage/boxes.d.ts +2 -0
  89. package/lib/types/storage/editors.d.ts +2 -0
  90. package/lib/types/types/box.d.ts +15 -0
  91. package/lib/types/types/native.d.ts +33 -0
  92. package/lib/types/types/node.d.ts +1 -0
  93. package/lib/types/types/object.d.ts +21 -0
  94. package/lib/types/types/request.d.ts +20 -0
  95. package/lib/types/types/toolbar.d.ts +40 -0
  96. package/lib/types/ui/link-popup.d.ts +16 -0
  97. package/lib/types/ui/toolbar.d.ts +30 -0
  98. package/lib/types/ui/upload.d.ts +10 -0
  99. package/lib/types/utils/append-deepest.d.ts +2 -0
  100. package/lib/types/utils/camel-case.d.ts +1 -0
  101. package/lib/types/utils/change-tag-name.d.ts +2 -0
  102. package/lib/types/utils/debug.d.ts +1 -0
  103. package/lib/types/utils/denormalize-value.d.ts +1 -0
  104. package/lib/types/utils/encode.d.ts +1 -0
  105. package/lib/types/utils/fix-numbered-list.d.ts +2 -0
  106. package/lib/types/utils/for-each.d.ts +5 -0
  107. package/lib/types/utils/get-css.d.ts +1 -0
  108. package/lib/types/utils/get-deepest.d.ts +2 -0
  109. package/lib/types/utils/in-string.d.ts +1 -0
  110. package/lib/types/utils/index.d.ts +26 -0
  111. package/lib/types/utils/merge-nodes.d.ts +5 -0
  112. package/lib/types/utils/morph.d.ts +56 -0
  113. package/lib/types/utils/normalize-value.d.ts +1 -0
  114. package/lib/types/utils/parse-style.d.ts +2 -0
  115. package/lib/types/utils/query.d.ts +3 -0
  116. package/lib/types/utils/remove-br.d.ts +2 -0
  117. package/lib/types/utils/remove-zws.d.ts +2 -0
  118. package/lib/types/utils/request.d.ts +27 -0
  119. package/lib/types/utils/safe-template.d.ts +1 -0
  120. package/lib/types/utils/set-block-indent.d.ts +2 -0
  121. package/lib/types/utils/split-nodes.d.ts +5 -0
  122. package/lib/types/utils/template.d.ts +1 -0
  123. package/lib/types/utils/to-hex.d.ts +1 -0
  124. package/lib/types/utils/to-node-list.d.ts +2 -0
  125. package/lib/types/utils/wrap-node-list.d.ts +2 -0
  126. package/package.json +81 -0
@@ -0,0 +1,1328 @@
1
+ .lake-custom-properties {
2
+ /* common */
3
+ --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
4
+ --text-color: #000000e0;
5
+ --secondary-text-color: #000000a6;
6
+ --disabled-text-color: #00000040;
7
+ --border-color: #d9d9d9;
8
+ --background-color: #0000000a;
9
+ --background-hover-color: #0000000a;
10
+ --background-active-color: #0000000d;
11
+ --success-color: #52c41a;
12
+ --warning-color: #faad14;
13
+ --error-color: #ff4d4f;
14
+ /* selection */
15
+ --selection-background-color: #1ba2e333;
16
+ /* link */
17
+ --link-color: #1677ff;
18
+ --link-hover-color: #69b1ff;
19
+ /* box */
20
+ --box-border-color: #d9d9d9;
21
+ --box-border-focus-color: #1677ff;
22
+ --box-border-active-color: #faad14;
23
+ /* button */
24
+ --button-shadow: 0 2px 0 #00000005;
25
+ /* popup */
26
+ --popup-shadow: 0 6px 16px 0 #00000014, 0 3px 6px -4px #0000001f, 0 9px 28px 8px #0000000d;
27
+ /* input form */
28
+ --input-border-color: #d9d9d9;
29
+ --input-border-hover-color: #69b1ff;
30
+ --input-border-active-color: #1677ff;
31
+ }
32
+
33
+ .lake-container {
34
+ font-family: var(--font-family);
35
+ font-size: 16px;
36
+ color: var(--text-color);
37
+ padding: 16px 24px;
38
+ }
39
+ .lake-container:focus {
40
+ outline: none;
41
+ }
42
+ .lake-container::selection,
43
+ .lake-container ::selection {
44
+ color: inherit;
45
+ background: var(--selection-background-color);
46
+ }
47
+ .lake-container bookmark {
48
+ display: inline;
49
+ }
50
+ .lake-container p {
51
+ margin: 0;
52
+ padding: 0;
53
+ margin-bottom: 8px;
54
+ }
55
+ .lake-container a {
56
+ color: var(--link-color);
57
+ text-decoration: none;
58
+ outline: none;
59
+ }
60
+ .lake-container a:hover {
61
+ color: var(--link-hover-color);
62
+ text-decoration: underline;
63
+ }
64
+
65
+ .lake-container strong {
66
+ font-weight: 600;
67
+ }
68
+ .lake-container i {
69
+ font-style: italic;
70
+ }
71
+ .lake-container u {
72
+ text-decoration: underline;
73
+ }
74
+ .lake-container s {
75
+ text-decoration: line-through;
76
+ }
77
+ .lake-container sub {
78
+ vertical-align: sub;
79
+ font-size: 0.85em;
80
+ }
81
+ .lake-container sup {
82
+ vertical-align: super;
83
+ font-size: 0.85em;
84
+ }
85
+ .lake-container code {
86
+ font-family: Consolas, Courier, monospace;
87
+ font-size: 0.9em;
88
+ border-radius: 3px;
89
+ padding: 0.2em 0.4em;
90
+ background-color: #0000000a;
91
+ }
92
+
93
+ .lake-container.lake-format-painter {
94
+ /* file: ../svg/format-painter-cursor.svg */
95
+ cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='20' viewBox='0 0 600 400'%3E%3Cpath fill='none' d='M397 401H1V1h600v400H397m27.39-160.456v-37.606h5.963c41.821 0 83.642.024 125.463-.016 10.848-.01 17.325-6 17.358-16.286.096-30.823.1-61.648 0-92.471-.034-10.554-5.94-16.103-16.674-16.16-6.45-.035-12.899-.007-19.657-.007 0-8.783.063-17.08-.018-25.374-.079-7.94-3.319-11.204-11.29-11.207-73.81-.03-147.621-.034-221.432.004-8.106.004-11.091 3.142-11.096 11.293-.02 32.99-.02 65.98-.003 98.97.005 8.202 3.26 11.461 11.504 11.463 73.644.015 147.289.016 220.933-.002 8.157-.002 11.373-3.312 11.393-11.649.036-14.662.003-29.324.02-43.986.002-1.608.14-3.216.215-4.84h11.502v75.804h-5.843c-41.487 0-82.975-.005-124.462.003-12.796.002-18.147 5.394-18.162 18.306-.017 14.662.002 29.324-.015 43.987-.002 1.432-.153 2.865-.249 4.53-5.076 0-9.73.089-14.38-.027-3.776-.095-5.384 1.436-5.371 5.34.099 29.489-.097 58.98.155 88.468.142 16.617 14.312 30.632 30.552 30.954 17.736.352 32.858-12.285 33.16-29.098.542-30.313.202-60.641.302-90.963.011-3.525-1.706-4.728-4.922-4.686-3.832.05-7.676-.172-11.493.067-3.036.19-3.824-1.148-3.452-4.81M98.997 123.5v81.255H76.999v22.088h21.982c0 2.045.005 3.674 0 5.303-.087 25.83-.49 51.664-.091 77.487.143 9.23-2.38 16.953-7.836 24.049-.913 1.187-1.723 2.452-2.59 3.675-9.838 13.893-23.103 21.722-40.24 22.51-4.767.218-9.553.032-14.914.032v22.282c32.478 3.01 58.566-8.283 76.789-36.428 17.756 26.721 48.899 40.773 78.248 36.027l-1.083-21.66c-2.256 0-3.75-.08-5.232.012-21.104 1.302-37.87-6.871-50.84-23.287-6.506-8.233-10.772-16.802-10.401-28.137.833-25.47.26-50.985.26-76.482v-5.482h21.96v-22.25h-21.96v-5.966c0-32.329.294-64.663-.185-96.985-.141-9.484 1.949-17.494 7.541-25.066 12.268-16.61 27.766-26.975 49.095-26.868 3.12.015 6.24.002 10.04.002V27.314c-15.008-.802-29.72-.048-43.6 7.157-13.625 7.073-25.309 16.192-33.954 29.838-8.595-13.434-19.139-23.646-33.21-30.154-14.041-6.495-28.642-7.867-43.307-6.781V49.62c4.253 0 7.742.003 11.23 0 7.756-.006 14.966 1.724 22.189 4.873 10.95 4.774 18.144 12.992 24.784 22.4 5.426 7.69 8.207 15.646 7.43 25.118-.555 6.787-.107 13.657-.107 21.489z'/%3E%3Cpath fill='%23020202' d='M424.39 241.051c-.371 3.156.417 4.494 3.453 4.304 3.817-.239 7.661-.017 11.493-.067 3.216-.042 4.933 1.161 4.922 4.686-.1 30.322.24 60.65-.303 90.963-.3 16.813-15.423 29.45-33.159 29.098-16.24-.322-30.41-14.337-30.552-30.954-.252-29.488-.056-58.98-.155-88.469-.013-3.903 1.595-5.434 5.371-5.34 4.65.117 9.304.028 14.38.028.096-1.665.247-3.098.249-4.53.017-14.663-.002-29.325.015-43.987.015-12.912 5.366-18.304 18.162-18.306 41.487-.008 82.975-.003 124.462-.003h5.843V102.67H537.07c-.075 1.624-.213 3.232-.215 4.84-.017 14.662.016 29.324-.02 43.986-.02 8.337-3.236 11.647-11.393 11.649-73.644.018-147.289.017-220.933.002-8.244-.002-11.5-3.261-11.504-11.462-.016-32.99-.017-65.98.003-98.97.005-8.152 2.99-11.29 11.096-11.294 73.81-.038 147.622-.034 221.433-.004 7.97.003 11.21 3.266 11.289 11.207.081 8.295.018 16.59.018 25.374 6.758 0 13.208-.028 19.657.006 10.734.058 16.64 5.607 16.674 16.16.1 30.824.096 61.649 0 92.472-.033 10.286-6.51 16.275-17.358 16.286-41.821.04-83.642.016-125.463.016h-5.962v38.113z'/%3E%3Cpath fill='%23040404' d='M98.997 123c0-7.332-.448-14.202.108-20.989.776-9.472-2.005-17.429-7.431-25.118-6.64-9.408-13.834-17.626-24.784-22.4-7.223-3.15-14.433-4.879-22.189-4.873-3.488.003-6.977 0-11.23 0V27.374c14.665-1.086 29.266.286 43.307 6.78 14.071 6.51 24.615 16.72 33.21 30.155 8.645-13.646 20.33-22.765 33.954-29.838 13.88-7.205 28.592-7.959 43.6-7.157V49.61c-3.8 0-6.92.013-10.04-.002-21.329-.107-36.827 10.259-49.095 26.868-5.592 7.572-7.682 15.582-7.541 25.066.479 32.322.185 64.656.186 96.985v5.966h21.958v22.25h-21.958v5.482c0 25.497.572 51.013-.261 76.482-.37 11.335 3.895 19.904 10.4 28.137 12.97 16.416 29.737 24.589 50.84 23.287 1.483-.092 2.977-.012 5.233-.012l1.083 21.66c-29.349 4.746-60.492-9.306-78.248-36.027-18.223 28.145-44.31 39.438-76.79 36.428v-22.282c5.362 0 10.148.186 14.914-.033 17.138-.787 30.403-8.616 40.242-22.509.866-1.223 1.676-2.488 2.589-3.675 5.455-7.096 7.979-14.82 7.836-24.05-.4-25.822.004-51.656.09-77.486.006-1.63 0-3.258 0-5.303H77v-22.088h21.997V123z'/%3E%3C/svg%3E") 2 2, text;
96
+ }
97
+
98
+ .lake-container h1,
99
+ .lake-container h2,
100
+ .lake-container h3,
101
+ .lake-container h4,
102
+ .lake-container h5,
103
+ .lake-container h6 {
104
+ color: #000000e0;
105
+ font-weight: bold;
106
+ margin: 0;
107
+ padding: 0;
108
+ }
109
+ .lake-container h1 {
110
+ font-size: 36px;
111
+ margin-bottom: 16px;
112
+ }
113
+ .lake-container h2 {
114
+ font-size: 30px;
115
+ margin-bottom: 14px;
116
+ }
117
+ .lake-container h3 {
118
+ font-size: 24px;
119
+ margin-bottom: 14px;
120
+ }
121
+ .lake-container h4 {
122
+ font-size: 20px;
123
+ margin-bottom: 12px;
124
+ }
125
+ .lake-container h5 {
126
+ font-size: 18px;
127
+ margin-bottom: 10px;
128
+ }
129
+ .lake-container h6 {
130
+ font-size: 16px;
131
+ margin-bottom: 8px;
132
+ }
133
+
134
+ .lake-container ol,
135
+ .lake-container ul {
136
+ list-style: none;
137
+ margin: 0;
138
+ margin-bottom: 4px;
139
+ padding: 0;
140
+ }
141
+ .lake-container ol[indent="1"],
142
+ .lake-container ul[indent="1"] {
143
+ padding-left: 2em;
144
+ }
145
+ .lake-container ol[indent="2"],
146
+ .lake-container ul[indent="2"] {
147
+ padding-left: 4em;
148
+ }
149
+ .lake-container ol[indent="3"],
150
+ .lake-container ul[indent="3"] {
151
+ padding-left: 6em;
152
+ }
153
+ .lake-container ol[indent="4"],
154
+ .lake-container ul[indent="4"] {
155
+ padding-left: 8em;
156
+ }
157
+ .lake-container ol[indent="5"],
158
+ .lake-container ul[indent="5"] {
159
+ padding-left: 10em;
160
+ }
161
+ .lake-container ol[indent="6"],
162
+ .lake-container ul[indent="6"] {
163
+ padding-left: 12em;
164
+ }
165
+ .lake-container ol[indent="7"],
166
+ .lake-container ul[indent="7"] {
167
+ padding-left: 14em;
168
+ }
169
+ .lake-container ol[indent="8"],
170
+ .lake-container ul[indent="8"] {
171
+ padding-left: 16em;
172
+ }
173
+ .lake-container ol[indent="9"],
174
+ .lake-container ul[indent="9"] {
175
+ padding-left: 18em;
176
+ }
177
+ .lake-container ol[indent="10"],
178
+ .lake-container ul[indent="10"] {
179
+ padding-left: 20em;
180
+ }
181
+ .lake-container ol li,
182
+ .lake-container ul li {
183
+ margin-left: 20px;
184
+ padding-left: 4px;
185
+ }
186
+ .lake-container ol li {
187
+ list-style: decimal;
188
+ }
189
+ .lake-container ul li {
190
+ list-style: disc;
191
+ }
192
+ .lake-container ol[indent="1"] li,
193
+ .lake-container ol[indent="4"] li,
194
+ .lake-container ol[indent="7"] li,
195
+ .lake-container ol[indent="10"] li {
196
+ list-style-type: lower-alpha;
197
+ }
198
+ .lake-container ol[indent="2"] li,
199
+ .lake-container ol[indent="5"] li,
200
+ .lake-container ol[indent="8"] li {
201
+ list-style-type: lower-roman;
202
+ }
203
+ .lake-container ul[indent="1"] li,
204
+ .lake-container ul[indent="4"] li,
205
+ .lake-container ul[indent="7"] li,
206
+ .lake-container ul[indent="10"] li {
207
+ list-style-type: circle;
208
+ }
209
+ .lake-container ul[indent="2"] li,
210
+ .lake-container ul[indent="5"] li,
211
+ .lake-container ul[indent="8"] li {
212
+ list-style-type: square;
213
+ }
214
+ .lake-container ul[type="checklist"] li {
215
+ list-style: none;
216
+ position: relative;
217
+ margin-left: 0;
218
+ padding-left: 24px;
219
+ }
220
+ .lake-container ul[type="checklist"] li::before {
221
+ content: '';
222
+ position: absolute;
223
+ top: 3px;
224
+ left: 0;
225
+ width: 16px;
226
+ height: 16px;
227
+ border-radius: 4px;
228
+ cursor: pointer;
229
+ }
230
+ .lake-container ul[type="checklist"] li[value="true"]::before {
231
+ border: 1px solid #1890ff;
232
+ background-color: #1890ff;
233
+ }
234
+ .lake-container ul[type="checklist"] li[value="false"]::before {
235
+ border: 1px solid var(--border-color);
236
+ background-color: #fff;
237
+ }
238
+ .lake-container ul[type="checklist"] li::after {
239
+ content: '';
240
+ position: absolute;
241
+ top: 3px;
242
+ left: 0;
243
+ margin-left: 4px;
244
+ margin-top: 8px;
245
+ width: 4px;
246
+ height: 8px;
247
+ border-bottom: 2px solid #fff;
248
+ border-right: 2px solid #fff;
249
+ border-radius: 1px;
250
+ transform: rotate(45deg) scale(1) translate(-50%,-50%);
251
+ cursor: pointer;
252
+ }
253
+
254
+ .lake-container blockquote {
255
+ margin: 0;
256
+ margin-bottom: 8px;
257
+ padding: 8px 12px;
258
+ color: var(--secondary-text-color);
259
+ border-left: 4px solid #0505050f;
260
+ }
261
+ .lake-container blockquote[type] {
262
+ color: var(--text-color);
263
+ border-radius: 8px;
264
+ }
265
+ .lake-container blockquote[type="success"] {
266
+ background-color: #f6ffed;
267
+ border: 1px solid #b7eb8f;
268
+ }
269
+ .lake-container blockquote[type="info"] {
270
+ background-color: #e6f4ff;
271
+ border: 1px solid #91caff;
272
+ }
273
+ .lake-container blockquote[type="warning"] {
274
+ background-color: #fffbe6;
275
+ border: 1px solid #ffe58f;
276
+ }
277
+ .lake-container blockquote[type="error"] {
278
+ background-color: #fff2f0;
279
+ border: 1px solid #ffccc7;
280
+ }
281
+
282
+ .lake-container table {
283
+ border-collapse: collapse;
284
+ border: 1px solid var(--border-color);
285
+ margin-bottom: 8px;
286
+ }
287
+ .lake-container table td {
288
+ padding: 4px 8px;
289
+ }
290
+
291
+ lake-box {
292
+ margin: 0;
293
+ padding: 0;
294
+ text-indent: 0;
295
+ grid-template-columns: 1px 1fr 1px;
296
+ }
297
+ lake-box[type="inline"] {
298
+ display: inline grid;
299
+ }
300
+ lake-box[type="block"] {
301
+ display: block grid;
302
+ }
303
+ lake-box .lake-box-strip {
304
+ display: block;
305
+ min-width: 1px;
306
+ }
307
+ lake-box[type="inline"] .lake-box-strip {
308
+ align-self: flex-end;
309
+ }
310
+ lake-box[type="block"] .lake-box-strip {
311
+ align-self: stretch;
312
+ }
313
+ lake-box .lake-box-strip ::selection {
314
+ background: transparent;
315
+ }
316
+ lake-box .lake-box-container {
317
+ display: block;
318
+ }
319
+
320
+ lake-box[name="hr"] {
321
+ margin-bottom: 8px;
322
+ }
323
+ .lake-hr {
324
+ height: 21px;
325
+ display: flex;
326
+ align-items: center;
327
+ cursor: pointer;
328
+ }
329
+ lake-box[name="hr"] .lake-box-hovered .lake-hr {
330
+ background-color: var(--background-hover-color);
331
+ }
332
+ lake-box[name="hr"] .lake-box-selected .lake-hr,
333
+ lake-box[name="hr"] .lake-box-focused .lake-hr {
334
+ background-color: var(--selection-background-color);
335
+ }
336
+ .lake-hr hr {
337
+ width: 100%;
338
+ margin: 0;
339
+ padding: 0;
340
+ border: 0;
341
+ border-top: 1px solid var(--border-color);
342
+ }
343
+
344
+ @keyframes lakeRotate {
345
+ 0% {
346
+ transform: rotate(0);
347
+ }
348
+ 100% {
349
+ transform: rotate(360deg);
350
+ }
351
+ }
352
+ .lake-image-placeholder {
353
+ display: flex;
354
+ align-items: center;
355
+ justify-content: center;
356
+ box-sizing: border-box;
357
+ border: 1px solid transparent;
358
+ background-color: #fafafa;
359
+ border-radius: 4px;
360
+ width: 100%;
361
+ height: 100%;
362
+ }
363
+ .lake-image-placeholder svg {
364
+ fill: #d9d9d9;
365
+ width: 50%;
366
+ max-width: 64px;
367
+ height: 50%;
368
+ max-height: 64px;
369
+ }
370
+ .lake-image {
371
+ position: relative;
372
+ line-height: 0;
373
+ border: 1px solid transparent;
374
+ border-radius: 4px;
375
+ }
376
+ .lake-image .lake-image-img {
377
+ box-sizing: border-box;
378
+ border: 0;
379
+ border-radius: 4px;
380
+ width: 100%;
381
+ height: 100%;
382
+ }
383
+ lake-box[name="image"] .lake-box-focused .lake-image {
384
+ border-color: var(--box-border-focus-color);
385
+ }
386
+ .lake-image .lake-button-group {
387
+ position: absolute;
388
+ top: 8px;
389
+ right: 8px;
390
+ z-index: 2;
391
+ border-radius: 4px;
392
+ background-color: rgba(0, 0, 0, .4);
393
+ line-height: 0;
394
+ display: flex;
395
+ align-items: center;
396
+ padding: 0 6px;
397
+ display: none;
398
+ }
399
+ lake-box[name="image"] .lake-box-hovered .lake-button-group,
400
+ lake-box[name="image"] .lake-box-focused .lake-button-group {
401
+ display: flex;
402
+ }
403
+ .lake-image .lake-button-group button {
404
+ border-radius: 5px;
405
+ border: 0;
406
+ color: var(--text-color);
407
+ background-color: transparent;
408
+ padding: 0;
409
+ margin: 0;
410
+ line-height: 0;
411
+ cursor: pointer;
412
+ user-select: none;
413
+ outline: none;
414
+ }
415
+ .lake-image .lake-button-group button svg {
416
+ fill: #fff;
417
+ width: 16px;
418
+ height: 16px;
419
+ margin: 6px;
420
+ }
421
+ .lake-image .lake-resizer {
422
+ user-select: none;
423
+ display: none;
424
+ }
425
+ lake-box[name="image"] .lake-box-focused .lake-resizer {
426
+ display: block;
427
+ }
428
+ .lake-image .lake-resizer-top-left,
429
+ .lake-image .lake-resizer-top-right,
430
+ .lake-image .lake-resizer-bottom-left,
431
+ .lake-image .lake-resizer-bottom-right {
432
+ box-sizing: border-box;
433
+ position: absolute;
434
+ width: 12px;
435
+ height: 12px;
436
+ line-height: 0;
437
+ z-index: 1;
438
+ border: 1px solid #fff;
439
+ border-radius: 6px;
440
+ background-color: var(--box-border-focus-color);
441
+ }
442
+ .lake-image .lake-resizer-top-left {
443
+ top: -5px;
444
+ left: -5px;
445
+ cursor: nwse-resize;
446
+ }
447
+ .lake-image .lake-resizer-top-right {
448
+ top: -5px;
449
+ right: -5px;
450
+ cursor: nesw-resize;
451
+ }
452
+ .lake-image .lake-resizer-bottom-left {
453
+ bottom: -5px;
454
+ left: -5px;
455
+ cursor: nesw-resize;
456
+ }
457
+ .lake-image .lake-resizer-bottom-right {
458
+ bottom: -5px;
459
+ right: -5px;
460
+ cursor: nwse-resize;
461
+ }
462
+ .lake-image .lake-resizer-info {
463
+ position: absolute;
464
+ bottom: 8px;
465
+ right: 8px;
466
+ z-index: 1;
467
+ border-radius: 4px;
468
+ background-color: rgba(0, 0, 0, .4);
469
+ padding: 2px 8px;
470
+ font-size: 14px;
471
+ line-height: normal;
472
+ color: #fff;
473
+ white-space: nowrap;
474
+ display: none;
475
+ }
476
+ /* uploading status */
477
+ .lake-image-uploading .lake-image-img {
478
+ opacity: 0.5;
479
+ }
480
+ .lake-image .lake-progress {
481
+ position: absolute;
482
+ bottom: 8px;
483
+ right: 8px;
484
+ z-index: 1;
485
+ border-radius: 4px;
486
+ background-color: rgba(0, 0, 0, .4);
487
+ line-height: 0;
488
+ display: flex;
489
+ align-items: center;
490
+ padding: 0 6px;
491
+ }
492
+ .lake-image .lake-progress svg {
493
+ fill: #fff;
494
+ width: 16px;
495
+ height: 16px;
496
+ margin: 6px;
497
+ animation: lakeRotate 1s linear 0s infinite normal none;
498
+ }
499
+ .lake-image .lake-progress .lake-percent {
500
+ font-size: 14px;
501
+ color: #fff;
502
+ margin: 6px;
503
+ white-space: nowrap;
504
+ }
505
+ /* error status */
506
+ .lake-image .lake-error {
507
+ padding: 16px;
508
+ }
509
+ .lake-image.lake-image-error {
510
+ border: 1px solid var(--box-border-color);
511
+ }
512
+ .lake-image.lake-image-error ::selection {
513
+ background-color: transparent;
514
+ }
515
+ lake-box[name="image"] .lake-box-selected .lake-image-error {
516
+ background-color: var(--selection-background-color);
517
+ }
518
+ .lake-image .lake-error-icon {
519
+ line-height: 0;
520
+ text-align: center;
521
+ margin-bottom: 8px;
522
+ }
523
+ .lake-image .lake-error-icon svg {
524
+ fill: var(--error-color);
525
+ width: 64px;
526
+ height: 64px;
527
+ }
528
+ .lake-image .lake-error-name {
529
+ color: var(--error-color);
530
+ line-height: normal;
531
+ }
532
+ /* full screen */
533
+ .lake-pswp .pswp__button svg {
534
+ fill: #fff;
535
+ width: 24px;
536
+ height: 24px;
537
+ }
538
+ .lake-pswp .pswp__img,
539
+ .lake-pswp.pswp--click-to-zoom.pswp--zoom-allowed .pswp__img,
540
+ .lake-pswp.pswp--click-to-zoom.pswp--zoomed-in .pswp__img:active {
541
+ cursor: pointer;
542
+ }
543
+
544
+ /* CodeMirror */
545
+ .cm-editor {
546
+ font-size: 14px;
547
+ }
548
+ .cm-editor.cm-focused {
549
+ outline: none;
550
+ }
551
+ .cm-editor .cm-content {
552
+ font-family: Consolas, Courier, monospace;
553
+ }
554
+ .cm-editor .cm-gutters {
555
+ color: var(--disabled-text-color);
556
+ border-right: 1px solid var(--border-color);
557
+ }
558
+ .cm-editor .cm-activeLineGutter {
559
+ color: var(--text-color);
560
+ background-color: transparent;
561
+ }
562
+ .cm-editor .cm-activeLine {
563
+ background-color: transparent;
564
+ }
565
+ .cm-editor .cm-selectionBackground {
566
+ background-color: transparent;
567
+ }
568
+ .cm-editor.cm-focused > .cm-scroller > .cm-selectionLayer .cm-selectionBackground {
569
+ background-color: var(--selection-background-color);
570
+ }
571
+
572
+ /* code block */
573
+ lake-box[name="codeBlock"] {
574
+ margin-bottom: 8px;
575
+ }
576
+ .lake-code-block {
577
+ box-sizing: border-box;
578
+ border: 1px solid var(--border-color);
579
+ }
580
+ lake-box[name="codeBlock"] .lake-box-selected .lake-code-block {
581
+ background-color: var(--selection-background-color);
582
+ }
583
+ lake-box[name="codeBlock"] .lake-box-focused .lake-code-block {
584
+ border-color: var(--box-border-focus-color);
585
+ }
586
+ lake-box[name="codeBlock"] .lake-box-activated .lake-code-block {
587
+ border-color: var(--box-border-active-color);
588
+ }
589
+
590
+ .lake-popup button {
591
+ border-radius: 5px;
592
+ border: 0;
593
+ color: var(--text-color);
594
+ background-color: #fff;
595
+ padding: 0;
596
+ margin: 0;
597
+ line-height: 0;
598
+ cursor: pointer;
599
+ user-select: none;
600
+ outline: none;
601
+ }
602
+ .lake-popup button svg {
603
+ width: 16px;
604
+ height: 16px;
605
+ margin: 6px;
606
+ }
607
+ .lake-popup input {
608
+ font-family: var(--font-family);
609
+ font-size: 14px;
610
+ color: var(--text-color);
611
+ width: 200px;
612
+ border-radius: 5px;
613
+ border: 1px solid var(--input-border-color);
614
+ padding: 4px 10px;
615
+ }
616
+ .lake-popup input:hover {
617
+ border: 1px solid var(--input-border-hover-color);
618
+ }
619
+ .lake-popup input:focus {
620
+ border: 1px solid var(--input-border-active-color);
621
+ outline: none;
622
+ }
623
+ .lake-popup .lake-row {
624
+ padding-bottom: 8px;
625
+ }
626
+
627
+ .lake-link-popup {
628
+ position: absolute;
629
+ z-index: 1;
630
+ border: 1px solid var(--border-color);
631
+ border-radius: 5px;
632
+ padding: 16px;
633
+ width: fit-content;
634
+ font-family: var(--font-family);
635
+ font-size: 14px;
636
+ color: var(--text-color);
637
+ background-color: #fff;
638
+ box-shadow: var(--popup-shadow);
639
+ display: none;
640
+ }
641
+ .lake-link-popup input {
642
+ width: 200px;
643
+ margin-right: 4px;
644
+ }
645
+ .lake-link-popup .lake-url-row {
646
+ display: flex;
647
+ align-items: center;
648
+ }
649
+ .lake-link-popup .lake-url-row button:hover {
650
+ background-color: var(--background-hover-color);
651
+ }
652
+ .lake-link-popup .lake-button-copy svg:first-child {
653
+ display: inline;
654
+ }
655
+ .lake-link-popup .lake-button-copy svg:nth-child(2) {
656
+ display: none;
657
+ fill: var(--success-color);
658
+ }
659
+ .lake-link-popup .lake-button-copy svg:last-child {
660
+ display: none;
661
+ fill: var(--error-color);
662
+ }
663
+ .lake-link-popup .lake-row:last-child {
664
+ padding-top: 16px;
665
+ display: flex;
666
+ align-items: center;
667
+ justify-content: space-between;
668
+ }
669
+ .lake-link-popup .lake-row:last-child button {
670
+ background-color: transparent;
671
+ border: 1px solid var(--border-color);
672
+ padding: 8px 16px;
673
+ }
674
+ .lake-link-popup .lake-row:last-child button:hover {
675
+ background-color: var(--background-hover-color);
676
+ }
677
+ .lake-link-popup .lake-row:last-child button svg {
678
+ background-color: transparent;
679
+ margin: 0 6px 0 0;
680
+ vertical-align: middle;
681
+ }
682
+ .lake-link-popup .lake-row:last-child button span {
683
+ display: inline-block;
684
+ line-height: 16px;
685
+ vertical-align: middle;
686
+ }
687
+
688
+ .lake-toolbar {
689
+ padding: 4px;
690
+ display: flex;
691
+ flex-wrap: wrap;
692
+ align-items: center;
693
+ }
694
+ .lake-toolbar .lake-toolbar-button {
695
+ border-radius: 5px;
696
+ border: 0;
697
+ color: var(--text-color);
698
+ background-color: #fff;
699
+ padding: 0;
700
+ margin: 0 1px;
701
+ line-height: 0;
702
+ cursor: pointer;
703
+ user-select: none;
704
+ outline: none;
705
+ }
706
+ .lake-toolbar .lake-toolbar-button[disabled] {
707
+ opacity: 0.25;
708
+ cursor: default;
709
+ }
710
+ .lake-toolbar .lake-toolbar-button-hovered {
711
+ background-color: var(--background-hover-color);
712
+ }
713
+ .lake-toolbar .lake-toolbar-button-selected {
714
+ background-color: var(--background-active-color);
715
+ }
716
+ .lake-toolbar .lake-toolbar-button svg {
717
+ width: 16px;
718
+ height: 16px;
719
+ margin: 6px;
720
+ }
721
+ .lake-toolbar .lake-toolbar-divider {
722
+ width: 1px;
723
+ height: 20px;
724
+ margin: 0 4px;
725
+ border-left: 1px solid var(--border-color);
726
+ user-select: none;
727
+ }
728
+ .lake-toolbar .lake-dropdown {
729
+ position: relative;
730
+ font-size: 14px;
731
+ user-select: none;
732
+ }
733
+ .lake-toolbar .lake-dropdown-title {
734
+ display: flex;
735
+ align-items: center;
736
+ justify-content: space-between;
737
+ padding: 0;
738
+ margin-right: 4px;
739
+ border-radius: 5px;
740
+ border: 0;
741
+ background-color: #fff;
742
+ cursor: pointer;
743
+ outline: none;
744
+ }
745
+ .lake-toolbar .lake-dropdown[disabled] .lake-dropdown-title {
746
+ opacity: 0.25;
747
+ cursor: default;
748
+ }
749
+ .lake-toolbar .lake-dropdown-list .lake-dropdown-title-hovered {
750
+ background-color: var(--background-hover-color);
751
+ }
752
+ .lake-toolbar .lake-dropdown-title.lake-dropdown-title-no-down {
753
+ margin-right: 0;
754
+ }
755
+ .lake-toolbar .lake-dropdown-text {
756
+ height: 16px;
757
+ margin: 6px;
758
+ overflow: hidden;
759
+ white-space: nowrap;
760
+ color: var(--text-color);
761
+ }
762
+ .lake-toolbar .lake-dropdown-icon {
763
+ position: relative;
764
+ line-height: 0;
765
+ border-radius: 5px 0 0 5px;
766
+ }
767
+ .lake-toolbar .lake-dropdown-icon-hovered {
768
+ background-color: var(--background-hover-color);
769
+ }
770
+ .lake-toolbar .lake-dropdown-icon svg {
771
+ width: 16px;
772
+ height: 16px;
773
+ margin: 6px 2px 6px 4px;
774
+ }
775
+ .lake-toolbar .lake-dropdown-color .lake-dropdown-icon svg:last-child {
776
+ position: absolute;
777
+ left: 0;
778
+ bottom: 0;
779
+ }
780
+ .lake-toolbar .lake-dropdown-title-no-down .lake-dropdown-icon svg {
781
+ margin: 6px;
782
+ }
783
+ .lake-toolbar .lake-dropdown-down-icon {
784
+ line-height: 0;
785
+ border-radius: 0 5px 5px 0;
786
+ }
787
+ .lake-toolbar .lake-dropdown-down-icon-hovered {
788
+ background-color: var(--background-hover-color);
789
+ }
790
+ .lake-toolbar .lake-dropdown-down-icon svg {
791
+ width: 12px;
792
+ height: 12px;
793
+ margin: 8px 2px;
794
+ fill: var(--secondary-text-color);
795
+ }
796
+ .lake-toolbar .lake-dropdown-menu {
797
+ position: absolute;
798
+ top: 30px;
799
+ left: 0;
800
+ z-index: 1;
801
+ list-style: none;
802
+ margin: 0;
803
+ padding: 6px 0;
804
+ border: 1px solid var(--border-color);
805
+ border-radius: 5px;
806
+ color: var(--text-color);
807
+ background-color: #fff;
808
+ box-shadow: var(--popup-shadow);
809
+ display: none;
810
+ }
811
+ .lake-toolbar .lake-dropdown-menu li {
812
+ display: flex;
813
+ align-items: center;
814
+ cursor: pointer;
815
+ }
816
+ .lake-toolbar .lake-dropdown-list-menu li {
817
+ padding: 6px 24px 6px 10px;
818
+ }
819
+ .lake-toolbar .lake-dropdown-list-menu li:hover {
820
+ background-color: var(--background-hover-color);
821
+ }
822
+ .lake-toolbar .lake-dropdown-list-menu li .lake-dropdown-menu-check {
823
+ line-height: 0;
824
+ visibility: hidden;
825
+ }
826
+ .lake-toolbar .lake-dropdown-list-menu li .lake-dropdown-menu-check svg {
827
+ width: 12px;
828
+ height: 12px;
829
+ }
830
+ .lake-toolbar .lake-dropdown-list-menu li .lake-dropdown-menu-icon {
831
+ line-height: 0;
832
+ margin-left: 10px;
833
+ }
834
+ .lake-toolbar .lake-dropdown-list-menu li .lake-dropdown-menu-icon svg {
835
+ width: 16px;
836
+ height: 16px;
837
+ }
838
+ .lake-toolbar .lake-dropdown-list-menu li .lake-dropdown-menu-text {
839
+ margin-left: 10px;
840
+ white-space: nowrap;
841
+ }
842
+ .lake-toolbar .lake-dropdown-color-menu {
843
+ flex-wrap: wrap;
844
+ justify-content: center;
845
+ width: 296px;
846
+ }
847
+ .lake-toolbar .lake-dropdown-color-menu li {
848
+ position: relative;
849
+ padding: 0;
850
+ }
851
+ .lake-toolbar .lake-dropdown-color-menu li:hover {
852
+ background-color: var(--background-hover-color);
853
+ }
854
+ .lake-toolbar .lake-dropdown-color-menu li .lake-dropdown-menu-check {
855
+ position: absolute;
856
+ top: 6px;
857
+ left: 6px;
858
+ z-index: 1;
859
+ line-height: 0;
860
+ visibility: hidden;
861
+ }
862
+ .lake-toolbar .lake-dropdown-color-menu li .lake-dropdown-menu-check svg {
863
+ width: 12px;
864
+ height: 12px;
865
+ fill: #fff;
866
+ }
867
+ .lake-toolbar .lake-dropdown-color-menu li[value^="#f" i] .lake-dropdown-menu-check svg,
868
+ .lake-toolbar .lake-dropdown-color-menu li[value^="#e6" i] .lake-dropdown-menu-check svg {
869
+ fill: #000;
870
+ }
871
+ .lake-toolbar .lake-dropdown-color-menu li .lake-dropdown-menu-icon {
872
+ line-height: 0;
873
+ }
874
+ .lake-toolbar .lake-dropdown-color-menu li .lake-dropdown-menu-icon svg {
875
+ width: 16px;
876
+ height: 16px;
877
+ margin: 3px 4px;
878
+ }
879
+ .lake-toolbar .lake-dropdown-color-menu li .lake-dropdown-menu-text {
880
+ font-size: 0;
881
+ border: 1px solid var(--background-hover-color);
882
+ border-radius: 2px;
883
+ width: 16px;
884
+ height: 16px;
885
+ margin: 3px;
886
+ }
887
+ .lake-toolbar .lake-dropdown-color-menu li:first-child {
888
+ width: 100%;
889
+ margin-left: 10px;
890
+ margin-right: 10px;
891
+ margin-bottom: 4px;
892
+ }
893
+ .lake-toolbar .lake-dropdown-color-menu li:first-child .lake-dropdown-menu-check {
894
+ display: none;
895
+ }
896
+ .lake-toolbar .lake-dropdown-color-menu li:first-child .lake-dropdown-menu-text {
897
+ width: 100%;
898
+ font-size: 14px;
899
+ border: 1px solid transparent;
900
+ height: auto;
901
+ }
902
+ .lake-toolbar .lake-upload {
903
+ line-height: 0;
904
+ }
905
+ .lake-toolbar .lake-upload input[type="file"] {
906
+ display: none;
907
+ }
908
+
909
+ /*! PhotoSwipe main CSS by Dmytro Semenov | photoswipe.com */
910
+
911
+ .pswp {
912
+ --pswp-bg: #000;
913
+ --pswp-placeholder-bg: #222;
914
+
915
+
916
+ --pswp-root-z-index: 100000;
917
+
918
+ --pswp-preloader-color: rgba(79, 79, 79, 0.4);
919
+ --pswp-preloader-color-secondary: rgba(255, 255, 255, 0.9);
920
+
921
+ /* defined via js:
922
+ --pswp-transition-duration: 333ms; */
923
+
924
+ --pswp-icon-color: #fff;
925
+ --pswp-icon-color-secondary: #4f4f4f;
926
+ --pswp-icon-stroke-color: #4f4f4f;
927
+ --pswp-icon-stroke-width: 2px;
928
+
929
+ --pswp-error-text-color: var(--pswp-icon-color);
930
+ }
931
+
932
+
933
+ /*
934
+ Styles for basic PhotoSwipe (pswp) functionality (sliding area, open/close transitions)
935
+ */
936
+
937
+ .pswp {
938
+ position: fixed;
939
+ top: 0;
940
+ left: 0;
941
+ width: 100%;
942
+ height: 100%;
943
+ z-index: var(--pswp-root-z-index);
944
+ display: none;
945
+ touch-action: none;
946
+ outline: 0;
947
+ opacity: 0.003;
948
+ contain: layout style size;
949
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
950
+ }
951
+
952
+ /* Prevents focus outline on the root element,
953
+ (it may be focused initially) */
954
+ .pswp:focus {
955
+ outline: 0;
956
+ }
957
+
958
+ .pswp * {
959
+ box-sizing: border-box;
960
+ }
961
+
962
+ .pswp img {
963
+ max-width: none;
964
+ }
965
+
966
+ .pswp--open {
967
+ display: block;
968
+ }
969
+
970
+ .pswp,
971
+ .pswp__bg {
972
+ transform: translateZ(0);
973
+ will-change: opacity;
974
+ }
975
+
976
+ .pswp__bg {
977
+ opacity: 0.005;
978
+ background: var(--pswp-bg);
979
+ }
980
+
981
+ .pswp,
982
+ .pswp__scroll-wrap {
983
+ overflow: hidden;
984
+ }
985
+
986
+ .pswp__scroll-wrap,
987
+ .pswp__bg,
988
+ .pswp__container,
989
+ .pswp__item,
990
+ .pswp__content,
991
+ .pswp__img,
992
+ .pswp__zoom-wrap {
993
+ position: absolute;
994
+ top: 0;
995
+ left: 0;
996
+ width: 100%;
997
+ height: 100%;
998
+ }
999
+
1000
+ .pswp__img,
1001
+ .pswp__zoom-wrap {
1002
+ width: auto;
1003
+ height: auto;
1004
+ }
1005
+
1006
+ .pswp--click-to-zoom.pswp--zoom-allowed .pswp__img {
1007
+ cursor: -webkit-zoom-in;
1008
+ cursor: -moz-zoom-in;
1009
+ cursor: zoom-in;
1010
+ }
1011
+
1012
+ .pswp--click-to-zoom.pswp--zoomed-in .pswp__img {
1013
+ cursor: move;
1014
+ cursor: -webkit-grab;
1015
+ cursor: -moz-grab;
1016
+ cursor: grab;
1017
+ }
1018
+
1019
+ .pswp--click-to-zoom.pswp--zoomed-in .pswp__img:active {
1020
+ cursor: -webkit-grabbing;
1021
+ cursor: -moz-grabbing;
1022
+ cursor: grabbing;
1023
+ }
1024
+
1025
+ /* :active to override grabbing cursor */
1026
+ .pswp--no-mouse-drag.pswp--zoomed-in .pswp__img,
1027
+ .pswp--no-mouse-drag.pswp--zoomed-in .pswp__img:active,
1028
+ .pswp__img {
1029
+ cursor: -webkit-zoom-out;
1030
+ cursor: -moz-zoom-out;
1031
+ cursor: zoom-out;
1032
+ }
1033
+
1034
+
1035
+ /* Prevent selection and tap highlights */
1036
+ .pswp__container,
1037
+ .pswp__img,
1038
+ .pswp__button,
1039
+ .pswp__counter {
1040
+ -webkit-user-select: none;
1041
+ -moz-user-select: none;
1042
+ -ms-user-select: none;
1043
+ user-select: none;
1044
+ }
1045
+
1046
+ .pswp__item {
1047
+ /* z-index for fade transition */
1048
+ z-index: 1;
1049
+ overflow: hidden;
1050
+ }
1051
+
1052
+ .pswp__hidden {
1053
+ display: none !important;
1054
+ }
1055
+
1056
+ /* Allow to click through pswp__content element, but not its children */
1057
+ .pswp__content {
1058
+ pointer-events: none;
1059
+ }
1060
+ .pswp__content > * {
1061
+ pointer-events: auto;
1062
+ }
1063
+
1064
+
1065
+ /*
1066
+
1067
+ PhotoSwipe UI
1068
+
1069
+ */
1070
+
1071
+ /*
1072
+ Error message appears when image is not loaded
1073
+ (JS option errorMsg controls markup)
1074
+ */
1075
+ .pswp__error-msg-container {
1076
+ display: grid;
1077
+ }
1078
+ .pswp__error-msg {
1079
+ margin: auto;
1080
+ font-size: 1em;
1081
+ line-height: 1;
1082
+ color: var(--pswp-error-text-color);
1083
+ }
1084
+
1085
+ /*
1086
+ class pswp__hide-on-close is applied to elements that
1087
+ should hide (for example fade out) when PhotoSwipe is closed
1088
+ and show (for example fade in) when PhotoSwipe is opened
1089
+ */
1090
+ .pswp .pswp__hide-on-close {
1091
+ opacity: 0.005;
1092
+ will-change: opacity;
1093
+ transition: opacity var(--pswp-transition-duration) cubic-bezier(0.4, 0, 0.22, 1);
1094
+ z-index: 10; /* always overlap slide content */
1095
+ pointer-events: none; /* hidden elements should not be clickable */
1096
+ }
1097
+
1098
+ /* class pswp--ui-visible is added when opening or closing transition starts */
1099
+ .pswp--ui-visible .pswp__hide-on-close {
1100
+ opacity: 1;
1101
+ pointer-events: auto;
1102
+ }
1103
+
1104
+ /* <button> styles, including css reset */
1105
+ .pswp__button {
1106
+ position: relative;
1107
+ display: block;
1108
+ width: 50px;
1109
+ height: 60px;
1110
+ padding: 0;
1111
+ margin: 0;
1112
+ overflow: hidden;
1113
+ cursor: pointer;
1114
+ background: none;
1115
+ border: 0;
1116
+ box-shadow: none;
1117
+ opacity: 0.85;
1118
+ -webkit-appearance: none;
1119
+ -webkit-touch-callout: none;
1120
+ }
1121
+
1122
+ .pswp__button:hover,
1123
+ .pswp__button:active,
1124
+ .pswp__button:focus {
1125
+ transition: none;
1126
+ padding: 0;
1127
+ background: none;
1128
+ border: 0;
1129
+ box-shadow: none;
1130
+ opacity: 1;
1131
+ }
1132
+
1133
+ .pswp__button:disabled {
1134
+ opacity: 0.3;
1135
+ cursor: auto;
1136
+ }
1137
+
1138
+ .pswp__icn {
1139
+ fill: var(--pswp-icon-color);
1140
+ color: var(--pswp-icon-color-secondary);
1141
+ }
1142
+
1143
+ .pswp__icn {
1144
+ position: absolute;
1145
+ top: 14px;
1146
+ left: 9px;
1147
+ width: 32px;
1148
+ height: 32px;
1149
+ overflow: hidden;
1150
+ pointer-events: none;
1151
+ }
1152
+
1153
+ .pswp__icn-shadow {
1154
+ stroke: var(--pswp-icon-stroke-color);
1155
+ stroke-width: var(--pswp-icon-stroke-width);
1156
+ fill: none;
1157
+ }
1158
+
1159
+ .pswp__icn:focus {
1160
+ outline: 0;
1161
+ }
1162
+
1163
+ /*
1164
+ div element that matches size of large image,
1165
+ large image loads on top of it,
1166
+ used when msrc is not provided
1167
+ */
1168
+ div.pswp__img--placeholder,
1169
+ .pswp__img--with-bg {
1170
+ background: var(--pswp-placeholder-bg);
1171
+ }
1172
+
1173
+ .pswp__top-bar {
1174
+ position: absolute;
1175
+ left: 0;
1176
+ top: 0;
1177
+ width: 100%;
1178
+ height: 60px;
1179
+ display: flex;
1180
+ flex-direction: row;
1181
+ justify-content: flex-end;
1182
+ z-index: 10;
1183
+
1184
+ /* allow events to pass through top bar itself */
1185
+ pointer-events: none !important;
1186
+ }
1187
+ .pswp__top-bar > * {
1188
+ pointer-events: auto;
1189
+ /* this makes transition significantly more smooth,
1190
+ even though inner elements are not animated */
1191
+ will-change: opacity;
1192
+ }
1193
+
1194
+
1195
+ /*
1196
+
1197
+ Close button
1198
+
1199
+ */
1200
+ .pswp__button--close {
1201
+ margin-right: 6px;
1202
+ }
1203
+
1204
+
1205
+ /*
1206
+
1207
+ Arrow buttons
1208
+
1209
+ */
1210
+ .pswp__button--arrow {
1211
+ position: absolute;
1212
+ top: 0;
1213
+ width: 75px;
1214
+ height: 100px;
1215
+ top: 50%;
1216
+ margin-top: -50px;
1217
+ }
1218
+
1219
+ .pswp__button--arrow:disabled {
1220
+ display: none;
1221
+ cursor: default;
1222
+ }
1223
+
1224
+ .pswp__button--arrow .pswp__icn {
1225
+ top: 50%;
1226
+ margin-top: -30px;
1227
+ width: 60px;
1228
+ height: 60px;
1229
+ background: none;
1230
+ border-radius: 0;
1231
+ }
1232
+
1233
+ .pswp--one-slide .pswp__button--arrow {
1234
+ display: none;
1235
+ }
1236
+
1237
+ /* hide arrows on touch screens */
1238
+ .pswp--touch .pswp__button--arrow {
1239
+ visibility: hidden;
1240
+ }
1241
+
1242
+ /* show arrows only after mouse was used */
1243
+ .pswp--has_mouse .pswp__button--arrow {
1244
+ visibility: visible;
1245
+ }
1246
+
1247
+ .pswp__button--arrow--prev {
1248
+ right: auto;
1249
+ left: 0px;
1250
+ }
1251
+
1252
+ .pswp__button--arrow--next {
1253
+ right: 0px;
1254
+ }
1255
+ .pswp__button--arrow--next .pswp__icn {
1256
+ left: auto;
1257
+ right: 14px;
1258
+ /* flip horizontally */
1259
+ transform: scale(-1, 1);
1260
+ }
1261
+
1262
+ /*
1263
+
1264
+ Zoom button
1265
+
1266
+ */
1267
+ .pswp__button--zoom {
1268
+ display: none;
1269
+ }
1270
+
1271
+ .pswp--zoom-allowed .pswp__button--zoom {
1272
+ display: block;
1273
+ }
1274
+
1275
+ /* "+" => "-" */
1276
+ .pswp--zoomed-in .pswp__zoom-icn-bar-v {
1277
+ display: none;
1278
+ }
1279
+
1280
+
1281
+ /*
1282
+
1283
+ Loading indicator
1284
+
1285
+ */
1286
+ .pswp__preloader {
1287
+ position: relative;
1288
+ overflow: hidden;
1289
+ width: 50px;
1290
+ height: 60px;
1291
+ margin-right: auto;
1292
+ }
1293
+
1294
+ .pswp__preloader .pswp__icn {
1295
+ opacity: 0;
1296
+ transition: opacity 0.2s linear;
1297
+ animation: pswp-clockwise 600ms linear infinite;
1298
+ }
1299
+
1300
+ .pswp__preloader--active .pswp__icn {
1301
+ opacity: 0.85;
1302
+ }
1303
+
1304
+ @keyframes pswp-clockwise {
1305
+ 0% { transform: rotate(0deg); }
1306
+ 100% { transform: rotate(360deg); }
1307
+ }
1308
+
1309
+
1310
+ /*
1311
+
1312
+ "1 of 10" counter
1313
+
1314
+ */
1315
+ .pswp__counter {
1316
+ height: 30px;
1317
+ margin-top: 15px;
1318
+ margin-inline-start: 20px;
1319
+ font-size: 14px;
1320
+ line-height: 30px;
1321
+ color: var(--pswp-icon-color);
1322
+ text-shadow: 1px 1px 3px var(--pswp-icon-color-secondary);
1323
+ opacity: 0.85;
1324
+ }
1325
+
1326
+ .pswp--one-slide .pswp__counter {
1327
+ display: none;
1328
+ }