@fto-consult/expo-ui 7.4.42 → 7.4.44

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 (31) hide show
  1. package/electron/index.js +0 -7
  2. package/electron/pdf-viewer/viewer.css +14 -3718
  3. package/electron/pdf-viewer/wiewer.html +30 -0
  4. package/electron/preload.js +3 -4
  5. package/package.json +2 -1
  6. package/src/pdf/print.electron.js +11 -3
  7. package/src/pdf/print.web.js +3 -2
  8. package/electron/pdf-viewer/locale/en-CA/viewer.ftl +0 -311
  9. package/electron/pdf-viewer/locale/en-GB/viewer.ftl +0 -351
  10. package/electron/pdf-viewer/locale/en-US/viewer.ftl +0 -377
  11. package/electron/pdf-viewer/locale/fr/viewer.ftl +0 -347
  12. package/electron/pdf-viewer/locale/locale.json +0 -6
  13. package/electron/pdf-viewer/pdf.min.mjs +0 -21
  14. package/electron/pdf-viewer/viewer.html +0 -491
  15. package/electron/pdf-viewer/web/images/altText_add.svg +0 -3
  16. package/electron/pdf-viewer/web/images/altText_done.svg +0 -3
  17. package/electron/pdf-viewer/web/images/annotation-check.svg +0 -11
  18. package/electron/pdf-viewer/web/images/annotation-comment.svg +0 -16
  19. package/electron/pdf-viewer/web/images/annotation-help.svg +0 -26
  20. package/electron/pdf-viewer/web/images/annotation-insert.svg +0 -10
  21. package/electron/pdf-viewer/web/images/annotation-key.svg +0 -11
  22. package/electron/pdf-viewer/web/images/annotation-newparagraph.svg +0 -11
  23. package/electron/pdf-viewer/web/images/annotation-noicon.svg +0 -7
  24. package/electron/pdf-viewer/web/images/annotation-note.svg +0 -42
  25. package/electron/pdf-viewer/web/images/annotation-paperclip.svg +0 -6
  26. package/electron/pdf-viewer/web/images/annotation-paragraph.svg +0 -16
  27. package/electron/pdf-viewer/web/images/annotation-pushpin.svg +0 -7
  28. package/electron/pdf-viewer/web/images/editor-toolbar-delete.svg +0 -5
  29. package/electron/pdf-viewer/web/images/loading-icon.gif +0 -0
  30. package/electron/pdf-viewer/web/pdf_viewer.css +0 -2120
  31. package/electron/pdf-viewer/web/pdf_viewer.mjs +0 -8598
@@ -1,3718 +1,14 @@
1
- /* Copyright 2014 Mozilla Foundation
2
- *
3
- * Licensed under the Apache License, Version 2.0 (the "License");
4
- * you may not use this file except in compliance with the License.
5
- * You may obtain a copy of the License at
6
- *
7
- * http://www.apache.org/licenses/LICENSE-2.0
8
- *
9
- * Unless required by applicable law or agreed to in writing, software
10
- * distributed under the License is distributed on an "AS IS" BASIS,
11
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12
- * See the License for the specific language governing permissions and
13
- * limitations under the License.
14
- */
15
-
16
- .textLayer{
17
- position:absolute;
18
- text-align:initial;
19
- inset:0;
20
- overflow:hidden;
21
- opacity:0.25;
22
- line-height:1;
23
- -webkit-text-size-adjust:none;
24
- -moz-text-size-adjust:none;
25
- text-size-adjust:none;
26
- forced-color-adjust:none;
27
- transform-origin:0 0;
28
- z-index:2;
29
- }
30
-
31
- .textLayer :is(span, br){
32
- color:transparent;
33
- position:absolute;
34
- white-space:pre;
35
- cursor:text;
36
- transform-origin:0% 0%;
37
- }
38
-
39
- .textLayer span.markedContent{
40
- top:0;
41
- height:0;
42
- }
43
-
44
- .textLayer .highlight{
45
- --highlight-bg-color:rgb(180 0 170);
46
- --highlight-selected-bg-color:rgb(0 100 0);
47
-
48
- margin:-1px;
49
- padding:1px;
50
- background-color:var(--highlight-bg-color);
51
- border-radius:4px;
52
- }
53
-
54
- @media screen and (forced-colors: active){
55
-
56
- .textLayer .highlight{
57
- --highlight-bg-color:Highlight;
58
- --highlight-selected-bg-color:ButtonText;
59
- }
60
- }
61
-
62
- .textLayer .highlight.appended{
63
- position:initial;
64
- }
65
-
66
- .textLayer .highlight.begin{
67
- border-radius:4px 0 0 4px;
68
- }
69
-
70
- .textLayer .highlight.end{
71
- border-radius:0 4px 4px 0;
72
- }
73
-
74
- .textLayer .highlight.middle{
75
- border-radius:0;
76
- }
77
-
78
- .textLayer .highlight.selected{
79
- background-color:var(--highlight-selected-bg-color);
80
- }
81
-
82
- .textLayer ::-moz-selection{
83
- background:blue;
84
- background:AccentColor;
85
- }
86
-
87
- .textLayer ::selection{
88
- background:blue;
89
- background:AccentColor;
90
- }
91
-
92
- .textLayer br::-moz-selection{
93
- background:transparent;
94
- }
95
-
96
- .textLayer br::selection{
97
- background:transparent;
98
- }
99
-
100
- .textLayer .endOfContent{
101
- display:block;
102
- position:absolute;
103
- inset:100% 0 0;
104
- z-index:-1;
105
- cursor:default;
106
- -webkit-user-select:none;
107
- -moz-user-select:none;
108
- user-select:none;
109
- }
110
-
111
- .textLayer .endOfContent.active{
112
- top:0;
113
- }
114
-
115
- .annotationLayer{
116
- --annotation-unfocused-field-background:url("data:image/svg+xml;charset=UTF-8,<svg width='1px' height='1px' xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' style='fill:rgba(0, 54, 255, 0.13);'/></svg>");
117
- --input-focus-border-color:Highlight;
118
- --input-focus-outline:1px solid Canvas;
119
- --input-unfocused-border-color:transparent;
120
- --input-disabled-border-color:transparent;
121
- --input-hover-border-color:black;
122
- --link-outline:none;
123
-
124
- position:absolute;
125
- top:0;
126
- left:0;
127
- pointer-events:none;
128
- transform-origin:0 0;
129
- z-index:3;
130
- }
131
-
132
- @media screen and (forced-colors: active){
133
-
134
- .annotationLayer{
135
- --input-focus-border-color:CanvasText;
136
- --input-unfocused-border-color:ActiveText;
137
- --input-disabled-border-color:GrayText;
138
- --input-hover-border-color:Highlight;
139
- --link-outline:1.5px solid LinkText;
140
- --hcm-highlight-filter:invert(100%);
141
- }
142
-
143
- .annotationLayer .textWidgetAnnotation :is(input, textarea):required, .annotationLayer .choiceWidgetAnnotation select:required, .annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input:required{
144
- outline:1.5px solid selectedItem;
145
- }
146
-
147
- .annotationLayer .linkAnnotation{
148
- outline:var(--link-outline);
149
- }
150
-
151
- .annotationLayer .linkAnnotation:hover{
152
- -webkit-backdrop-filter:var(--hcm-highlight-filter);
153
- backdrop-filter:var(--hcm-highlight-filter);
154
- }
155
-
156
- .annotationLayer .linkAnnotation > a:hover{
157
- opacity:0 !important;
158
- background:none !important;
159
- box-shadow:none;
160
- }
161
-
162
- .annotationLayer .popupAnnotation .popup{
163
- outline:calc(1.5px * var(--scale-factor)) solid CanvasText !important;
164
- background-color:ButtonFace !important;
165
- color:ButtonText !important;
166
- }
167
-
168
- .annotationLayer .highlightArea:hover::after{
169
- position:absolute;
170
- top:0;
171
- left:0;
172
- width:100%;
173
- height:100%;
174
- -webkit-backdrop-filter:var(--hcm-highlight-filter);
175
- backdrop-filter:var(--hcm-highlight-filter);
176
- content:"";
177
- pointer-events:none;
178
- }
179
-
180
- .annotationLayer .popupAnnotation.focused .popup{
181
- outline:calc(3px * var(--scale-factor)) solid Highlight !important;
182
- }
183
- }
184
-
185
- .annotationLayer[data-main-rotation="90"] .norotate{
186
- transform:rotate(270deg) translateX(-100%);
187
- }
188
-
189
- .annotationLayer[data-main-rotation="180"] .norotate{
190
- transform:rotate(180deg) translate(-100%, -100%);
191
- }
192
-
193
- .annotationLayer[data-main-rotation="270"] .norotate{
194
- transform:rotate(90deg) translateY(-100%);
195
- }
196
-
197
- .annotationLayer canvas{
198
- position:absolute;
199
- width:100%;
200
- height:100%;
201
- pointer-events:none;
202
- }
203
-
204
- .annotationLayer section{
205
- position:absolute;
206
- text-align:initial;
207
- pointer-events:auto;
208
- box-sizing:border-box;
209
- transform-origin:0 0;
210
- }
211
-
212
- .annotationLayer :is(.linkAnnotation, .buttonWidgetAnnotation.pushButton) > a{
213
- position:absolute;
214
- font-size:1em;
215
- top:0;
216
- left:0;
217
- width:100%;
218
- height:100%;
219
- }
220
-
221
- .annotationLayer :is(.linkAnnotation, .buttonWidgetAnnotation.pushButton):not(.hasBorder)
222
- > a:hover{
223
- opacity:0.2;
224
- background-color:rgb(255 255 0);
225
- box-shadow:0 2px 10px rgb(255 255 0);
226
- }
227
-
228
- .annotationLayer .linkAnnotation.hasBorder:hover{
229
- background-color:rgb(255 255 0 / 0.2);
230
- }
231
-
232
- .annotationLayer .hasBorder{
233
- background-size:100% 100%;
234
- }
235
-
236
- .annotationLayer .textAnnotation img{
237
- position:absolute;
238
- cursor:pointer;
239
- width:100%;
240
- height:100%;
241
- top:0;
242
- left:0;
243
- }
244
-
245
- .annotationLayer .textWidgetAnnotation :is(input, textarea), .annotationLayer .choiceWidgetAnnotation select, .annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input{
246
- background-image:var(--annotation-unfocused-field-background);
247
- border:2px solid var(--input-unfocused-border-color);
248
- box-sizing:border-box;
249
- font:calc(9px * var(--scale-factor)) sans-serif;
250
- height:100%;
251
- margin:0;
252
- vertical-align:top;
253
- width:100%;
254
- }
255
-
256
- .annotationLayer .textWidgetAnnotation :is(input, textarea):required, .annotationLayer .choiceWidgetAnnotation select:required, .annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input:required{
257
- outline:1.5px solid red;
258
- }
259
-
260
- .annotationLayer .choiceWidgetAnnotation select option{
261
- padding:0;
262
- }
263
-
264
- .annotationLayer .buttonWidgetAnnotation.radioButton input{
265
- border-radius:50%;
266
- }
267
-
268
- .annotationLayer .textWidgetAnnotation textarea{
269
- resize:none;
270
- }
271
-
272
- .annotationLayer .textWidgetAnnotation [disabled]:is(input, textarea), .annotationLayer .choiceWidgetAnnotation select[disabled], .annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input[disabled]{
273
- background:none;
274
- border:2px solid var(--input-disabled-border-color);
275
- cursor:not-allowed;
276
- }
277
-
278
- .annotationLayer .textWidgetAnnotation :is(input, textarea):hover, .annotationLayer .choiceWidgetAnnotation select:hover, .annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input:hover{
279
- border:2px solid var(--input-hover-border-color);
280
- }
281
-
282
- .annotationLayer .textWidgetAnnotation :is(input, textarea):hover, .annotationLayer .choiceWidgetAnnotation select:hover, .annotationLayer .buttonWidgetAnnotation.checkBox input:hover{
283
- border-radius:2px;
284
- }
285
-
286
- .annotationLayer .textWidgetAnnotation :is(input, textarea):focus, .annotationLayer .choiceWidgetAnnotation select:focus{
287
- background:none;
288
- border:2px solid var(--input-focus-border-color);
289
- border-radius:2px;
290
- outline:var(--input-focus-outline);
291
- }
292
-
293
- .annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) :focus{
294
- background-image:none;
295
- background-color:transparent;
296
- }
297
-
298
- .annotationLayer .buttonWidgetAnnotation.checkBox :focus{
299
- border:2px solid var(--input-focus-border-color);
300
- border-radius:2px;
301
- outline:var(--input-focus-outline);
302
- }
303
-
304
- .annotationLayer .buttonWidgetAnnotation.radioButton :focus{
305
- border:2px solid var(--input-focus-border-color);
306
- outline:var(--input-focus-outline);
307
- }
308
-
309
- .annotationLayer .buttonWidgetAnnotation.checkBox input:checked::before,
310
- .annotationLayer .buttonWidgetAnnotation.checkBox input:checked::after,
311
- .annotationLayer .buttonWidgetAnnotation.radioButton input:checked::before{
312
- background-color:CanvasText;
313
- content:"";
314
- display:block;
315
- position:absolute;
316
- }
317
-
318
- .annotationLayer .buttonWidgetAnnotation.checkBox input:checked::before,
319
- .annotationLayer .buttonWidgetAnnotation.checkBox input:checked::after{
320
- height:80%;
321
- left:45%;
322
- width:1px;
323
- }
324
-
325
- .annotationLayer .buttonWidgetAnnotation.checkBox input:checked::before{
326
- transform:rotate(45deg);
327
- }
328
-
329
- .annotationLayer .buttonWidgetAnnotation.checkBox input:checked::after{
330
- transform:rotate(-45deg);
331
- }
332
-
333
- .annotationLayer .buttonWidgetAnnotation.radioButton input:checked::before{
334
- border-radius:50%;
335
- height:50%;
336
- left:30%;
337
- top:20%;
338
- width:50%;
339
- }
340
-
341
- .annotationLayer .textWidgetAnnotation input.comb{
342
- font-family:monospace;
343
- padding-left:2px;
344
- padding-right:0;
345
- }
346
-
347
- .annotationLayer .textWidgetAnnotation input.comb:focus{
348
- width:103%;
349
- }
350
-
351
- .annotationLayer .buttonWidgetAnnotation:is(.checkBox, .radioButton) input{
352
- -webkit-appearance:none;
353
- -moz-appearance:none;
354
- appearance:none;
355
- }
356
-
357
- .annotationLayer .fileAttachmentAnnotation .popupTriggerArea{
358
- height:100%;
359
- width:100%;
360
- }
361
-
362
- .annotationLayer .popupAnnotation{
363
- position:absolute;
364
- font-size:calc(9px * var(--scale-factor));
365
- pointer-events:none;
366
- width:-moz-max-content;
367
- width:max-content;
368
- max-width:45%;
369
- height:auto;
370
- }
371
-
372
- .annotationLayer .popup{
373
- background-color:rgb(255 255 153);
374
- box-shadow:0 calc(2px * var(--scale-factor)) calc(5px * var(--scale-factor)) rgb(136 136 136);
375
- border-radius:calc(2px * var(--scale-factor));
376
- outline:1.5px solid rgb(255 255 74);
377
- padding:calc(6px * var(--scale-factor));
378
- cursor:pointer;
379
- font:message-box;
380
- white-space:normal;
381
- word-wrap:break-word;
382
- pointer-events:auto;
383
- }
384
-
385
- .annotationLayer .popupAnnotation.focused .popup{
386
- outline-width:3px;
387
- }
388
-
389
- .annotationLayer .popup *{
390
- font-size:calc(9px * var(--scale-factor));
391
- }
392
-
393
- .annotationLayer .popup > .header{
394
- display:inline-block;
395
- }
396
-
397
- .annotationLayer .popup > .header h1{
398
- display:inline;
399
- }
400
-
401
- .annotationLayer .popup > .header .popupDate{
402
- display:inline-block;
403
- margin-left:calc(5px * var(--scale-factor));
404
- width:-moz-fit-content;
405
- width:fit-content;
406
- }
407
-
408
- .annotationLayer .popupContent{
409
- border-top:1px solid rgb(51 51 51);
410
- margin-top:calc(2px * var(--scale-factor));
411
- padding-top:calc(2px * var(--scale-factor));
412
- }
413
-
414
- .annotationLayer .richText > *{
415
- white-space:pre-wrap;
416
- font-size:calc(9px * var(--scale-factor));
417
- }
418
-
419
- .annotationLayer .popupTriggerArea{
420
- cursor:pointer;
421
- }
422
-
423
- .annotationLayer section svg{
424
- position:absolute;
425
- width:100%;
426
- height:100%;
427
- top:0;
428
- left:0;
429
- }
430
-
431
- .annotationLayer .annotationTextContent{
432
- position:absolute;
433
- width:100%;
434
- height:100%;
435
- opacity:0;
436
- color:transparent;
437
- -webkit-user-select:none;
438
- -moz-user-select:none;
439
- user-select:none;
440
- pointer-events:none;
441
- }
442
-
443
- .annotationLayer .annotationTextContent span{
444
- width:100%;
445
- display:inline-block;
446
- }
447
-
448
- .annotationLayer svg.quadrilateralsContainer{
449
- contain:strict;
450
- width:0;
451
- height:0;
452
- position:absolute;
453
- top:0;
454
- left:0;
455
- z-index:-1;
456
- }
457
-
458
- :root{
459
- --xfa-unfocused-field-background:url("data:image/svg+xml;charset=UTF-8,<svg width='1px' height='1px' xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' style='fill:rgba(0, 54, 255, 0.13);'/></svg>");
460
- --xfa-focus-outline:auto;
461
- }
462
-
463
- @media screen and (forced-colors: active){
464
- :root{
465
- --xfa-focus-outline:2px solid CanvasText;
466
- }
467
- .xfaLayer *:required{
468
- outline:1.5px solid selectedItem;
469
- }
470
- }
471
-
472
- .xfaLayer{
473
- background-color:transparent;
474
- }
475
-
476
- .xfaLayer .highlight{
477
- margin:-1px;
478
- padding:1px;
479
- background-color:rgb(239 203 237);
480
- border-radius:4px;
481
- }
482
-
483
- .xfaLayer .highlight.appended{
484
- position:initial;
485
- }
486
-
487
- .xfaLayer .highlight.begin{
488
- border-radius:4px 0 0 4px;
489
- }
490
-
491
- .xfaLayer .highlight.end{
492
- border-radius:0 4px 4px 0;
493
- }
494
-
495
- .xfaLayer .highlight.middle{
496
- border-radius:0;
497
- }
498
-
499
- .xfaLayer .highlight.selected{
500
- background-color:rgb(203 223 203);
501
- }
502
-
503
- .xfaPage{
504
- overflow:hidden;
505
- position:relative;
506
- }
507
-
508
- .xfaContentarea{
509
- position:absolute;
510
- }
511
-
512
- .xfaPrintOnly{
513
- display:none;
514
- }
515
-
516
- .xfaLayer{
517
- position:absolute;
518
- text-align:initial;
519
- top:0;
520
- left:0;
521
- transform-origin:0 0;
522
- line-height:1.2;
523
- }
524
-
525
- .xfaLayer *{
526
- color:inherit;
527
- font:inherit;
528
- font-style:inherit;
529
- font-weight:inherit;
530
- font-kerning:inherit;
531
- letter-spacing:-0.01px;
532
- text-align:inherit;
533
- text-decoration:inherit;
534
- box-sizing:border-box;
535
- background-color:transparent;
536
- padding:0;
537
- margin:0;
538
- pointer-events:auto;
539
- line-height:inherit;
540
- }
541
-
542
- .xfaLayer *:required{
543
- outline:1.5px solid red;
544
- }
545
-
546
- .xfaLayer div,
547
- .xfaLayer svg,
548
- .xfaLayer svg *{
549
- pointer-events:none;
550
- }
551
-
552
- .xfaLayer a{
553
- color:blue;
554
- }
555
-
556
- .xfaRich li{
557
- margin-left:3em;
558
- }
559
-
560
- .xfaFont{
561
- color:black;
562
- font-weight:normal;
563
- font-kerning:none;
564
- font-size:10px;
565
- font-style:normal;
566
- letter-spacing:0;
567
- text-decoration:none;
568
- vertical-align:0;
569
- }
570
-
571
- .xfaCaption{
572
- overflow:hidden;
573
- flex:0 0 auto;
574
- }
575
-
576
- .xfaCaptionForCheckButton{
577
- overflow:hidden;
578
- flex:1 1 auto;
579
- }
580
-
581
- .xfaLabel{
582
- height:100%;
583
- width:100%;
584
- }
585
-
586
- .xfaLeft{
587
- display:flex;
588
- flex-direction:row;
589
- align-items:center;
590
- }
591
-
592
- .xfaRight{
593
- display:flex;
594
- flex-direction:row-reverse;
595
- align-items:center;
596
- }
597
-
598
- :is(.xfaLeft, .xfaRight) > :is(.xfaCaption, .xfaCaptionForCheckButton){
599
- max-height:100%;
600
- }
601
-
602
- .xfaTop{
603
- display:flex;
604
- flex-direction:column;
605
- align-items:flex-start;
606
- }
607
-
608
- .xfaBottom{
609
- display:flex;
610
- flex-direction:column-reverse;
611
- align-items:flex-start;
612
- }
613
-
614
- :is(.xfaTop, .xfaBottom) > :is(.xfaCaption, .xfaCaptionForCheckButton){
615
- width:100%;
616
- }
617
-
618
- .xfaBorder{
619
- background-color:transparent;
620
- position:absolute;
621
- pointer-events:none;
622
- }
623
-
624
- .xfaWrapped{
625
- width:100%;
626
- height:100%;
627
- }
628
-
629
- :is(.xfaTextfield, .xfaSelect):focus{
630
- background-image:none;
631
- background-color:transparent;
632
- outline:var(--xfa-focus-outline);
633
- outline-offset:-1px;
634
- }
635
-
636
- :is(.xfaCheckbox, .xfaRadio):focus{
637
- outline:var(--xfa-focus-outline);
638
- }
639
-
640
- .xfaTextfield,
641
- .xfaSelect{
642
- height:100%;
643
- width:100%;
644
- flex:1 1 auto;
645
- border:none;
646
- resize:none;
647
- background-image:var(--xfa-unfocused-field-background);
648
- }
649
-
650
- .xfaSelect{
651
- padding-inline:2px;
652
- }
653
-
654
- :is(.xfaTop, .xfaBottom) > :is(.xfaTextfield, .xfaSelect){
655
- flex:0 1 auto;
656
- }
657
-
658
- .xfaButton{
659
- cursor:pointer;
660
- width:100%;
661
- height:100%;
662
- border:none;
663
- text-align:center;
664
- }
665
-
666
- .xfaLink{
667
- width:100%;
668
- height:100%;
669
- position:absolute;
670
- top:0;
671
- left:0;
672
- }
673
-
674
- .xfaCheckbox,
675
- .xfaRadio{
676
- width:100%;
677
- height:100%;
678
- flex:0 0 auto;
679
- border:none;
680
- }
681
-
682
- .xfaRich{
683
- white-space:pre-wrap;
684
- width:100%;
685
- height:100%;
686
- }
687
-
688
- .xfaImage{
689
- -o-object-position:left top;
690
- object-position:left top;
691
- -o-object-fit:contain;
692
- object-fit:contain;
693
- width:100%;
694
- height:100%;
695
- }
696
-
697
- .xfaLrTb,
698
- .xfaRlTb,
699
- .xfaTb{
700
- display:flex;
701
- flex-direction:column;
702
- align-items:stretch;
703
- }
704
-
705
- .xfaLr{
706
- display:flex;
707
- flex-direction:row;
708
- align-items:stretch;
709
- }
710
-
711
- .xfaRl{
712
- display:flex;
713
- flex-direction:row-reverse;
714
- align-items:stretch;
715
- }
716
-
717
- .xfaTb > div{
718
- justify-content:left;
719
- }
720
-
721
- .xfaPosition{
722
- position:relative;
723
- }
724
-
725
- .xfaArea{
726
- position:relative;
727
- }
728
-
729
- .xfaValignMiddle{
730
- display:flex;
731
- align-items:center;
732
- }
733
-
734
- .xfaTable{
735
- display:flex;
736
- flex-direction:column;
737
- align-items:stretch;
738
- }
739
-
740
- .xfaTable .xfaRow{
741
- display:flex;
742
- flex-direction:row;
743
- align-items:stretch;
744
- }
745
-
746
- .xfaTable .xfaRlRow{
747
- display:flex;
748
- flex-direction:row-reverse;
749
- align-items:stretch;
750
- flex:1;
751
- }
752
-
753
- .xfaTable .xfaRlRow > div{
754
- flex:1;
755
- }
756
-
757
- :is(.xfaNonInteractive, .xfaDisabled, .xfaReadOnly) :is(input, textarea){
758
- background:initial;
759
- }
760
-
761
- @media print{
762
- .xfaTextfield,
763
- .xfaSelect{
764
- background:transparent;
765
- }
766
-
767
- .xfaSelect{
768
- -webkit-appearance:none;
769
- -moz-appearance:none;
770
- appearance:none;
771
- text-indent:1px;
772
- text-overflow:"";
773
- }
774
- }
775
-
776
- :root{
777
- --outline-width:2px;
778
- --outline-color:#0060df;
779
- --outline-around-width:1px;
780
- --outline-around-color:#f0f0f4;
781
- --hover-outline-around-color:var(--outline-around-color);
782
- --focus-outline:solid var(--outline-width) var(--outline-color);
783
- --unfocus-outline:solid var(--outline-width) transparent;
784
- --focus-outline-around:solid var(--outline-around-width) var(--outline-around-color);
785
- --hover-outline-color:#8f8f9d;
786
- --hover-outline:solid var(--outline-width) var(--hover-outline-color);
787
- --hover-outline-around:solid var(--outline-around-width) var(--hover-outline-around-color);
788
- --freetext-line-height:1.35;
789
- --freetext-padding:2px;
790
- --resizer-bg-color:var(--outline-color);
791
- --resizer-size:6px;
792
- --resizer-shift:calc(
793
- 0px - (var(--outline-width) + var(--resizer-size)) / 2 -
794
- var(--outline-around-width)
795
- );
796
- --editorFreeText-editing-cursor:text;
797
- --editorInk-editing-cursor:url(images/cursor-editorInk.svg) 0 16, pointer;
798
-
799
- --alt-text-opacity:0.8;
800
- --alt-text-add-image:url(images/altText_add.svg);
801
- --alt-text-done-image:url(images/altText_done.svg);
802
- --alt-text-bg-color:rgb(43 42 51 / var(--alt-text-opacity));
803
- --alt-text-fg-color:#fbfbfe;
804
- --alt-text-border-color:var(--alt-text-bg-color);
805
- --alt-text-hover-bg-color:rgb(82 82 94 / var(--alt-text-opacity));
806
- --alt-text-hover-fg-color:var(--alt-text-fg-color);
807
- --alt-text-hover-border-color:var(--alt-text-hover-bg-color);
808
- --alt-text-active-bg-color:rgb(91 91 102 / var(--alt-text-opacity));
809
- --alt-text-active-fg-color:var(--alt-text-fg-color);
810
- --alt-text-active-border-color:var(--alt-text-hover-bg-color);
811
- --alt-text-focus-outline-color:#0060df;
812
- --alt-text-focus-border-color:#f0f0f4;
813
- --alt-text-shadow:0 2px 6px 0 rgb(28 27 34 / 0.5);
814
- }
815
-
816
- @media (-webkit-min-device-pixel-ratio: 1.1), (min-resolution: 1.1dppx){
817
- :root{
818
- --editorFreeText-editing-cursor:url(images/cursor-editorFreeText.svg) 0 16, text;
819
- }
820
- }
821
-
822
- @media screen and (forced-colors: active){
823
- :root{
824
- --outline-color:CanvasText;
825
- --outline-around-color:ButtonFace;
826
- --resizer-bg-color:ButtonText;
827
- --hover-outline-color:Highlight;
828
- --hover-outline-around-color:SelectedItemText;
829
-
830
- --alt-text-bg-color:Canvas;
831
- --alt-text-fg-color:ButtonText;
832
- --alt-text-border-color:ButtonText;
833
- --alt-text-hover-bg-color:Canvas;
834
- --alt-text-hover-fg-color:SelectedItem;
835
- --alt-text-hover-border-color:SelectedItem;
836
- --alt-text-active-bg-color:ButtonFace;
837
- --alt-text-active-fg-color:SelectedItem;
838
- --alt-text-active-border-color:ButtonText;
839
- --alt-text-focus-outline-color:CanvasText;
840
- --alt-text-focus-border-color:ButtonText;
841
- --alt-text-shadow:none;
842
- --alt-text-opacity:1;
843
- }
844
- }
845
-
846
- [data-editor-rotation="90"]{
847
- transform:rotate(90deg);
848
- }
849
- [data-editor-rotation="180"]{
850
- transform:rotate(180deg);
851
- }
852
- [data-editor-rotation="270"]{
853
- transform:rotate(270deg);
854
- }
855
-
856
- .annotationEditorLayer{
857
- background:transparent;
858
- position:absolute;
859
- inset:0;
860
- font-size:calc(100px * var(--scale-factor));
861
- transform-origin:0 0;
862
- cursor:auto;
863
- z-index:4;
864
- }
865
-
866
- .annotationEditorLayer.waiting{
867
- content:"";
868
- cursor:wait;
869
- position:absolute;
870
- inset:0;
871
- width:100%;
872
- height:100%;
873
- }
874
-
875
- .annotationEditorLayer.disabled{
876
- pointer-events:none;
877
- }
878
-
879
- .annotationEditorLayer.freetextEditing{
880
- cursor:var(--editorFreeText-editing-cursor);
881
- }
882
-
883
- .annotationEditorLayer.inkEditing{
884
- cursor:var(--editorInk-editing-cursor);
885
- }
886
-
887
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor){
888
- position:absolute;
889
- background:transparent;
890
- z-index:1;
891
- transform-origin:0 0;
892
- cursor:auto;
893
- max-width:100%;
894
- max-height:100%;
895
- border:var(--unfocus-outline);
896
- }
897
-
898
- .annotationEditorLayer .draggable.selectedEditor:is(.freeTextEditor, .inkEditor, .stampEditor){
899
- cursor:move;
900
- }
901
-
902
- .annotationEditorLayer .selectedEditor:is(.freeTextEditor, .inkEditor, .stampEditor){
903
- border:var(--focus-outline);
904
- outline:var(--focus-outline-around);
905
- }
906
-
907
- .annotationEditorLayer .selectedEditor:is(.freeTextEditor, .inkEditor, .stampEditor)::before{
908
- content:"";
909
- position:absolute;
910
- inset:0;
911
- border:var(--focus-outline-around);
912
- pointer-events:none;
913
- }
914
-
915
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor):hover:not(.selectedEditor){
916
- border:var(--hover-outline);
917
- outline:var(--hover-outline-around);
918
- }
919
-
920
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor):hover:not(.selectedEditor)::before{
921
- content:"";
922
- position:absolute;
923
- inset:0;
924
- border:var(--focus-outline-around);
925
- }
926
-
927
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) .editToolbar{
928
- --editor-toolbar-delete-image:url(images/editor-toolbar-delete.svg);
929
- --editor-toolbar-bg-color:#f0f0f4;
930
- --editor-toolbar-fg-color:#2e2e56;
931
- --editor-toolbar-border-color:#8f8f9d;
932
- --editor-toolbar-hover-bg-color:#e0e0e6;
933
- --editor-toolbar-active-bg-color:#cfcfd8;
934
- --editor-toolbar-focus-outline-color:#0060df;
935
- --editor-toolbar-shadow:0 2px 6px 0 rgb(58 57 68 / 0.2);
936
-
937
- display:flex;
938
- width:-moz-fit-content;
939
- width:fit-content;
940
- height:28px;
941
- flex-direction:column;
942
- justify-content:center;
943
- align-items:center;
944
- cursor:default;
945
-
946
- position:absolute;
947
- inset-inline-end:0;
948
- inset-block-start:calc(100% + 6px);
949
-
950
- border-radius:4px;
951
- background-color:var(--editor-toolbar-bg-color);
952
- border:1px solid var(--editor-toolbar-border-color);
953
- box-shadow:var(--editor-toolbar-shadow);
954
- }
955
-
956
- @media (prefers-color-scheme: dark){
957
-
958
- :where(html:not(.is-light)) .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) .editToolbar{
959
- --editor-toolbar-bg-color:#2b2a33;
960
- --editor-toolbar-fg-color:#fbfbfe;
961
- --editor-toolbar-border-color:#2b2a33;
962
- --editor-toolbar-hover-bg-color:#52525e;
963
- --editor-toolbar-active-bg-color:#5b5b66;
964
- --editor-toolbar-focus-outline-color:#0df;
965
- }
966
- }
967
-
968
- :where(html.is-dark) .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) .editToolbar{
969
- --editor-toolbar-bg-color:#2b2a33;
970
- --editor-toolbar-fg-color:#fbfbfe;
971
- --editor-toolbar-border-color:#2b2a33;
972
- --editor-toolbar-hover-bg-color:#52525e;
973
- --editor-toolbar-active-bg-color:#5b5b66;
974
- --editor-toolbar-focus-outline-color:#0df;
975
- }
976
-
977
- @media screen and (forced-colors: active){
978
-
979
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) .editToolbar{
980
- --editor-toolbar-bg-color:ButtonFace;
981
- --editor-toolbar-fg-color:ButtonText;
982
- --editor-toolbar-border-color:ButtonText;
983
- --editor-toolbar-hover-bg-color:AccentColor;
984
- --editor-toolbar-active-bg-color:ButtonFace;
985
- --editor-toolbar-focus-outline-color:ButtonBorder;
986
- --editor-toolbar-shadow:none;
987
- }
988
- }
989
-
990
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) .editToolbar.hidden{
991
- display:none;
992
- }
993
-
994
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) .editToolbar:has(:focus-visible){
995
- border-color:transparent;
996
- }
997
-
998
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) .editToolbar .buttons{
999
- display:flex;
1000
- padding:0 2px;
1001
- justify-content:center;
1002
- align-items:center;
1003
- gap:4px;
1004
- }
1005
-
1006
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) .editToolbar .buttons .delete{
1007
- width:24px;
1008
- height:24px;
1009
- cursor:pointer;
1010
- border:none;
1011
- background-color:transparent;
1012
- }
1013
-
1014
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) .editToolbar .buttons .delete::before{
1015
- content:"";
1016
- -webkit-mask-image:var(--editor-toolbar-delete-image);
1017
- mask-image:var(--editor-toolbar-delete-image);
1018
- -webkit-mask-repeat:no-repeat;
1019
- mask-repeat:no-repeat;
1020
- -webkit-mask-position:center;
1021
- mask-position:center;
1022
- display:inline-block;
1023
- background-color:var(--editor-toolbar-fg-color);
1024
- width:100%;
1025
- height:100%;
1026
- }
1027
-
1028
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) .editToolbar .buttons > *:hover{
1029
- border-radius:2px;
1030
- background-color:var(--editor-toolbar-hover-bg-color);
1031
- }
1032
-
1033
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) .editToolbar .buttons > *:active{
1034
- border-radius:2px;
1035
- background-color:var(--editor-toolbar-active-bg-color);
1036
- }
1037
-
1038
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) .editToolbar .buttons > *:focus-visible{
1039
- border-radius:3px;
1040
- outline:2px solid var(--editor-toolbar-focus-outline-color);
1041
- }
1042
-
1043
- .annotationEditorLayer .freeTextEditor{
1044
- padding:calc(var(--freetext-padding) * var(--scale-factor));
1045
- width:auto;
1046
- height:auto;
1047
- touch-action:none;
1048
- }
1049
-
1050
- .annotationEditorLayer .freeTextEditor .internal{
1051
- background:transparent;
1052
- border:none;
1053
- inset:0;
1054
- overflow:visible;
1055
- white-space:nowrap;
1056
- font:10px sans-serif;
1057
- line-height:var(--freetext-line-height);
1058
- -webkit-user-select:none;
1059
- -moz-user-select:none;
1060
- user-select:none;
1061
- }
1062
-
1063
- .annotationEditorLayer .freeTextEditor .overlay{
1064
- position:absolute;
1065
- display:none;
1066
- background:transparent;
1067
- inset:0;
1068
- width:100%;
1069
- height:100%;
1070
- }
1071
-
1072
- .annotationEditorLayer .freeTextEditor .overlay.enabled{
1073
- display:block;
1074
- }
1075
-
1076
- .annotationEditorLayer .freeTextEditor .internal:empty::before{
1077
- content:attr(default-content);
1078
- color:gray;
1079
- }
1080
-
1081
- .annotationEditorLayer .freeTextEditor .internal:focus{
1082
- outline:none;
1083
- -webkit-user-select:auto;
1084
- -moz-user-select:auto;
1085
- user-select:auto;
1086
- }
1087
-
1088
- .annotationEditorLayer .inkEditor{
1089
- width:100%;
1090
- height:100%;
1091
- }
1092
-
1093
- .annotationEditorLayer .inkEditor.editing{
1094
- cursor:inherit;
1095
- }
1096
-
1097
- .annotationEditorLayer .inkEditor .inkEditorCanvas{
1098
- position:absolute;
1099
- inset:0;
1100
- width:100%;
1101
- height:100%;
1102
- touch-action:none;
1103
- }
1104
-
1105
- .annotationEditorLayer .stampEditor{
1106
- width:auto;
1107
- height:auto;
1108
- }
1109
-
1110
- .annotationEditorLayer .stampEditor canvas{
1111
- width:100%;
1112
- height:100%;
1113
- }
1114
-
1115
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) > .resizers{
1116
- position:absolute;
1117
- inset:0;
1118
- }
1119
-
1120
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) > .resizers.hidden{
1121
- display:none;
1122
- }
1123
-
1124
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) > .resizers > .resizer{
1125
- width:var(--resizer-size);
1126
- height:var(--resizer-size);
1127
- background:content-box var(--resizer-bg-color);
1128
- border:var(--focus-outline-around);
1129
- border-radius:2px;
1130
- position:absolute;
1131
- }
1132
-
1133
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) > .resizers > .resizer.topLeft{
1134
- top:var(--resizer-shift);
1135
- left:var(--resizer-shift);
1136
- }
1137
-
1138
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) > .resizers > .resizer.topMiddle{
1139
- top:var(--resizer-shift);
1140
- left:calc(50% + var(--resizer-shift));
1141
- }
1142
-
1143
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) > .resizers > .resizer.topRight{
1144
- top:var(--resizer-shift);
1145
- right:var(--resizer-shift);
1146
- }
1147
-
1148
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) > .resizers > .resizer.middleRight{
1149
- top:calc(50% + var(--resizer-shift));
1150
- right:var(--resizer-shift);
1151
- }
1152
-
1153
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) > .resizers > .resizer.bottomRight{
1154
- bottom:var(--resizer-shift);
1155
- right:var(--resizer-shift);
1156
- }
1157
-
1158
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) > .resizers > .resizer.bottomMiddle{
1159
- bottom:var(--resizer-shift);
1160
- left:calc(50% + var(--resizer-shift));
1161
- }
1162
-
1163
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) > .resizers > .resizer.bottomLeft{
1164
- bottom:var(--resizer-shift);
1165
- left:var(--resizer-shift);
1166
- }
1167
-
1168
- .annotationEditorLayer :is(.freeTextEditor, .inkEditor, .stampEditor) > .resizers > .resizer.middleLeft{
1169
- top:calc(50% + var(--resizer-shift));
1170
- left:var(--resizer-shift);
1171
- }
1172
-
1173
- .annotationEditorLayer[data-main-rotation="0"]
1174
- :is([data-editor-rotation="0"], [data-editor-rotation="180"]) > .resizers > .resizer.topLeft,
1175
- .annotationEditorLayer[data-main-rotation="90"]
1176
- :is([data-editor-rotation="270"], [data-editor-rotation="90"]) > .resizers > .resizer.topLeft,
1177
- .annotationEditorLayer[data-main-rotation="180"]
1178
- :is([data-editor-rotation="180"], [data-editor-rotation="0"]) > .resizers > .resizer.topLeft,
1179
- .annotationEditorLayer[data-main-rotation="270"]
1180
- :is([data-editor-rotation="90"], [data-editor-rotation="270"]) > .resizers > .resizer.topLeft,
1181
- .annotationEditorLayer[data-main-rotation="0"]
1182
- :is([data-editor-rotation="0"], [data-editor-rotation="180"]) > .resizers > .resizer.bottomRight,
1183
- .annotationEditorLayer[data-main-rotation="90"]
1184
- :is([data-editor-rotation="270"], [data-editor-rotation="90"]) > .resizers > .resizer.bottomRight,
1185
- .annotationEditorLayer[data-main-rotation="180"]
1186
- :is([data-editor-rotation="180"], [data-editor-rotation="0"]) > .resizers > .resizer.bottomRight,
1187
- .annotationEditorLayer[data-main-rotation="270"]
1188
- :is([data-editor-rotation="90"], [data-editor-rotation="270"]) > .resizers > .resizer.bottomRight{
1189
- cursor:nwse-resize;
1190
- }
1191
-
1192
- .annotationEditorLayer[data-main-rotation="0"]
1193
- :is([data-editor-rotation="0"], [data-editor-rotation="180"]) > .resizers > .resizer.topMiddle,
1194
- .annotationEditorLayer[data-main-rotation="90"]
1195
- :is([data-editor-rotation="270"], [data-editor-rotation="90"]) > .resizers > .resizer.topMiddle,
1196
- .annotationEditorLayer[data-main-rotation="180"]
1197
- :is([data-editor-rotation="180"], [data-editor-rotation="0"]) > .resizers > .resizer.topMiddle,
1198
- .annotationEditorLayer[data-main-rotation="270"]
1199
- :is([data-editor-rotation="90"], [data-editor-rotation="270"]) > .resizers > .resizer.topMiddle,
1200
- .annotationEditorLayer[data-main-rotation="0"]
1201
- :is([data-editor-rotation="0"], [data-editor-rotation="180"]) > .resizers > .resizer.bottomMiddle,
1202
- .annotationEditorLayer[data-main-rotation="90"]
1203
- :is([data-editor-rotation="270"], [data-editor-rotation="90"]) > .resizers > .resizer.bottomMiddle,
1204
- .annotationEditorLayer[data-main-rotation="180"]
1205
- :is([data-editor-rotation="180"], [data-editor-rotation="0"]) > .resizers > .resizer.bottomMiddle,
1206
- .annotationEditorLayer[data-main-rotation="270"]
1207
- :is([data-editor-rotation="90"], [data-editor-rotation="270"]) > .resizers > .resizer.bottomMiddle{
1208
- cursor:ns-resize;
1209
- }
1210
-
1211
- .annotationEditorLayer[data-main-rotation="0"]
1212
- :is([data-editor-rotation="0"], [data-editor-rotation="180"]) > .resizers > .resizer.topRight,
1213
- .annotationEditorLayer[data-main-rotation="90"]
1214
- :is([data-editor-rotation="270"], [data-editor-rotation="90"]) > .resizers > .resizer.topRight,
1215
- .annotationEditorLayer[data-main-rotation="180"]
1216
- :is([data-editor-rotation="180"], [data-editor-rotation="0"]) > .resizers > .resizer.topRight,
1217
- .annotationEditorLayer[data-main-rotation="270"]
1218
- :is([data-editor-rotation="90"], [data-editor-rotation="270"]) > .resizers > .resizer.topRight,
1219
- .annotationEditorLayer[data-main-rotation="0"]
1220
- :is([data-editor-rotation="0"], [data-editor-rotation="180"]) > .resizers > .resizer.bottomLeft,
1221
- .annotationEditorLayer[data-main-rotation="90"]
1222
- :is([data-editor-rotation="270"], [data-editor-rotation="90"]) > .resizers > .resizer.bottomLeft,
1223
- .annotationEditorLayer[data-main-rotation="180"]
1224
- :is([data-editor-rotation="180"], [data-editor-rotation="0"]) > .resizers > .resizer.bottomLeft,
1225
- .annotationEditorLayer[data-main-rotation="270"]
1226
- :is([data-editor-rotation="90"], [data-editor-rotation="270"]) > .resizers > .resizer.bottomLeft{
1227
- cursor:nesw-resize;
1228
- }
1229
-
1230
- .annotationEditorLayer[data-main-rotation="0"]
1231
- :is([data-editor-rotation="0"], [data-editor-rotation="180"]) > .resizers > .resizer.middleRight,
1232
- .annotationEditorLayer[data-main-rotation="90"]
1233
- :is([data-editor-rotation="270"], [data-editor-rotation="90"]) > .resizers > .resizer.middleRight,
1234
- .annotationEditorLayer[data-main-rotation="180"]
1235
- :is([data-editor-rotation="180"], [data-editor-rotation="0"]) > .resizers > .resizer.middleRight,
1236
- .annotationEditorLayer[data-main-rotation="270"]
1237
- :is([data-editor-rotation="90"], [data-editor-rotation="270"]) > .resizers > .resizer.middleRight,
1238
- .annotationEditorLayer[data-main-rotation="0"]
1239
- :is([data-editor-rotation="0"], [data-editor-rotation="180"]) > .resizers > .resizer.middleLeft,
1240
- .annotationEditorLayer[data-main-rotation="90"]
1241
- :is([data-editor-rotation="270"], [data-editor-rotation="90"]) > .resizers > .resizer.middleLeft,
1242
- .annotationEditorLayer[data-main-rotation="180"]
1243
- :is([data-editor-rotation="180"], [data-editor-rotation="0"]) > .resizers > .resizer.middleLeft,
1244
- .annotationEditorLayer[data-main-rotation="270"]
1245
- :is([data-editor-rotation="90"], [data-editor-rotation="270"]) > .resizers > .resizer.middleLeft{
1246
- cursor:ew-resize;
1247
- }
1248
-
1249
- .annotationEditorLayer[data-main-rotation="0"]
1250
- :is([data-editor-rotation="90"], [data-editor-rotation="270"]) > .resizers > .resizer.topLeft,
1251
- .annotationEditorLayer[data-main-rotation="90"]
1252
- :is([data-editor-rotation="0"], [data-editor-rotation="180"]) > .resizers > .resizer.topLeft,
1253
- .annotationEditorLayer[data-main-rotation="180"]
1254
- :is([data-editor-rotation="270"], [data-editor-rotation="90"]) > .resizers > .resizer.topLeft,
1255
- .annotationEditorLayer[data-main-rotation="270"]
1256
- :is([data-editor-rotation="180"], [data-editor-rotation="0"]) > .resizers > .resizer.topLeft,
1257
- .annotationEditorLayer[data-main-rotation="0"]
1258
- :is([data-editor-rotation="90"], [data-editor-rotation="270"]) > .resizers > .resizer.bottomRight,
1259
- .annotationEditorLayer[data-main-rotation="90"]
1260
- :is([data-editor-rotation="0"], [data-editor-rotation="180"]) > .resizers > .resizer.bottomRight,
1261
- .annotationEditorLayer[data-main-rotation="180"]
1262
- :is([data-editor-rotation="270"], [data-editor-rotation="90"]) > .resizers > .resizer.bottomRight,
1263
- .annotationEditorLayer[data-main-rotation="270"]
1264
- :is([data-editor-rotation="180"], [data-editor-rotation="0"]) > .resizers > .resizer.bottomRight{
1265
- cursor:nesw-resize;
1266
- }
1267
-
1268
- .annotationEditorLayer[data-main-rotation="0"]
1269
- :is([data-editor-rotation="90"], [data-editor-rotation="270"]) > .resizers > .resizer.topMiddle,
1270
- .annotationEditorLayer[data-main-rotation="90"]
1271
- :is([data-editor-rotation="0"], [data-editor-rotation="180"]) > .resizers > .resizer.topMiddle,
1272
- .annotationEditorLayer[data-main-rotation="180"]
1273
- :is([data-editor-rotation="270"], [data-editor-rotation="90"]) > .resizers > .resizer.topMiddle,
1274
- .annotationEditorLayer[data-main-rotation="270"]
1275
- :is([data-editor-rotation="180"], [data-editor-rotation="0"]) > .resizers > .resizer.topMiddle,
1276
- .annotationEditorLayer[data-main-rotation="0"]
1277
- :is([data-editor-rotation="90"], [data-editor-rotation="270"]) > .resizers > .resizer.bottomMiddle,
1278
- .annotationEditorLayer[data-main-rotation="90"]
1279
- :is([data-editor-rotation="0"], [data-editor-rotation="180"]) > .resizers > .resizer.bottomMiddle,
1280
- .annotationEditorLayer[data-main-rotation="180"]
1281
- :is([data-editor-rotation="270"], [data-editor-rotation="90"]) > .resizers > .resizer.bottomMiddle,
1282
- .annotationEditorLayer[data-main-rotation="270"]
1283
- :is([data-editor-rotation="180"], [data-editor-rotation="0"]) > .resizers > .resizer.bottomMiddle{
1284
- cursor:ew-resize;
1285
- }
1286
-
1287
- .annotationEditorLayer[data-main-rotation="0"]
1288
- :is([data-editor-rotation="90"], [data-editor-rotation="270"]) > .resizers > .resizer.topRight,
1289
- .annotationEditorLayer[data-main-rotation="90"]
1290
- :is([data-editor-rotation="0"], [data-editor-rotation="180"]) > .resizers > .resizer.topRight,
1291
- .annotationEditorLayer[data-main-rotation="180"]
1292
- :is([data-editor-rotation="270"], [data-editor-rotation="90"]) > .resizers > .resizer.topRight,
1293
- .annotationEditorLayer[data-main-rotation="270"]
1294
- :is([data-editor-rotation="180"], [data-editor-rotation="0"]) > .resizers > .resizer.topRight,
1295
- .annotationEditorLayer[data-main-rotation="0"]
1296
- :is([data-editor-rotation="90"], [data-editor-rotation="270"]) > .resizers > .resizer.bottomLeft,
1297
- .annotationEditorLayer[data-main-rotation="90"]
1298
- :is([data-editor-rotation="0"], [data-editor-rotation="180"]) > .resizers > .resizer.bottomLeft,
1299
- .annotationEditorLayer[data-main-rotation="180"]
1300
- :is([data-editor-rotation="270"], [data-editor-rotation="90"]) > .resizers > .resizer.bottomLeft,
1301
- .annotationEditorLayer[data-main-rotation="270"]
1302
- :is([data-editor-rotation="180"], [data-editor-rotation="0"]) > .resizers > .resizer.bottomLeft{
1303
- cursor:nwse-resize;
1304
- }
1305
-
1306
- .annotationEditorLayer[data-main-rotation="0"]
1307
- :is([data-editor-rotation="90"], [data-editor-rotation="270"]) > .resizers > .resizer.middleRight,
1308
- .annotationEditorLayer[data-main-rotation="90"]
1309
- :is([data-editor-rotation="0"], [data-editor-rotation="180"]) > .resizers > .resizer.middleRight,
1310
- .annotationEditorLayer[data-main-rotation="180"]
1311
- :is([data-editor-rotation="270"], [data-editor-rotation="90"]) > .resizers > .resizer.middleRight,
1312
- .annotationEditorLayer[data-main-rotation="270"]
1313
- :is([data-editor-rotation="180"], [data-editor-rotation="0"]) > .resizers > .resizer.middleRight,
1314
- .annotationEditorLayer[data-main-rotation="0"]
1315
- :is([data-editor-rotation="90"], [data-editor-rotation="270"]) > .resizers > .resizer.middleLeft,
1316
- .annotationEditorLayer[data-main-rotation="90"]
1317
- :is([data-editor-rotation="0"], [data-editor-rotation="180"]) > .resizers > .resizer.middleLeft,
1318
- .annotationEditorLayer[data-main-rotation="180"]
1319
- :is([data-editor-rotation="270"], [data-editor-rotation="90"]) > .resizers > .resizer.middleLeft,
1320
- .annotationEditorLayer[data-main-rotation="270"]
1321
- :is([data-editor-rotation="180"], [data-editor-rotation="0"]) > .resizers > .resizer.middleLeft{
1322
- cursor:ns-resize;
1323
- }
1324
-
1325
- .annotationEditorLayer
1326
- :is(
1327
- [data-main-rotation="0"] [data-editor-rotation="90"],
1328
- [data-main-rotation="90"] [data-editor-rotation="0"],
1329
- [data-main-rotation="180"] [data-editor-rotation="270"],
1330
- [data-main-rotation="270"] [data-editor-rotation="180"]
1331
- ) .altText{
1332
- rotate:270deg;
1333
- }
1334
-
1335
- [dir="ltr"] .annotationEditorLayer
1336
- :is(
1337
- [data-main-rotation="0"] [data-editor-rotation="90"],
1338
- [data-main-rotation="90"] [data-editor-rotation="0"],
1339
- [data-main-rotation="180"] [data-editor-rotation="270"],
1340
- [data-main-rotation="270"] [data-editor-rotation="180"]
1341
- ) .altText{
1342
- inset-inline-start:calc(100% - 8px);
1343
- }
1344
-
1345
- [dir="ltr"] .annotationEditorLayer
1346
- :is(
1347
- [data-main-rotation="0"] [data-editor-rotation="90"],
1348
- [data-main-rotation="90"] [data-editor-rotation="0"],
1349
- [data-main-rotation="180"] [data-editor-rotation="270"],
1350
- [data-main-rotation="270"] [data-editor-rotation="180"]
1351
- ) .altText.small{
1352
- inset-inline-start:calc(100% + 8px);
1353
- inset-block-start:100%;
1354
- }
1355
-
1356
- [dir="rtl"] .annotationEditorLayer
1357
- :is(
1358
- [data-main-rotation="0"] [data-editor-rotation="90"],
1359
- [data-main-rotation="90"] [data-editor-rotation="0"],
1360
- [data-main-rotation="180"] [data-editor-rotation="270"],
1361
- [data-main-rotation="270"] [data-editor-rotation="180"]
1362
- ) .altText{
1363
- inset-block-end:calc(100% - 8px);
1364
- }
1365
-
1366
- [dir="rtl"] .annotationEditorLayer
1367
- :is(
1368
- [data-main-rotation="0"] [data-editor-rotation="90"],
1369
- [data-main-rotation="90"] [data-editor-rotation="0"],
1370
- [data-main-rotation="180"] [data-editor-rotation="270"],
1371
- [data-main-rotation="270"] [data-editor-rotation="180"]
1372
- ) .altText.small{
1373
- inset-inline-start:-8px;
1374
- inset-block-start:0;
1375
- }
1376
-
1377
- .annotationEditorLayer
1378
- :is(
1379
- [data-main-rotation="0"] [data-editor-rotation="90"],
1380
- [data-main-rotation="90"] [data-editor-rotation="0"],
1381
- [data-main-rotation="180"] [data-editor-rotation="270"],
1382
- [data-main-rotation="270"] [data-editor-rotation="180"]
1383
- ) .editToolbar{
1384
- rotate:270deg;
1385
- }
1386
-
1387
- [dir="ltr"] .annotationEditorLayer
1388
- :is(
1389
- [data-main-rotation="0"] [data-editor-rotation="90"],
1390
- [data-main-rotation="90"] [data-editor-rotation="0"],
1391
- [data-main-rotation="180"] [data-editor-rotation="270"],
1392
- [data-main-rotation="270"] [data-editor-rotation="180"]
1393
- ) .editToolbar{
1394
- inset-inline-start:calc(100% + 6px);
1395
- inset-block-start:0;
1396
- }
1397
-
1398
- [dir="rtl"] .annotationEditorLayer
1399
- :is(
1400
- [data-main-rotation="0"] [data-editor-rotation="90"],
1401
- [data-main-rotation="90"] [data-editor-rotation="0"],
1402
- [data-main-rotation="180"] [data-editor-rotation="270"],
1403
- [data-main-rotation="270"] [data-editor-rotation="180"]
1404
- ) .editToolbar{
1405
- inset-inline-end:calc(100% + 6px);
1406
- inset-block-end:0;
1407
- inset-block-start:unset;
1408
- }
1409
-
1410
- .annotationEditorLayer
1411
- :is(
1412
- [data-main-rotation="0"] [data-editor-rotation="180"],
1413
- [data-main-rotation="90"] [data-editor-rotation="90"],
1414
- [data-main-rotation="180"] [data-editor-rotation="0"],
1415
- [data-main-rotation="270"] [data-editor-rotation="270"]
1416
- ) .altText{
1417
- rotate:180deg;
1418
-
1419
- inset-block-end:calc(100% - 8px);
1420
- inset-inline-start:calc(100% - 8px);
1421
- }
1422
-
1423
- .annotationEditorLayer
1424
- :is(
1425
- [data-main-rotation="0"] [data-editor-rotation="180"],
1426
- [data-main-rotation="90"] [data-editor-rotation="90"],
1427
- [data-main-rotation="180"] [data-editor-rotation="0"],
1428
- [data-main-rotation="270"] [data-editor-rotation="270"]
1429
- ) .altText.small{
1430
- inset-inline-start:100%;
1431
- inset-block-start:-8px;
1432
- }
1433
-
1434
- .annotationEditorLayer
1435
- :is(
1436
- [data-main-rotation="0"] [data-editor-rotation="180"],
1437
- [data-main-rotation="90"] [data-editor-rotation="90"],
1438
- [data-main-rotation="180"] [data-editor-rotation="0"],
1439
- [data-main-rotation="270"] [data-editor-rotation="270"]
1440
- ) .editToolbar{
1441
- rotate:180deg;
1442
- inset-inline-start:0;
1443
- inset-block-end:calc(100% + 6px);
1444
- inset-block-start:unset;
1445
- }
1446
-
1447
- .annotationEditorLayer
1448
- :is(
1449
- [data-main-rotation="0"] [data-editor-rotation="270"],
1450
- [data-main-rotation="90"] [data-editor-rotation="180"],
1451
- [data-main-rotation="180"] [data-editor-rotation="90"],
1452
- [data-main-rotation="270"] [data-editor-rotation="0"]
1453
- ) .altText{
1454
- rotate:90deg;
1455
- }
1456
-
1457
- [dir="ltr"] .annotationEditorLayer
1458
- :is(
1459
- [data-main-rotation="0"] [data-editor-rotation="270"],
1460
- [data-main-rotation="90"] [data-editor-rotation="180"],
1461
- [data-main-rotation="180"] [data-editor-rotation="90"],
1462
- [data-main-rotation="270"] [data-editor-rotation="0"]
1463
- ) .altText{
1464
- inset-block-end:calc(100% - 8px);
1465
- }
1466
-
1467
- [dir="ltr"] .annotationEditorLayer
1468
- :is(
1469
- [data-main-rotation="0"] [data-editor-rotation="270"],
1470
- [data-main-rotation="90"] [data-editor-rotation="180"],
1471
- [data-main-rotation="180"] [data-editor-rotation="90"],
1472
- [data-main-rotation="270"] [data-editor-rotation="0"]
1473
- ) .altText.small{
1474
- inset-inline-start:-8px;
1475
- inset-block-start:0;
1476
- }
1477
-
1478
- [dir="rtl"] .annotationEditorLayer
1479
- :is(
1480
- [data-main-rotation="0"] [data-editor-rotation="270"],
1481
- [data-main-rotation="90"] [data-editor-rotation="180"],
1482
- [data-main-rotation="180"] [data-editor-rotation="90"],
1483
- [data-main-rotation="270"] [data-editor-rotation="0"]
1484
- ) .altText{
1485
- inset-inline-start:calc(100% - 8px);
1486
- }
1487
-
1488
- [dir="rtl"] .annotationEditorLayer
1489
- :is(
1490
- [data-main-rotation="0"] [data-editor-rotation="270"],
1491
- [data-main-rotation="90"] [data-editor-rotation="180"],
1492
- [data-main-rotation="180"] [data-editor-rotation="90"],
1493
- [data-main-rotation="270"] [data-editor-rotation="0"]
1494
- ) .altText.small{
1495
- inset-inline-start:calc(100% + 8px);
1496
- inset-block-start:100%;
1497
- }
1498
-
1499
- .annotationEditorLayer
1500
- :is(
1501
- [data-main-rotation="0"] [data-editor-rotation="270"],
1502
- [data-main-rotation="90"] [data-editor-rotation="180"],
1503
- [data-main-rotation="180"] [data-editor-rotation="90"],
1504
- [data-main-rotation="270"] [data-editor-rotation="0"]
1505
- ) .editToolbar{
1506
- rotate:90deg;
1507
- }
1508
-
1509
- [dir="ltr"] .annotationEditorLayer
1510
- :is(
1511
- [data-main-rotation="0"] [data-editor-rotation="270"],
1512
- [data-main-rotation="90"] [data-editor-rotation="180"],
1513
- [data-main-rotation="180"] [data-editor-rotation="90"],
1514
- [data-main-rotation="270"] [data-editor-rotation="0"]
1515
- ) .editToolbar{
1516
- inset-inline-end:calc(100% + 6px);
1517
- inset-block-end:0;
1518
- inset-block-start:unset;
1519
- }
1520
-
1521
- [dir="rtl"] .annotationEditorLayer
1522
- :is(
1523
- [data-main-rotation="0"] [data-editor-rotation="270"],
1524
- [data-main-rotation="90"] [data-editor-rotation="180"],
1525
- [data-main-rotation="180"] [data-editor-rotation="90"],
1526
- [data-main-rotation="270"] [data-editor-rotation="0"]
1527
- ) .editToolbar{
1528
- inset-inline-start:calc(100% + 6px);
1529
- inset-block-start:0;
1530
- }
1531
-
1532
- .altText{
1533
- display:flex;
1534
- align-items:center;
1535
- justify-content:center;
1536
- padding-inline:4px;
1537
- width:-moz-max-content;
1538
- width:max-content;
1539
- height:24px;
1540
- min-width:88px;
1541
- z-index:1;
1542
- pointer-events:all;
1543
-
1544
- color:var(--alt-text-fg-color);
1545
- font:menu;
1546
- font-size:12px;
1547
- border-radius:4px;
1548
- border:1px solid var(--alt-text-border-color);
1549
- background-color:var(--alt-text-bg-color);
1550
- box-shadow:var(--alt-text-shadow);
1551
-
1552
- position:absolute;
1553
- inset-block-end:8px;
1554
- inset-inline-start:8px;
1555
- }
1556
-
1557
- .altText:disabled{
1558
- pointer-events:none;
1559
- }
1560
-
1561
- [dir="ltr"] .altText{
1562
- transform-origin:0 100%;
1563
- }
1564
-
1565
- [dir="rtl"] .altText{
1566
- transform-origin:100% 100%;
1567
- }
1568
-
1569
- .altText.small{
1570
-
1571
- inset-block-end:unset;
1572
- inset-inline-start:0;
1573
- inset-block-start:calc(100% + 8px);
1574
- }
1575
-
1576
- [dir="ltr"] .altText.small{
1577
- transform-origin:0 0;
1578
- }
1579
-
1580
- [dir="rtl"] .altText.small{
1581
- transform-origin:100% 0;
1582
- }
1583
-
1584
- .altText:hover{
1585
- background-color:var(--alt-text-hover-bg-color);
1586
- border-color:var(--alt-text-hover-border-color);
1587
- color:var(--alt-text-hover-fg-color);
1588
- cursor:pointer;
1589
- }
1590
-
1591
- .altText:hover::before{
1592
- background-color:var(--alt-text-hover-fg-color);
1593
- }
1594
-
1595
- .altText:active{
1596
- background-color:var(--alt-text-active-bg-color);
1597
- border-color:var(--alt-text-active-border-color);
1598
- color:var(--alt-text-active-fg-color);
1599
- }
1600
-
1601
- .altText:active::before{
1602
- background-color:var(--alt-text-active-fg-color);
1603
- }
1604
-
1605
- .altText:focus-visible{
1606
- outline:2px solid var(--alt-text-focus-outline-color);
1607
- border-color:var(--alt-text-focus-border-color);
1608
- }
1609
-
1610
- .altText::before{
1611
- content:"";
1612
- -webkit-mask-image:var(--alt-text-add-image);
1613
- mask-image:var(--alt-text-add-image);
1614
- -webkit-mask-repeat:no-repeat;
1615
- mask-repeat:no-repeat;
1616
- -webkit-mask-position:center;
1617
- mask-position:center;
1618
- display:inline-block;
1619
- width:12px;
1620
- height:13px;
1621
- background-color:var(--alt-text-fg-color);
1622
- margin-inline-end:4px;
1623
- }
1624
-
1625
- .altText.done::before{
1626
- -webkit-mask-image:var(--alt-text-done-image);
1627
- mask-image:var(--alt-text-done-image);
1628
- }
1629
-
1630
- .altText .tooltip{
1631
- display:none;
1632
- }
1633
-
1634
- .altText .tooltip.show{
1635
- --alt-text-tooltip-bg:#f0f0f4;
1636
- --alt-text-tooltip-fg:#15141a;
1637
- --alt-text-tooltip-border:#8f8f9d;
1638
- --alt-text-tooltip-shadow:0px 2px 6px 0px rgb(58 57 68 / 0.2);
1639
-
1640
- display:inline-flex;
1641
- flex-direction:column;
1642
- align-items:center;
1643
- justify-content:center;
1644
- position:absolute;
1645
- top:calc(100% + 2px);
1646
- inset-inline-start:0;
1647
- padding-block:2px 3px;
1648
- padding-inline:3px;
1649
- max-width:300px;
1650
- width:-moz-max-content;
1651
- width:max-content;
1652
- height:auto;
1653
- font-size:12px;
1654
-
1655
- border:0.5px solid var(--alt-text-tooltip-border);
1656
- background:var(--alt-text-tooltip-bg);
1657
- box-shadow:var(--alt-text-tooltip-shadow);
1658
- color:var(--alt-text-tooltip-fg);
1659
-
1660
- pointer-events:none;
1661
- }
1662
-
1663
- @media (prefers-color-scheme: dark){
1664
-
1665
- :where(html:not(.is-light)) .altText .tooltip.show{
1666
- --alt-text-tooltip-bg:#1c1b22;
1667
- --alt-text-tooltip-fg:#fbfbfe;
1668
- --alt-text-tooltip-shadow:0px 2px 6px 0px #15141a;
1669
- }
1670
- }
1671
-
1672
- :where(html.is-dark) .altText .tooltip.show{
1673
- --alt-text-tooltip-bg:#1c1b22;
1674
- --alt-text-tooltip-fg:#fbfbfe;
1675
- --alt-text-tooltip-shadow:0px 2px 6px 0px #15141a;
1676
- }
1677
-
1678
- @media screen and (forced-colors: active){
1679
-
1680
- .altText .tooltip.show{
1681
- --alt-text-tooltip-bg:Canvas;
1682
- --alt-text-tooltip-fg:CanvasText;
1683
- --alt-text-tooltip-border:CanvasText;
1684
- --alt-text-tooltip-shadow:none;
1685
- }
1686
- }
1687
-
1688
- #altTextDialog{
1689
- --dialog-bg-color:white;
1690
- --dialog-border-color:white;
1691
- --dialog-shadow:0 2px 14px 0 rgb(58 57 68 / 0.2);
1692
- --text-primary-color:#15141a;
1693
- --text-secondary-color:#5b5b66;
1694
- --hover-filter:brightness(0.9);
1695
- --focus-ring-color:#0060df;
1696
- --focus-ring-outline:2px solid var(--focus-ring-color);
1697
-
1698
- --textarea-border-color:#8f8f9d;
1699
- --textarea-bg-color:white;
1700
- --textarea-fg-color:var(--text-secondary-color);
1701
-
1702
- --radio-bg-color:#f0f0f4;
1703
- --radio-checked-bg-color:#fbfbfe;
1704
- --radio-border-color:#8f8f9d;
1705
- --radio-checked-border-color:#0060df;
1706
-
1707
- --button-cancel-bg-color:#f0f0f4;
1708
- --button-cancel-fg-color:var(--text-primary-color);
1709
- --button-cancel-border-color:var(--button-cancel-bg-color);
1710
- --button-cancel-hover-bg-color:var(--button-cancel-bg-color);
1711
- --button-cancel-hover-fg-color:var(--button-cancel-fg-color);
1712
- --button-cancel-hover-border-color:var(--button-cancel-hover-bg-color);
1713
-
1714
- --button-save-bg-color:#0060df;
1715
- --button-save-fg-color:#fbfbfe;
1716
- --button-save-hover-bg-color:var(--button-save-bg-color);
1717
- --button-save-hover-fg-color:var(--button-save-fg-color);
1718
- --button-save-hover-border-color:var(--button-save-hover-bg-color);
1719
-
1720
- font:message-box;
1721
- font-size:13px;
1722
- font-weight:400;
1723
- line-height:150%;
1724
- border-radius:4px;
1725
- padding:12px 16px;
1726
- border:1px solid var(--dialog-border-color);
1727
- background:var(--dialog-bg-color);
1728
- color:var(--text-primary-color);
1729
- box-shadow:var(--dialog-shadow);
1730
- }
1731
-
1732
- @media (prefers-color-scheme: dark){
1733
-
1734
- :where(html:not(.is-light)) #altTextDialog{
1735
- --dialog-bg-color:#1c1b22;
1736
- --dialog-border-color:#1c1b22;
1737
- --dialog-shadow:0 2px 14px 0 #15141a;
1738
- --text-primary-color:#fbfbfe;
1739
- --text-secondary-color:#cfcfd8;
1740
- --focus-ring-color:#0df;
1741
- --hover-filter:brightness(1.4);
1742
-
1743
- --textarea-bg-color:#42414d;
1744
-
1745
- --radio-bg-color:#2b2a33;
1746
- --radio-checked-bg-color:#15141a;
1747
- --radio-checked-border-color:#0df;
1748
-
1749
- --button-cancel-bg-color:#2b2a33;
1750
- --button-save-bg-color:#0df;
1751
- --button-save-fg-color:#15141a;
1752
- }
1753
- }
1754
-
1755
- :where(html.is-dark) #altTextDialog{
1756
- --dialog-bg-color:#1c1b22;
1757
- --dialog-border-color:#1c1b22;
1758
- --dialog-shadow:0 2px 14px 0 #15141a;
1759
- --text-primary-color:#fbfbfe;
1760
- --text-secondary-color:#cfcfd8;
1761
- --focus-ring-color:#0df;
1762
- --hover-filter:brightness(1.4);
1763
-
1764
- --textarea-bg-color:#42414d;
1765
-
1766
- --radio-bg-color:#2b2a33;
1767
- --radio-checked-bg-color:#15141a;
1768
- --radio-checked-border-color:#0df;
1769
-
1770
- --button-cancel-bg-color:#2b2a33;
1771
- --button-save-bg-color:#0df;
1772
- --button-save-fg-color:#15141a;
1773
- }
1774
-
1775
- @media screen and (forced-colors: active){
1776
-
1777
- #altTextDialog{
1778
- --dialog-bg-color:Canvas;
1779
- --dialog-border-color:CanvasText;
1780
- --dialog-shadow:none;
1781
- --text-primary-color:CanvasText;
1782
- --text-secondary-color:CanvasText;
1783
- --hover-filter:none;
1784
- --focus-ring-color:ButtonBorder;
1785
-
1786
- --textarea-border-color:ButtonBorder;
1787
- --textarea-bg-color:Field;
1788
- --textarea-fg-color:ButtonText;
1789
-
1790
- --radio-bg-color:ButtonFace;
1791
- --radio-checked-bg-color:ButtonFace;
1792
- --radio-border-color:ButtonText;
1793
- --radio-checked-border-color:ButtonText;
1794
-
1795
- --button-cancel-bg-color:ButtonFace;
1796
- --button-cancel-fg-color:ButtonText;
1797
- --button-cancel-border-color:ButtonText;
1798
- --button-cancel-hover-bg-color:AccentColor;
1799
- --button-cancel-hover-fg-color:AccentColorText;
1800
-
1801
- --button-save-bg-color:ButtonText;
1802
- --button-save-fg-color:ButtonFace;
1803
- --button-save-hover-bg-color:AccentColor;
1804
- --button-save-hover-fg-color:AccentColorText;
1805
- }
1806
- }
1807
-
1808
- #altTextDialog::backdrop{
1809
- -webkit-mask:url(#alttext-manager-mask);
1810
- mask:url(#alttext-manager-mask);
1811
- }
1812
-
1813
- #altTextDialog.positioned{
1814
- margin:0;
1815
- }
1816
-
1817
- #altTextDialog #altTextContainer{
1818
- width:300px;
1819
- height:-moz-fit-content;
1820
- height:fit-content;
1821
- display:inline-flex;
1822
- flex-direction:column;
1823
- align-items:flex-start;
1824
- gap:16px;
1825
- }
1826
-
1827
- #altTextDialog #altTextContainer *:focus-visible{
1828
- outline:var(--focus-ring-outline);
1829
- outline-offset:2px;
1830
- }
1831
-
1832
- #altTextDialog #altTextContainer .radio{
1833
- display:flex;
1834
- flex-direction:column;
1835
- align-items:flex-start;
1836
- gap:4px;
1837
- }
1838
-
1839
- #altTextDialog #altTextContainer .radio .radioButton{
1840
- display:flex;
1841
- gap:8px;
1842
- align-self:stretch;
1843
- align-items:center;
1844
- }
1845
-
1846
- #altTextDialog #altTextContainer .radio .radioButton input{
1847
- -webkit-appearance:none;
1848
- -moz-appearance:none;
1849
- appearance:none;
1850
- box-sizing:border-box;
1851
- width:16px;
1852
- height:16px;
1853
- border-radius:50%;
1854
- background-color:var(--radio-bg-color);
1855
- border:1px solid var(--radio-border-color);
1856
- }
1857
-
1858
- #altTextDialog #altTextContainer .radio .radioButton input:hover{
1859
- filter:var(--hover-filter);
1860
- }
1861
-
1862
- #altTextDialog #altTextContainer .radio .radioButton input:checked{
1863
- background-color:var(--radio-checked-bg-color);
1864
- border:4px solid var(--radio-checked-border-color);
1865
- }
1866
-
1867
- #altTextDialog #altTextContainer .radio .radioLabel{
1868
- display:flex;
1869
- padding-inline-start:24px;
1870
- align-items:flex-start;
1871
- gap:10px;
1872
- align-self:stretch;
1873
- }
1874
-
1875
- #altTextDialog #altTextContainer .radio .radioLabel span{
1876
- flex:1 0 0;
1877
- font-size:11px;
1878
- color:var(--text-secondary-color);
1879
- }
1880
-
1881
- #altTextDialog #altTextContainer #overallDescription{
1882
- display:flex;
1883
- flex-direction:column;
1884
- align-items:flex-start;
1885
- gap:4px;
1886
- align-self:stretch;
1887
- }
1888
-
1889
- #altTextDialog #altTextContainer #overallDescription span{
1890
- align-self:stretch;
1891
- }
1892
-
1893
- #altTextDialog #altTextContainer #overallDescription .title{
1894
- font-size:13px;
1895
- font-style:normal;
1896
- font-weight:590;
1897
- }
1898
-
1899
- #altTextDialog #altTextContainer #addDescription{
1900
- display:flex;
1901
- flex-direction:column;
1902
- align-items:stretch;
1903
- gap:8px;
1904
- }
1905
-
1906
- #altTextDialog #altTextContainer #addDescription .descriptionArea{
1907
- flex:1;
1908
- padding-inline:24px 10px;
1909
- }
1910
-
1911
- #altTextDialog #altTextContainer #addDescription .descriptionArea textarea{
1912
- font:inherit;
1913
- width:100%;
1914
- min-height:75px;
1915
- padding:8px;
1916
- resize:none;
1917
- margin:0;
1918
- box-sizing:border-box;
1919
- border-radius:4px;
1920
- border:1px solid var(--textarea-border-color);
1921
- background:var(--textarea-bg-color);
1922
- color:var(--textarea-fg-color);
1923
- }
1924
-
1925
- #altTextDialog #altTextContainer #addDescription .descriptionArea textarea:focus{
1926
- outline-offset:0;
1927
- border-color:transparent;
1928
- }
1929
-
1930
- #altTextDialog #altTextContainer #addDescription .descriptionArea textarea:disabled{
1931
- pointer-events:none;
1932
- opacity:0.4;
1933
- }
1934
-
1935
- #altTextDialog #altTextContainer #buttons{
1936
- display:flex;
1937
- justify-content:flex-end;
1938
- align-items:flex-start;
1939
- gap:8px;
1940
- align-self:stretch;
1941
- }
1942
-
1943
- #altTextDialog #altTextContainer #buttons button{
1944
- border-radius:4px;
1945
- border:1px solid;
1946
- font:menu;
1947
- font-weight:600;
1948
- padding:4px 16px;
1949
- width:auto;
1950
- height:32px;
1951
- }
1952
-
1953
- #altTextDialog #altTextContainer #buttons button:hover{
1954
- cursor:pointer;
1955
- filter:var(--hover-filter);
1956
- }
1957
-
1958
- #altTextDialog #altTextContainer #buttons button#altTextCancel{
1959
- color:var(--button-cancel-fg-color);
1960
- background-color:var(--button-cancel-bg-color);
1961
- border-color:var(--button-cancel-border-color);
1962
- }
1963
-
1964
- #altTextDialog #altTextContainer #buttons button#altTextCancel:hover{
1965
- color:var(--button-cancel-hover-fg-color);
1966
- background-color:var(--button-cancel-hover-bg-color);
1967
- border-color:var(--button-cancel-hover-border-color);
1968
- }
1969
-
1970
- #altTextDialog #altTextContainer #buttons button#altTextSave{
1971
- color:var(--button-save-hover-fg-color);
1972
- background-color:var(--button-save-hover-bg-color);
1973
- border-color:var(--button-save-hover-border-color);
1974
- opacity:1;
1975
- }
1976
-
1977
- #altTextDialog #altTextContainer #buttons button#altTextSave:hover{
1978
- color:var(--button-save-hover-fg-color);
1979
- background-color:var(--button-save-hover-bg-color);
1980
- border-color:var(--button-save-hover-border-color);
1981
- }
1982
-
1983
- :root{
1984
- --viewer-container-height:0;
1985
- --pdfViewer-padding-bottom:0;
1986
- --page-margin:1px auto -8px;
1987
- --page-border:9px solid transparent;
1988
- --spreadHorizontalWrapped-margin-LR:-3.5px;
1989
- --loading-icon-delay:400ms;
1990
- }
1991
-
1992
- @media screen and (forced-colors: active){
1993
- :root{
1994
- --pdfViewer-padding-bottom:9px;
1995
- --page-margin:8px auto -1px;
1996
- --page-border:1px solid CanvasText;
1997
- --spreadHorizontalWrapped-margin-LR:3.5px;
1998
- }
1999
- }
2000
-
2001
- [data-main-rotation="90"]{
2002
- transform:rotate(90deg) translateY(-100%);
2003
- }
2004
- [data-main-rotation="180"]{
2005
- transform:rotate(180deg) translate(-100%, -100%);
2006
- }
2007
- [data-main-rotation="270"]{
2008
- transform:rotate(270deg) translateX(-100%);
2009
- }
2010
-
2011
- #hiddenCopyElement{
2012
- position:absolute;
2013
- top:0;
2014
- left:0;
2015
- width:0;
2016
- height:0;
2017
- display:none;
2018
- }
2019
-
2020
- .pdfViewer{
2021
- --scale-factor:1;
2022
-
2023
- padding-bottom:var(--pdfViewer-padding-bottom);
2024
- }
2025
-
2026
- .pdfViewer .canvasWrapper{
2027
- overflow:hidden;
2028
- width:100%;
2029
- height:100%;
2030
- z-index:1;
2031
- }
2032
-
2033
- .pdfViewer .page{
2034
- direction:ltr;
2035
- width:816px;
2036
- height:1056px;
2037
- margin:var(--page-margin);
2038
- position:relative;
2039
- overflow:visible;
2040
- border:var(--page-border);
2041
- background-clip:content-box;
2042
- background-color:rgb(255 255 255);
2043
- }
2044
-
2045
- .pdfViewer .dummyPage{
2046
- position:relative;
2047
- width:0;
2048
- height:var(--viewer-container-height);
2049
- }
2050
-
2051
- .pdfViewer.noUserSelect{
2052
- -webkit-user-select:none;
2053
- -moz-user-select:none;
2054
- user-select:none;
2055
- }
2056
-
2057
- .pdfViewer.removePageBorders .page{
2058
- margin:0 auto 10px;
2059
- border:none;
2060
- }
2061
-
2062
- .pdfViewer:is(.scrollHorizontal, .scrollWrapped),
2063
- .spread{
2064
- margin-inline:3.5px;
2065
- text-align:center;
2066
- }
2067
-
2068
- .pdfViewer.scrollHorizontal,
2069
- .spread{
2070
- white-space:nowrap;
2071
- }
2072
-
2073
- .pdfViewer.removePageBorders,
2074
- .pdfViewer:is(.scrollHorizontal, .scrollWrapped) .spread{
2075
- margin-inline:0;
2076
- }
2077
-
2078
- .spread :is(.page, .dummyPage),
2079
- .pdfViewer:is(.scrollHorizontal, .scrollWrapped) :is(.page, .spread){
2080
- display:inline-block;
2081
- vertical-align:middle;
2082
- }
2083
-
2084
- .spread .page,
2085
- .pdfViewer:is(.scrollHorizontal, .scrollWrapped) .page{
2086
- margin-inline:var(--spreadHorizontalWrapped-margin-LR);
2087
- }
2088
-
2089
- .pdfViewer.removePageBorders .spread .page,
2090
- .pdfViewer.removePageBorders:is(.scrollHorizontal, .scrollWrapped) .page{
2091
- margin-inline:5px;
2092
- }
2093
-
2094
- .pdfViewer .page canvas{
2095
- margin:0;
2096
- display:block;
2097
- }
2098
-
2099
- .pdfViewer .page canvas .structTree{
2100
- contain:strict;
2101
- }
2102
-
2103
- .pdfViewer .page canvas[hidden]{
2104
- display:none;
2105
- }
2106
-
2107
- .pdfViewer .page canvas[zooming]{
2108
- width:100%;
2109
- height:100%;
2110
- }
2111
-
2112
- .pdfViewer .page.loadingIcon::after{
2113
- position:absolute;
2114
- top:0;
2115
- left:0;
2116
- content:"";
2117
- width:100%;
2118
- height:100%;
2119
- background:url("images/loading-icon.gif") center no-repeat;
2120
- display:none;
2121
- transition-property:display;
2122
- transition-delay:var(--loading-icon-delay);
2123
- z-index:5;
2124
- contain:strict;
2125
- }
2126
-
2127
- .pdfViewer .page.loading::after{
2128
- display:block;
2129
- }
2130
-
2131
- .pdfViewer .page:not(.loading)::after{
2132
- transition-property:none;
2133
- display:none;
2134
- }
2135
-
2136
- .pdfPresentationMode .pdfViewer{
2137
- padding-bottom:0;
2138
- }
2139
-
2140
- .pdfPresentationMode .spread{
2141
- margin:0;
2142
- }
2143
-
2144
- .pdfPresentationMode .pdfViewer .page{
2145
- margin:0 auto;
2146
- border:2px solid transparent;
2147
- }
2148
-
2149
- :root{
2150
- --dir-factor:1;
2151
- --inline-start:left;
2152
- --inline-end:right;
2153
-
2154
- --sidebar-width:200px;
2155
- --sidebar-transition-duration:200ms;
2156
- --sidebar-transition-timing-function:ease;
2157
-
2158
- --toolbar-icon-opacity:0.7;
2159
- --doorhanger-icon-opacity:0.9;
2160
- --editor-toolbar-base-offset:105px;
2161
-
2162
- --main-color:rgb(12 12 13);
2163
- --body-bg-color:rgb(212 212 215);
2164
- --progressBar-color:rgb(10 132 255);
2165
- --progressBar-bg-color:rgb(221 221 222);
2166
- --progressBar-blend-color:rgb(116 177 239);
2167
- --scrollbar-color:auto;
2168
- --scrollbar-bg-color:auto;
2169
- --toolbar-icon-bg-color:rgb(0 0 0);
2170
- --toolbar-icon-hover-bg-color:rgb(0 0 0);
2171
-
2172
- --sidebar-narrow-bg-color:rgb(212 212 215 / 0.9);
2173
- --sidebar-toolbar-bg-color:rgb(245 246 247);
2174
- --toolbar-bg-color:rgb(249 249 250);
2175
- --toolbar-border-color:rgb(184 184 184);
2176
- --toolbar-box-shadow:0 1px 0 var(--toolbar-border-color);
2177
- --toolbar-border-bottom:none;
2178
- --toolbarSidebar-box-shadow:inset calc(-1px * var(--dir-factor)) 0 0 rgb(0 0 0 / 0.25), 0 1px 0 rgb(0 0 0 / 0.15), 0 0 1px rgb(0 0 0 / 0.1);
2179
- --toolbarSidebar-border-bottom:none;
2180
- --button-hover-color:rgb(221 222 223);
2181
- --toggled-btn-color:rgb(0 0 0);
2182
- --toggled-btn-bg-color:rgb(0 0 0 / 0.3);
2183
- --toggled-hover-active-btn-color:rgb(0 0 0 / 0.4);
2184
- --toggled-hover-btn-outline:none;
2185
- --dropdown-btn-bg-color:rgb(215 215 219);
2186
- --dropdown-btn-border:none;
2187
- --separator-color:rgb(0 0 0 / 0.3);
2188
- --field-color:rgb(6 6 6);
2189
- --field-bg-color:rgb(255 255 255);
2190
- --field-border-color:rgb(187 187 188);
2191
- --treeitem-color:rgb(0 0 0 / 0.8);
2192
- --treeitem-bg-color:rgb(0 0 0 / 0.15);
2193
- --treeitem-hover-color:rgb(0 0 0 / 0.9);
2194
- --treeitem-selected-color:rgb(0 0 0 / 0.9);
2195
- --treeitem-selected-bg-color:rgb(0 0 0 / 0.25);
2196
- --thumbnail-hover-color:rgb(0 0 0 / 0.1);
2197
- --thumbnail-selected-color:rgb(0 0 0 / 0.2);
2198
- --doorhanger-bg-color:rgb(255 255 255);
2199
- --doorhanger-border-color:rgb(12 12 13 / 0.2);
2200
- --doorhanger-hover-color:rgb(12 12 13);
2201
- --doorhanger-hover-bg-color:rgb(237 237 237);
2202
- --doorhanger-separator-color:rgb(222 222 222);
2203
- --dialog-button-border:none;
2204
- --dialog-button-bg-color:rgb(12 12 13 / 0.1);
2205
- --dialog-button-hover-bg-color:rgb(12 12 13 / 0.3);
2206
-
2207
- --loading-icon:url(images/loading.svg);
2208
- --treeitem-expanded-icon:url(images/treeitem-expanded.svg);
2209
- --treeitem-collapsed-icon:url(images/treeitem-collapsed.svg);
2210
- --toolbarButton-editorFreeText-icon:url(images/toolbarButton-editorFreeText.svg);
2211
- --toolbarButton-editorInk-icon:url(images/toolbarButton-editorInk.svg);
2212
- --toolbarButton-editorStamp-icon:url(images/toolbarButton-editorStamp.svg);
2213
- --toolbarButton-menuArrow-icon:url(images/toolbarButton-menuArrow.svg);
2214
- --toolbarButton-sidebarToggle-icon:url(images/toolbarButton-sidebarToggle.svg);
2215
- --toolbarButton-secondaryToolbarToggle-icon:url(images/toolbarButton-secondaryToolbarToggle.svg);
2216
- --toolbarButton-pageUp-icon:url(images/toolbarButton-pageUp.svg);
2217
- --toolbarButton-pageDown-icon:url(images/toolbarButton-pageDown.svg);
2218
- --toolbarButton-zoomOut-icon:url(images/toolbarButton-zoomOut.svg);
2219
- --toolbarButton-zoomIn-icon:url(images/toolbarButton-zoomIn.svg);
2220
- --toolbarButton-presentationMode-icon:url(images/toolbarButton-presentationMode.svg);
2221
- --toolbarButton-print-icon:url(images/toolbarButton-print.svg);
2222
- --toolbarButton-openFile-icon:url(images/toolbarButton-openFile.svg);
2223
- --toolbarButton-download-icon:url(images/toolbarButton-download.svg);
2224
- --toolbarButton-bookmark-icon:url(images/toolbarButton-bookmark.svg);
2225
- --toolbarButton-viewThumbnail-icon:url(images/toolbarButton-viewThumbnail.svg);
2226
- --toolbarButton-viewOutline-icon:url(images/toolbarButton-viewOutline.svg);
2227
- --toolbarButton-viewAttachments-icon:url(images/toolbarButton-viewAttachments.svg);
2228
- --toolbarButton-viewLayers-icon:url(images/toolbarButton-viewLayers.svg);
2229
- --toolbarButton-currentOutlineItem-icon:url(images/toolbarButton-currentOutlineItem.svg);
2230
- --toolbarButton-search-icon:url(images/toolbarButton-search.svg);
2231
- --findbarButton-previous-icon:url(images/findbarButton-previous.svg);
2232
- --findbarButton-next-icon:url(images/findbarButton-next.svg);
2233
- --secondaryToolbarButton-firstPage-icon:url(images/secondaryToolbarButton-firstPage.svg);
2234
- --secondaryToolbarButton-lastPage-icon:url(images/secondaryToolbarButton-lastPage.svg);
2235
- --secondaryToolbarButton-rotateCcw-icon:url(images/secondaryToolbarButton-rotateCcw.svg);
2236
- --secondaryToolbarButton-rotateCw-icon:url(images/secondaryToolbarButton-rotateCw.svg);
2237
- --secondaryToolbarButton-selectTool-icon:url(images/secondaryToolbarButton-selectTool.svg);
2238
- --secondaryToolbarButton-handTool-icon:url(images/secondaryToolbarButton-handTool.svg);
2239
- --secondaryToolbarButton-scrollPage-icon:url(images/secondaryToolbarButton-scrollPage.svg);
2240
- --secondaryToolbarButton-scrollVertical-icon:url(images/secondaryToolbarButton-scrollVertical.svg);
2241
- --secondaryToolbarButton-scrollHorizontal-icon:url(images/secondaryToolbarButton-scrollHorizontal.svg);
2242
- --secondaryToolbarButton-scrollWrapped-icon:url(images/secondaryToolbarButton-scrollWrapped.svg);
2243
- --secondaryToolbarButton-spreadNone-icon:url(images/secondaryToolbarButton-spreadNone.svg);
2244
- --secondaryToolbarButton-spreadOdd-icon:url(images/secondaryToolbarButton-spreadOdd.svg);
2245
- --secondaryToolbarButton-spreadEven-icon:url(images/secondaryToolbarButton-spreadEven.svg);
2246
- --secondaryToolbarButton-documentProperties-icon:url(images/secondaryToolbarButton-documentProperties.svg);
2247
- --editorParams-stampAddImage-icon:url(images/toolbarButton-zoomIn.svg);
2248
- }
2249
-
2250
- [dir="rtl"]:root{
2251
- --dir-factor:-1;
2252
- --inline-start:right;
2253
- --inline-end:left;
2254
- }
2255
-
2256
- @media (prefers-color-scheme: dark){
2257
- :root:where(:not(.is-light)){
2258
- --main-color:rgb(249 249 250);
2259
- --body-bg-color:rgb(42 42 46);
2260
- --progressBar-color:rgb(0 96 223);
2261
- --progressBar-bg-color:rgb(40 40 43);
2262
- --progressBar-blend-color:rgb(20 68 133);
2263
- --scrollbar-color:rgb(121 121 123);
2264
- --scrollbar-bg-color:rgb(35 35 39);
2265
- --toolbar-icon-bg-color:rgb(255 255 255);
2266
- --toolbar-icon-hover-bg-color:rgb(255 255 255);
2267
-
2268
- --sidebar-narrow-bg-color:rgb(42 42 46 / 0.9);
2269
- --sidebar-toolbar-bg-color:rgb(50 50 52);
2270
- --toolbar-bg-color:rgb(56 56 61);
2271
- --toolbar-border-color:rgb(12 12 13);
2272
- --button-hover-color:rgb(102 102 103);
2273
- --toggled-btn-color:rgb(255 255 255);
2274
- --toggled-btn-bg-color:rgb(0 0 0 / 0.3);
2275
- --toggled-hover-active-btn-color:rgb(0 0 0 / 0.4);
2276
- --dropdown-btn-bg-color:rgb(74 74 79);
2277
- --separator-color:rgb(0 0 0 / 0.3);
2278
- --field-color:rgb(250 250 250);
2279
- --field-bg-color:rgb(64 64 68);
2280
- --field-border-color:rgb(115 115 115);
2281
- --treeitem-color:rgb(255 255 255 / 0.8);
2282
- --treeitem-bg-color:rgb(255 255 255 / 0.15);
2283
- --treeitem-hover-color:rgb(255 255 255 / 0.9);
2284
- --treeitem-selected-color:rgb(255 255 255 / 0.9);
2285
- --treeitem-selected-bg-color:rgb(255 255 255 / 0.25);
2286
- --thumbnail-hover-color:rgb(255 255 255 / 0.1);
2287
- --thumbnail-selected-color:rgb(255 255 255 / 0.2);
2288
- --doorhanger-bg-color:rgb(74 74 79);
2289
- --doorhanger-border-color:rgb(39 39 43);
2290
- --doorhanger-hover-color:rgb(249 249 250);
2291
- --doorhanger-hover-bg-color:rgb(93 94 98);
2292
- --doorhanger-separator-color:rgb(92 92 97);
2293
- --dialog-button-bg-color:rgb(92 92 97);
2294
- --dialog-button-hover-bg-color:rgb(115 115 115);
2295
- }
2296
- }
2297
-
2298
- :root:where(.is-dark){
2299
- --main-color:rgb(249 249 250);
2300
- --body-bg-color:rgb(42 42 46);
2301
- --progressBar-color:rgb(0 96 223);
2302
- --progressBar-bg-color:rgb(40 40 43);
2303
- --progressBar-blend-color:rgb(20 68 133);
2304
- --scrollbar-color:rgb(121 121 123);
2305
- --scrollbar-bg-color:rgb(35 35 39);
2306
- --toolbar-icon-bg-color:rgb(255 255 255);
2307
- --toolbar-icon-hover-bg-color:rgb(255 255 255);
2308
-
2309
- --sidebar-narrow-bg-color:rgb(42 42 46 / 0.9);
2310
- --sidebar-toolbar-bg-color:rgb(50 50 52);
2311
- --toolbar-bg-color:rgb(56 56 61);
2312
- --toolbar-border-color:rgb(12 12 13);
2313
- --button-hover-color:rgb(102 102 103);
2314
- --toggled-btn-color:rgb(255 255 255);
2315
- --toggled-btn-bg-color:rgb(0 0 0 / 0.3);
2316
- --toggled-hover-active-btn-color:rgb(0 0 0 / 0.4);
2317
- --dropdown-btn-bg-color:rgb(74 74 79);
2318
- --separator-color:rgb(0 0 0 / 0.3);
2319
- --field-color:rgb(250 250 250);
2320
- --field-bg-color:rgb(64 64 68);
2321
- --field-border-color:rgb(115 115 115);
2322
- --treeitem-color:rgb(255 255 255 / 0.8);
2323
- --treeitem-bg-color:rgb(255 255 255 / 0.15);
2324
- --treeitem-hover-color:rgb(255 255 255 / 0.9);
2325
- --treeitem-selected-color:rgb(255 255 255 / 0.9);
2326
- --treeitem-selected-bg-color:rgb(255 255 255 / 0.25);
2327
- --thumbnail-hover-color:rgb(255 255 255 / 0.1);
2328
- --thumbnail-selected-color:rgb(255 255 255 / 0.2);
2329
- --doorhanger-bg-color:rgb(74 74 79);
2330
- --doorhanger-border-color:rgb(39 39 43);
2331
- --doorhanger-hover-color:rgb(249 249 250);
2332
- --doorhanger-hover-bg-color:rgb(93 94 98);
2333
- --doorhanger-separator-color:rgb(92 92 97);
2334
- --dialog-button-bg-color:rgb(92 92 97);
2335
- --dialog-button-hover-bg-color:rgb(115 115 115);
2336
- }
2337
-
2338
- @media screen and (forced-colors: active){
2339
- :root{
2340
- --button-hover-color:Highlight;
2341
- --doorhanger-hover-bg-color:Highlight;
2342
- --toolbar-icon-opacity:1;
2343
- --toolbar-icon-bg-color:ButtonText;
2344
- --toolbar-icon-hover-bg-color:ButtonFace;
2345
- --toggled-hover-active-btn-color:ButtonText;
2346
- --toggled-hover-btn-outline:2px solid ButtonBorder;
2347
- --toolbar-border-color:CanvasText;
2348
- --toolbar-border-bottom:1px solid var(--toolbar-border-color);
2349
- --toolbar-box-shadow:none;
2350
- --toggled-btn-color:HighlightText;
2351
- --toggled-btn-bg-color:LinkText;
2352
- --doorhanger-hover-color:ButtonFace;
2353
- --doorhanger-border-color-whcm:1px solid ButtonText;
2354
- --doorhanger-triangle-opacity-whcm:0;
2355
- --dialog-button-border:1px solid Highlight;
2356
- --dialog-button-hover-bg-color:Highlight;
2357
- --dialog-button-hover-color:ButtonFace;
2358
- --dropdown-btn-border:1px solid ButtonText;
2359
- --field-border-color:ButtonText;
2360
- --main-color:CanvasText;
2361
- --separator-color:GrayText;
2362
- --doorhanger-separator-color:GrayText;
2363
- --toolbarSidebar-box-shadow:none;
2364
- --toolbarSidebar-border-bottom:1px solid var(--toolbar-border-color);
2365
- }
2366
- }
2367
-
2368
- @media screen and (prefers-reduced-motion: reduce){
2369
- :root{
2370
- --sidebar-transition-duration:0;
2371
- }
2372
- }
2373
-
2374
- *{
2375
- padding:0;
2376
- margin:0;
2377
- }
2378
-
2379
- html,
2380
- body{
2381
- height:100%;
2382
- width:100%;
2383
- }
2384
-
2385
- body{
2386
- background-color:var(--body-bg-color);
2387
- scrollbar-color:var(--scrollbar-color) var(--scrollbar-bg-color);
2388
- }
2389
-
2390
- .hidden,
2391
- [hidden]{
2392
- display:none !important;
2393
- }
2394
-
2395
- #viewerContainer.pdfPresentationMode:-webkit-full-screen{
2396
- top:0;
2397
- background-color:rgb(0 0 0);
2398
- width:100%;
2399
- height:100%;
2400
- overflow:hidden;
2401
- cursor:none;
2402
- -webkit-user-select:none;
2403
- user-select:none;
2404
- }
2405
-
2406
- #viewerContainer.pdfPresentationMode:fullscreen{
2407
- top:0;
2408
- background-color:rgb(0 0 0);
2409
- width:100%;
2410
- height:100%;
2411
- overflow:hidden;
2412
- cursor:none;
2413
- -webkit-user-select:none;
2414
- -moz-user-select:none;
2415
- user-select:none;
2416
- }
2417
-
2418
- .pdfPresentationMode:-webkit-full-screen section:not([data-internal-link]){
2419
- pointer-events:none;
2420
- }
2421
-
2422
- .pdfPresentationMode:fullscreen section:not([data-internal-link]){
2423
- pointer-events:none;
2424
- }
2425
-
2426
- .pdfPresentationMode:-webkit-full-screen .textLayer span{
2427
- cursor:none;
2428
- }
2429
-
2430
- .pdfPresentationMode:fullscreen .textLayer span{
2431
- cursor:none;
2432
- }
2433
-
2434
- .pdfPresentationMode.pdfPresentationModeControls > *,
2435
- .pdfPresentationMode.pdfPresentationModeControls .textLayer span{
2436
- cursor:default;
2437
- }
2438
-
2439
- #outerContainer{
2440
- width:100%;
2441
- height:100%;
2442
- position:relative;
2443
- }
2444
-
2445
- #sidebarContainer{
2446
- position:absolute;
2447
- inset-block:32px 0;
2448
- inset-inline-start:calc(-1 * var(--sidebar-width));
2449
- width:var(--sidebar-width);
2450
- visibility:hidden;
2451
- z-index:100;
2452
- font:message-box;
2453
- border-top:1px solid rgb(51 51 51);
2454
- border-inline-end:var(--doorhanger-border-color-whcm);
2455
- transition-property:inset-inline-start;
2456
- transition-duration:var(--sidebar-transition-duration);
2457
- transition-timing-function:var(--sidebar-transition-timing-function);
2458
- }
2459
-
2460
- #outerContainer:is(.sidebarMoving, .sidebarOpen) #sidebarContainer{
2461
- visibility:visible;
2462
- }
2463
- #outerContainer.sidebarOpen #sidebarContainer{
2464
- inset-inline-start:0;
2465
- }
2466
-
2467
- #mainContainer{
2468
- position:absolute;
2469
- inset:0;
2470
- min-width:350px;
2471
- }
2472
-
2473
- #sidebarContent{
2474
- inset-block:32px 0;
2475
- inset-inline-start:0;
2476
- overflow:auto;
2477
- position:absolute;
2478
- width:100%;
2479
- box-shadow:inset calc(-1px * var(--dir-factor)) 0 0 rgb(0 0 0 / 0.25);
2480
- }
2481
-
2482
- #viewerContainer{
2483
- overflow:auto;
2484
- position:absolute;
2485
- inset:32px 0 0;
2486
- outline:none;
2487
- }
2488
- #viewerContainer:not(.pdfPresentationMode){
2489
- transition-duration:var(--sidebar-transition-duration);
2490
- transition-timing-function:var(--sidebar-transition-timing-function);
2491
- }
2492
-
2493
- #outerContainer.sidebarOpen #viewerContainer:not(.pdfPresentationMode){
2494
- inset-inline-start:var(--sidebar-width);
2495
- transition-property:inset-inline-start;
2496
- }
2497
-
2498
- .toolbar{
2499
- position:relative;
2500
- inset-inline:0;
2501
- z-index:9999;
2502
- cursor:default;
2503
- font:message-box;
2504
- }
2505
-
2506
- :is(.toolbar, .editorParamsToolbar, .findbar, #sidebarContainer)
2507
- :is(input, button, select),
2508
- .secondaryToolbar :is(input, button, a, select){
2509
- outline:none;
2510
- font:message-box;
2511
- }
2512
-
2513
- #toolbarContainer{
2514
- width:100%;
2515
- }
2516
-
2517
- #toolbarSidebar{
2518
- width:100%;
2519
- height:32px;
2520
- background-color:var(--sidebar-toolbar-bg-color);
2521
- box-shadow:var(--toolbarSidebar-box-shadow);
2522
- border-bottom:var(--toolbarSidebar-border-bottom);
2523
- }
2524
-
2525
- #sidebarResizer{
2526
- position:absolute;
2527
- inset-block:0;
2528
- inset-inline-end:-6px;
2529
- width:6px;
2530
- z-index:200;
2531
- cursor:ew-resize;
2532
- }
2533
-
2534
- #toolbarContainer,
2535
- .findbar,
2536
- .secondaryToolbar,
2537
- .editorParamsToolbar{
2538
- position:relative;
2539
- height:32px;
2540
- background-color:var(--toolbar-bg-color);
2541
- box-shadow:var(--toolbar-box-shadow);
2542
- border-bottom:var(--toolbar-border-bottom);
2543
- }
2544
-
2545
- #toolbarViewer{
2546
- height:32px;
2547
- }
2548
-
2549
- #loadingBar{
2550
- --progressBar-percent:0%;
2551
- --progressBar-end-offset:0;
2552
-
2553
- position:absolute;
2554
- inset-inline:0 var(--progressBar-end-offset);
2555
- height:4px;
2556
- background-color:var(--progressBar-bg-color);
2557
- border-bottom:1px solid var(--toolbar-border-color);
2558
- transition-property:inset-inline-start;
2559
- transition-duration:var(--sidebar-transition-duration);
2560
- transition-timing-function:var(--sidebar-transition-timing-function);
2561
- }
2562
-
2563
- #outerContainer.sidebarOpen #loadingBar{
2564
- inset-inline-start:var(--sidebar-width);
2565
- }
2566
-
2567
- #loadingBar .progress{
2568
- position:absolute;
2569
- top:0;
2570
- inset-inline-start:0;
2571
- width:100%;
2572
- transform:scaleX(var(--progressBar-percent));
2573
- transform-origin:calc(50% - 50% * var(--dir-factor)) 0;
2574
- height:100%;
2575
- background-color:var(--progressBar-color);
2576
- overflow:hidden;
2577
- transition:transform 200ms;
2578
- }
2579
-
2580
- @keyframes progressIndeterminate{
2581
- 0%{
2582
- transform:translateX(calc(-142px * var(--dir-factor)));
2583
- }
2584
- 100%{
2585
- transform:translateX(0);
2586
- }
2587
- }
2588
-
2589
- #loadingBar.indeterminate .progress{
2590
- transform:none;
2591
- background-color:var(--progressBar-bg-color);
2592
- transition:none;
2593
- }
2594
-
2595
- #loadingBar.indeterminate .progress .glimmer{
2596
- position:absolute;
2597
- top:0;
2598
- inset-inline-start:0;
2599
- height:100%;
2600
- width:calc(100% + 150px);
2601
- background:repeating-linear-gradient(
2602
- 135deg,
2603
- var(--progressBar-blend-color) 0,
2604
- var(--progressBar-bg-color) 5px,
2605
- var(--progressBar-bg-color) 45px,
2606
- var(--progressBar-color) 55px,
2607
- var(--progressBar-color) 95px,
2608
- var(--progressBar-blend-color) 100px
2609
- );
2610
- animation:progressIndeterminate 1s linear infinite;
2611
- }
2612
-
2613
- #outerContainer.sidebarResizing
2614
- :is(#sidebarContainer, #viewerContainer, #loadingBar){
2615
- transition-duration:0s;
2616
- }
2617
-
2618
- .findbar,
2619
- .secondaryToolbar,
2620
- .editorParamsToolbar{
2621
- top:32px;
2622
- position:absolute;
2623
- z-index:30000;
2624
- height:auto;
2625
- padding:0 4px;
2626
- margin:4px 2px;
2627
- font:message-box;
2628
- font-size:12px;
2629
- line-height:14px;
2630
- text-align:left;
2631
- cursor:default;
2632
- }
2633
-
2634
- .findbar{
2635
- inset-inline-start:64px;
2636
- min-width:300px;
2637
- background-color:var(--toolbar-bg-color);
2638
- }
2639
- .findbar > div{
2640
- height:32px;
2641
- }
2642
- .findbar > div#findbarInputContainer{
2643
- margin-inline-end:4px;
2644
- }
2645
- .findbar.wrapContainers > div,
2646
- .findbar.wrapContainers > div#findbarMessageContainer > *{
2647
- clear:both;
2648
- }
2649
- .findbar.wrapContainers > div#findbarMessageContainer{
2650
- height:auto;
2651
- }
2652
-
2653
- .findbar input[type="checkbox"]{
2654
- pointer-events:none;
2655
- }
2656
-
2657
- .findbar label{
2658
- -webkit-user-select:none;
2659
- -moz-user-select:none;
2660
- user-select:none;
2661
- }
2662
-
2663
- .findbar label:hover,
2664
- .findbar input:focus-visible + label{
2665
- color:var(--toggled-btn-color);
2666
- background-color:var(--button-hover-color);
2667
- }
2668
-
2669
- .findbar .toolbarField[type="checkbox"]:checked + .toolbarLabel{
2670
- background-color:var(--toggled-btn-bg-color) !important;
2671
- color:var(--toggled-btn-color);
2672
- }
2673
-
2674
- #findInput{
2675
- width:200px;
2676
- }
2677
-
2678
- #findInput::-moz-placeholder{
2679
- font-style:normal;
2680
- }
2681
-
2682
- #findInput::placeholder{
2683
- font-style:normal;
2684
- }
2685
-
2686
- .loadingInput:has(> #findInput[data-status="pending"])::after{
2687
- visibility:visible;
2688
- }
2689
-
2690
- #findInput[data-status="notFound"]{
2691
- background-color:rgb(255 102 102);
2692
- }
2693
-
2694
- .secondaryToolbar,
2695
- .editorParamsToolbar{
2696
- padding:6px 0 10px;
2697
- inset-inline-end:4px;
2698
- height:auto;
2699
- background-color:var(--doorhanger-bg-color);
2700
- }
2701
-
2702
- .editorParamsToolbarContainer{
2703
- width:220px;
2704
- margin-bottom:-4px;
2705
- }
2706
-
2707
- .editorParamsToolbarContainer > .editorParamsSetter{
2708
- min-height:26px;
2709
- display:flex;
2710
- align-items:center;
2711
- justify-content:space-between;
2712
- padding-inline:10px;
2713
- }
2714
-
2715
- .editorParamsToolbarContainer .editorParamsLabel{
2716
- padding-inline-end:10px;
2717
- flex:none;
2718
- color:var(--main-color);
2719
- }
2720
-
2721
- .editorParamsToolbarContainer .editorParamsColor{
2722
- width:32px;
2723
- height:32px;
2724
- flex:none;
2725
- }
2726
-
2727
- .editorParamsToolbarContainer .editorParamsSlider{
2728
- background-color:transparent;
2729
- width:90px;
2730
- flex:0 1 0;
2731
- }
2732
-
2733
- .editorParamsToolbarContainer .editorParamsSlider::-moz-range-progress{
2734
- background-color:black;
2735
- }
2736
-
2737
- .editorParamsToolbarContainer .editorParamsSlider::-webkit-slider-runnable-track,
2738
- .editorParamsToolbarContainer .editorParamsSlider::-moz-range-track{
2739
- background-color:black;
2740
- }
2741
-
2742
- .editorParamsToolbarContainer .editorParamsSlider::-webkit-slider-thumb,
2743
- .editorParamsToolbarContainer .editorParamsSlider::-moz-range-thumb{
2744
- background-color:white;
2745
- }
2746
-
2747
- #secondaryToolbarButtonContainer{
2748
- max-width:220px;
2749
- min-height:26px;
2750
- max-height:calc(var(--viewer-container-height) - 40px);
2751
- overflow-y:auto;
2752
- margin-bottom:-4px;
2753
- }
2754
-
2755
- #editorStampParamsToolbar{
2756
- inset-inline-end:calc(var(--editor-toolbar-base-offset) + 0px);
2757
- }
2758
-
2759
- #editorInkParamsToolbar{
2760
- inset-inline-end:calc(var(--editor-toolbar-base-offset) + 28px);
2761
- }
2762
-
2763
- #editorFreeTextParamsToolbar{
2764
- inset-inline-end:calc(var(--editor-toolbar-base-offset) + 56px);
2765
- }
2766
-
2767
- #editorStampAddImage::before{
2768
- -webkit-mask-image:var(--editorParams-stampAddImage-icon);
2769
- mask-image:var(--editorParams-stampAddImage-icon);
2770
- }
2771
-
2772
- .doorHanger,
2773
- .doorHangerRight{
2774
- border-radius:2px;
2775
- box-shadow:0 1px 5px var(--doorhanger-border-color), 0 0 0 1px var(--doorhanger-border-color);
2776
- border:var(--doorhanger-border-color-whcm);
2777
- }
2778
- :is(.doorHanger, .doorHangerRight)::after,
2779
- :is(.doorHanger, .doorHangerRight)::before{
2780
- bottom:100%;
2781
- border:8px solid rgb(0 0 0 / 0);
2782
- content:" ";
2783
- height:0;
2784
- width:0;
2785
- position:absolute;
2786
- pointer-events:none;
2787
- opacity:var(--doorhanger-triangle-opacity-whcm);
2788
- }
2789
- .doorHanger::after{
2790
- inset-inline-start:10px;
2791
- margin-inline-start:-8px;
2792
- border-bottom-color:var(--toolbar-bg-color);
2793
- }
2794
- .doorHangerRight::after{
2795
- inset-inline-end:10px;
2796
- margin-inline-end:-8px;
2797
- border-bottom-color:var(--doorhanger-bg-color);
2798
- }
2799
- :is(.doorHanger, .doorHangerRight)::before{
2800
- border-bottom-color:var(--doorhanger-border-color);
2801
- border-width:9px;
2802
- }
2803
- .doorHanger::before{
2804
- inset-inline-start:10px;
2805
- margin-inline-start:-9px;
2806
- }
2807
- .doorHangerRight::before{
2808
- inset-inline-end:10px;
2809
- margin-inline-end:-9px;
2810
- }
2811
-
2812
- #findResultsCount{
2813
- background-color:rgb(217 217 217);
2814
- color:rgb(82 82 82);
2815
- text-align:center;
2816
- padding:4px 5px;
2817
- margin:5px;
2818
- }
2819
-
2820
- #findMsg[data-status="notFound"]{
2821
- font-weight:bold;
2822
- }
2823
-
2824
- :is(#findResultsCount, #findMsg):empty{
2825
- display:none;
2826
- }
2827
-
2828
- #toolbarViewerMiddle{
2829
- position:absolute;
2830
- left:50%;
2831
- transform:translateX(-50%);
2832
- }
2833
-
2834
- #toolbarViewerLeft,
2835
- #toolbarSidebarLeft{
2836
- float:var(--inline-start);
2837
- }
2838
- #toolbarViewerRight,
2839
- #toolbarSidebarRight{
2840
- float:var(--inline-end);
2841
- }
2842
-
2843
- #toolbarViewerLeft > *,
2844
- #toolbarViewerMiddle > *,
2845
- #toolbarViewerRight > *,
2846
- #toolbarSidebarLeft *,
2847
- #toolbarSidebarRight *,
2848
- .findbar *{
2849
- position:relative;
2850
- float:var(--inline-start);
2851
- }
2852
-
2853
- #toolbarViewerLeft{
2854
- padding-inline-start:1px;
2855
- }
2856
- #toolbarViewerRight{
2857
- padding-inline-end:1px;
2858
- }
2859
- #toolbarSidebarRight{
2860
- padding-inline-end:2px;
2861
- }
2862
-
2863
- .splitToolbarButton{
2864
- margin:2px;
2865
- display:inline-block;
2866
- }
2867
- .splitToolbarButton > .toolbarButton{
2868
- float:var(--inline-start);
2869
- }
2870
-
2871
- .toolbarButton,
2872
- .secondaryToolbarButton,
2873
- .dialogButton{
2874
- border:none;
2875
- background:none;
2876
- width:28px;
2877
- height:28px;
2878
- outline:none;
2879
- }
2880
-
2881
- .dialogButton:is(:hover, :focus-visible){
2882
- background-color:var(--dialog-button-hover-bg-color);
2883
- }
2884
-
2885
- .dialogButton:is(:hover, :focus-visible) > span{
2886
- color:var(--dialog-button-hover-color);
2887
- }
2888
-
2889
- .toolbarButton > span{
2890
- display:inline-block;
2891
- width:0;
2892
- height:0;
2893
- overflow:hidden;
2894
- }
2895
-
2896
- :is(.toolbarButton, .secondaryToolbarButton, .dialogButton)[disabled]{
2897
- opacity:0.5;
2898
- }
2899
-
2900
- .splitToolbarButton > .toolbarButton:is(:hover, :focus-visible),
2901
- .dropdownToolbarButton:hover{
2902
- background-color:var(--button-hover-color);
2903
- }
2904
- .splitToolbarButton > .toolbarButton{
2905
- position:relative;
2906
- margin:0;
2907
- }
2908
- #toolbarSidebar .splitToolbarButton > .toolbarButton{
2909
- margin-inline-end:2px;
2910
- }
2911
-
2912
- .splitToolbarButtonSeparator{
2913
- float:var(--inline-start);
2914
- margin:4px 0;
2915
- width:1px;
2916
- height:20px;
2917
- background-color:var(--separator-color);
2918
- }
2919
-
2920
- .toolbarButton,
2921
- .dropdownToolbarButton,
2922
- .secondaryToolbarButton,
2923
- .dialogButton{
2924
- min-width:16px;
2925
- margin:2px 1px;
2926
- padding:2px 6px 0;
2927
- border:none;
2928
- border-radius:2px;
2929
- color:var(--main-color);
2930
- font-size:12px;
2931
- line-height:14px;
2932
- -webkit-user-select:none;
2933
- -moz-user-select:none;
2934
- user-select:none;
2935
- cursor:default;
2936
- box-sizing:border-box;
2937
- }
2938
-
2939
- .toolbarButton:is(:hover, :focus-visible){
2940
- background-color:var(--button-hover-color);
2941
- }
2942
- .secondaryToolbarButton:is(:hover, :focus-visible){
2943
- background-color:var(--doorhanger-hover-bg-color);
2944
- color:var(--doorhanger-hover-color);
2945
- }
2946
-
2947
- :is(.toolbarButton, .secondaryToolbarButton).toggled,
2948
- .splitToolbarButton.toggled > .toolbarButton.toggled{
2949
- background-color:var(--toggled-btn-bg-color);
2950
- color:var(--toggled-btn-color);
2951
- }
2952
-
2953
- :is(.toolbarButton, .secondaryToolbarButton).toggled:hover,
2954
- .splitToolbarButton.toggled > .toolbarButton.toggled:hover{
2955
- outline:var(--toggled-hover-btn-outline) !important;
2956
- }
2957
-
2958
- :is(.toolbarButton, .secondaryToolbarButton).toggled::before{
2959
- background-color:var(--toggled-btn-color);
2960
- }
2961
-
2962
- :is(.toolbarButton, .secondaryToolbarButton).toggled:hover:active,
2963
- .splitToolbarButton.toggled > .toolbarButton.toggled:hover:active{
2964
- background-color:var(--toggled-hover-active-btn-color);
2965
- }
2966
-
2967
- .dropdownToolbarButton{
2968
- display:flex;
2969
- width:-moz-fit-content;
2970
- width:fit-content;
2971
- min-width:140px;
2972
- padding:0;
2973
- background-color:var(--dropdown-btn-bg-color);
2974
- border:var(--dropdown-btn-border);
2975
- }
2976
- .dropdownToolbarButton::after{
2977
- top:6px;
2978
- inset-inline-end:6px;
2979
- pointer-events:none;
2980
- -webkit-mask-image:var(--toolbarButton-menuArrow-icon);
2981
- mask-image:var(--toolbarButton-menuArrow-icon);
2982
- }
2983
-
2984
- .dropdownToolbarButton > select{
2985
- -webkit-appearance:none;
2986
- -moz-appearance:none;
2987
- appearance:none;
2988
- width:inherit;
2989
- min-width:inherit;
2990
- height:28px;
2991
- font-size:12px;
2992
- color:var(--main-color);
2993
- margin:0;
2994
- padding-block:1px 2px;
2995
- padding-inline:6px 38px;
2996
- border:none;
2997
- background-color:var(--dropdown-btn-bg-color);
2998
- }
2999
- .dropdownToolbarButton > select:is(:hover, :focus-visible){
3000
- background-color:var(--button-hover-color);
3001
- color:var(--toggled-btn-color);
3002
- }
3003
- .dropdownToolbarButton > select > option{
3004
- background:var(--doorhanger-bg-color);
3005
- color:var(--main-color);
3006
- }
3007
-
3008
- .toolbarButtonSpacer{
3009
- width:30px;
3010
- display:inline-block;
3011
- height:1px;
3012
- }
3013
-
3014
- :is(.toolbarButton, .secondaryToolbarButton, .treeItemToggler)::before,
3015
- .dropdownToolbarButton::after{
3016
- position:absolute;
3017
- display:inline-block;
3018
- width:16px;
3019
- height:16px;
3020
-
3021
- content:"";
3022
- background-color:var(--toolbar-icon-bg-color);
3023
- -webkit-mask-size:cover;
3024
- mask-size:cover;
3025
- }
3026
-
3027
- .dropdownToolbarButton:is(:hover, :focus-visible, :active)::after{
3028
- background-color:var(--toolbar-icon-hover-bg-color);
3029
- }
3030
-
3031
- .toolbarButton::before{
3032
- opacity:var(--toolbar-icon-opacity);
3033
- top:6px;
3034
- left:6px;
3035
- }
3036
-
3037
- .toolbarButton:is(:hover, :focus-visible)::before,
3038
- .secondaryToolbarButton:is(:hover, :focus-visible)::before{
3039
- background-color:var(--toolbar-icon-hover-bg-color);
3040
- }
3041
-
3042
- .secondaryToolbarButton::before{
3043
- opacity:var(--doorhanger-icon-opacity);
3044
- top:5px;
3045
- inset-inline-start:12px;
3046
- }
3047
-
3048
- #sidebarToggle::before{
3049
- -webkit-mask-image:var(--toolbarButton-sidebarToggle-icon);
3050
- mask-image:var(--toolbarButton-sidebarToggle-icon);
3051
- transform:scaleX(var(--dir-factor));
3052
- }
3053
-
3054
- #secondaryToolbarToggle::before{
3055
- -webkit-mask-image:var(--toolbarButton-secondaryToolbarToggle-icon);
3056
- mask-image:var(--toolbarButton-secondaryToolbarToggle-icon);
3057
- transform:scaleX(var(--dir-factor));
3058
- }
3059
-
3060
- #findPrevious::before{
3061
- -webkit-mask-image:var(--findbarButton-previous-icon);
3062
- mask-image:var(--findbarButton-previous-icon);
3063
- }
3064
-
3065
- #findNext::before{
3066
- -webkit-mask-image:var(--findbarButton-next-icon);
3067
- mask-image:var(--findbarButton-next-icon);
3068
- }
3069
-
3070
- #previous::before{
3071
- -webkit-mask-image:var(--toolbarButton-pageUp-icon);
3072
- mask-image:var(--toolbarButton-pageUp-icon);
3073
- }
3074
-
3075
- #next::before{
3076
- -webkit-mask-image:var(--toolbarButton-pageDown-icon);
3077
- mask-image:var(--toolbarButton-pageDown-icon);
3078
- }
3079
-
3080
- #zoomOut::before{
3081
- -webkit-mask-image:var(--toolbarButton-zoomOut-icon);
3082
- mask-image:var(--toolbarButton-zoomOut-icon);
3083
- }
3084
-
3085
- #zoomIn::before{
3086
- -webkit-mask-image:var(--toolbarButton-zoomIn-icon);
3087
- mask-image:var(--toolbarButton-zoomIn-icon);
3088
- }
3089
-
3090
- #presentationMode::before{
3091
- -webkit-mask-image:var(--toolbarButton-presentationMode-icon);
3092
- mask-image:var(--toolbarButton-presentationMode-icon);
3093
- }
3094
-
3095
- #editorFreeText::before{
3096
- -webkit-mask-image:var(--toolbarButton-editorFreeText-icon);
3097
- mask-image:var(--toolbarButton-editorFreeText-icon);
3098
- }
3099
-
3100
- #editorInk::before{
3101
- -webkit-mask-image:var(--toolbarButton-editorInk-icon);
3102
- mask-image:var(--toolbarButton-editorInk-icon);
3103
- }
3104
-
3105
- #editorStamp::before{
3106
- -webkit-mask-image:var(--toolbarButton-editorStamp-icon);
3107
- mask-image:var(--toolbarButton-editorStamp-icon);
3108
- }
3109
-
3110
- :is(#print, #secondaryPrint)::before{
3111
- -webkit-mask-image:var(--toolbarButton-print-icon);
3112
- mask-image:var(--toolbarButton-print-icon);
3113
- }
3114
-
3115
- #secondaryOpenFile::before{
3116
- -webkit-mask-image:var(--toolbarButton-openFile-icon);
3117
- mask-image:var(--toolbarButton-openFile-icon);
3118
- }
3119
-
3120
- :is(#download, #secondaryDownload)::before{
3121
- -webkit-mask-image:var(--toolbarButton-download-icon);
3122
- mask-image:var(--toolbarButton-download-icon);
3123
- }
3124
-
3125
- a.secondaryToolbarButton{
3126
- padding-top:5px;
3127
- text-decoration:none;
3128
- }
3129
- a:is(.toolbarButton, .secondaryToolbarButton)[href="#"]{
3130
- opacity:0.5;
3131
- pointer-events:none;
3132
- }
3133
-
3134
- #viewBookmark::before{
3135
- -webkit-mask-image:var(--toolbarButton-bookmark-icon);
3136
- mask-image:var(--toolbarButton-bookmark-icon);
3137
- }
3138
-
3139
- #viewThumbnail::before{
3140
- -webkit-mask-image:var(--toolbarButton-viewThumbnail-icon);
3141
- mask-image:var(--toolbarButton-viewThumbnail-icon);
3142
- }
3143
-
3144
- #viewOutline::before{
3145
- -webkit-mask-image:var(--toolbarButton-viewOutline-icon);
3146
- mask-image:var(--toolbarButton-viewOutline-icon);
3147
- transform:scaleX(var(--dir-factor));
3148
- }
3149
-
3150
- #viewAttachments::before{
3151
- -webkit-mask-image:var(--toolbarButton-viewAttachments-icon);
3152
- mask-image:var(--toolbarButton-viewAttachments-icon);
3153
- }
3154
-
3155
- #viewLayers::before{
3156
- -webkit-mask-image:var(--toolbarButton-viewLayers-icon);
3157
- mask-image:var(--toolbarButton-viewLayers-icon);
3158
- }
3159
-
3160
- #currentOutlineItem::before{
3161
- -webkit-mask-image:var(--toolbarButton-currentOutlineItem-icon);
3162
- mask-image:var(--toolbarButton-currentOutlineItem-icon);
3163
- transform:scaleX(var(--dir-factor));
3164
- }
3165
-
3166
- #viewFind::before{
3167
- -webkit-mask-image:var(--toolbarButton-search-icon);
3168
- mask-image:var(--toolbarButton-search-icon);
3169
- }
3170
-
3171
- .pdfSidebarNotification::after{
3172
- position:absolute;
3173
- display:inline-block;
3174
- top:2px;
3175
- inset-inline-end:2px;
3176
- content:"";
3177
- background-color:rgb(112 219 85);
3178
- height:9px;
3179
- width:9px;
3180
- border-radius:50%;
3181
- }
3182
-
3183
- .secondaryToolbarButton{
3184
- position:relative;
3185
- margin:0;
3186
- padding:0 0 1px;
3187
- padding-inline-start:36px;
3188
- height:auto;
3189
- min-height:26px;
3190
- width:auto;
3191
- min-width:100%;
3192
- text-align:start;
3193
- white-space:normal;
3194
- border-radius:0;
3195
- box-sizing:border-box;
3196
- display:inline-block;
3197
- }
3198
- .secondaryToolbarButton > span{
3199
- padding-inline-end:4px;
3200
- }
3201
-
3202
- #firstPage::before{
3203
- -webkit-mask-image:var(--secondaryToolbarButton-firstPage-icon);
3204
- mask-image:var(--secondaryToolbarButton-firstPage-icon);
3205
- }
3206
-
3207
- #lastPage::before{
3208
- -webkit-mask-image:var(--secondaryToolbarButton-lastPage-icon);
3209
- mask-image:var(--secondaryToolbarButton-lastPage-icon);
3210
- }
3211
-
3212
- #pageRotateCcw::before{
3213
- -webkit-mask-image:var(--secondaryToolbarButton-rotateCcw-icon);
3214
- mask-image:var(--secondaryToolbarButton-rotateCcw-icon);
3215
- }
3216
-
3217
- #pageRotateCw::before{
3218
- -webkit-mask-image:var(--secondaryToolbarButton-rotateCw-icon);
3219
- mask-image:var(--secondaryToolbarButton-rotateCw-icon);
3220
- }
3221
-
3222
- #cursorSelectTool::before{
3223
- -webkit-mask-image:var(--secondaryToolbarButton-selectTool-icon);
3224
- mask-image:var(--secondaryToolbarButton-selectTool-icon);
3225
- }
3226
-
3227
- #cursorHandTool::before{
3228
- -webkit-mask-image:var(--secondaryToolbarButton-handTool-icon);
3229
- mask-image:var(--secondaryToolbarButton-handTool-icon);
3230
- }
3231
-
3232
- #scrollPage::before{
3233
- -webkit-mask-image:var(--secondaryToolbarButton-scrollPage-icon);
3234
- mask-image:var(--secondaryToolbarButton-scrollPage-icon);
3235
- }
3236
-
3237
- #scrollVertical::before{
3238
- -webkit-mask-image:var(--secondaryToolbarButton-scrollVertical-icon);
3239
- mask-image:var(--secondaryToolbarButton-scrollVertical-icon);
3240
- }
3241
-
3242
- #scrollHorizontal::before{
3243
- -webkit-mask-image:var(--secondaryToolbarButton-scrollHorizontal-icon);
3244
- mask-image:var(--secondaryToolbarButton-scrollHorizontal-icon);
3245
- }
3246
-
3247
- #scrollWrapped::before{
3248
- -webkit-mask-image:var(--secondaryToolbarButton-scrollWrapped-icon);
3249
- mask-image:var(--secondaryToolbarButton-scrollWrapped-icon);
3250
- }
3251
-
3252
- #spreadNone::before{
3253
- -webkit-mask-image:var(--secondaryToolbarButton-spreadNone-icon);
3254
- mask-image:var(--secondaryToolbarButton-spreadNone-icon);
3255
- }
3256
-
3257
- #spreadOdd::before{
3258
- -webkit-mask-image:var(--secondaryToolbarButton-spreadOdd-icon);
3259
- mask-image:var(--secondaryToolbarButton-spreadOdd-icon);
3260
- }
3261
-
3262
- #spreadEven::before{
3263
- -webkit-mask-image:var(--secondaryToolbarButton-spreadEven-icon);
3264
- mask-image:var(--secondaryToolbarButton-spreadEven-icon);
3265
- }
3266
-
3267
- #documentProperties::before{
3268
- -webkit-mask-image:var(--secondaryToolbarButton-documentProperties-icon);
3269
- mask-image:var(--secondaryToolbarButton-documentProperties-icon);
3270
- }
3271
-
3272
- .verticalToolbarSeparator{
3273
- display:block;
3274
- margin:5px 2px;
3275
- width:1px;
3276
- height:22px;
3277
- background-color:var(--separator-color);
3278
- }
3279
- .horizontalToolbarSeparator{
3280
- display:block;
3281
- margin:6px 0;
3282
- height:1px;
3283
- width:100%;
3284
- background-color:var(--doorhanger-separator-color);
3285
- }
3286
-
3287
- .toolbarField{
3288
- padding:4px 7px;
3289
- margin:3px 0;
3290
- border-radius:2px;
3291
- background-color:var(--field-bg-color);
3292
- background-clip:padding-box;
3293
- border:1px solid var(--field-border-color);
3294
- box-shadow:none;
3295
- color:var(--field-color);
3296
- font-size:12px;
3297
- line-height:16px;
3298
- outline:none;
3299
- }
3300
-
3301
- .toolbarField[type="checkbox"]{
3302
- opacity:0;
3303
- position:absolute !important;
3304
- left:0;
3305
- margin:10px 0 3px;
3306
- margin-inline-start:7px;
3307
- }
3308
-
3309
- #pageNumber{
3310
- -moz-appearance:textfield;
3311
- text-align:end;
3312
- width:40px;
3313
- background-size:0 0;
3314
- transition-property:none;
3315
- }
3316
-
3317
- #pageNumber::-webkit-inner-spin-button{
3318
- -webkit-appearance:none;
3319
- }
3320
-
3321
- .loadingInput:has(> #pageNumber.loading)::after{
3322
- visibility:visible;
3323
-
3324
- transition-property:visibility;
3325
- transition-delay:var(--loading-icon-delay);
3326
- }
3327
-
3328
- .loadingInput::after{
3329
- position:absolute;
3330
- visibility:hidden;
3331
- top:calc(50% - 8px);
3332
- width:16px;
3333
- height:16px;
3334
-
3335
- content:"";
3336
- background-color:var(--toolbar-icon-bg-color);
3337
- -webkit-mask-size:cover;
3338
- mask-size:cover;
3339
- -webkit-mask-image:var(--loading-icon);
3340
- mask-image:var(--loading-icon);
3341
- }
3342
-
3343
- .loadingInput.start::after{
3344
- inset-inline-start:4px;
3345
- }
3346
-
3347
- .loadingInput.end::after{
3348
- inset-inline-end:4px;
3349
- }
3350
-
3351
- .toolbarField:focus{
3352
- border-color:#0a84ff;
3353
- }
3354
-
3355
- .toolbarLabel{
3356
- min-width:16px;
3357
- padding:7px;
3358
- margin:2px;
3359
- border-radius:2px;
3360
- color:var(--main-color);
3361
- font-size:12px;
3362
- line-height:14px;
3363
- text-align:left;
3364
- -webkit-user-select:none;
3365
- -moz-user-select:none;
3366
- user-select:none;
3367
- cursor:default;
3368
- }
3369
-
3370
- #numPages.toolbarLabel{
3371
- padding-inline-start:3px;
3372
- }
3373
-
3374
- #thumbnailView,
3375
- #outlineView,
3376
- #attachmentsView,
3377
- #layersView{
3378
- position:absolute;
3379
- width:calc(100% - 8px);
3380
- inset-block:0;
3381
- padding:4px 4px 0;
3382
- overflow:auto;
3383
- -webkit-user-select:none;
3384
- -moz-user-select:none;
3385
- user-select:none;
3386
- }
3387
- #thumbnailView{
3388
- width:calc(100% - 60px);
3389
- padding:10px 30px 0;
3390
- }
3391
-
3392
- #thumbnailView > a:is(:active, :focus){
3393
- outline:0;
3394
- }
3395
-
3396
- .thumbnail{
3397
- --thumbnail-width:0;
3398
- --thumbnail-height:0;
3399
-
3400
- float:var(--inline-start);
3401
- width:var(--thumbnail-width);
3402
- height:var(--thumbnail-height);
3403
- margin:0 10px 5px;
3404
- padding:1px;
3405
- border:7px solid transparent;
3406
- border-radius:2px;
3407
- }
3408
-
3409
- #thumbnailView > a:last-of-type > .thumbnail{
3410
- margin-bottom:10px;
3411
- }
3412
-
3413
- a:focus > .thumbnail,
3414
- .thumbnail:hover{
3415
- border-color:var(--thumbnail-hover-color);
3416
- }
3417
- .thumbnail.selected{
3418
- border-color:var(--thumbnail-selected-color) !important;
3419
- }
3420
-
3421
- .thumbnailImage{
3422
- width:var(--thumbnail-width);
3423
- height:var(--thumbnail-height);
3424
- opacity:0.9;
3425
- }
3426
- a:focus > .thumbnail > .thumbnailImage,
3427
- .thumbnail:hover > .thumbnailImage{
3428
- opacity:0.95;
3429
- }
3430
- .thumbnail.selected > .thumbnailImage{
3431
- opacity:1 !important;
3432
- }
3433
-
3434
- .thumbnail:not([data-loaded]) > .thumbnailImage{
3435
- width:calc(var(--thumbnail-width) - 2px);
3436
- height:calc(var(--thumbnail-height) - 2px);
3437
- border:1px dashed rgb(132 132 132);
3438
- }
3439
-
3440
- .treeWithDeepNesting > .treeItem,
3441
- .treeItem > .treeItems{
3442
- margin-inline-start:20px;
3443
- }
3444
-
3445
- .treeItem > a{
3446
- text-decoration:none;
3447
- display:inline-block;
3448
- min-width:calc(100% - 4px);
3449
- height:auto;
3450
- margin-bottom:1px;
3451
- padding:2px 0 5px;
3452
- padding-inline-start:4px;
3453
- border-radius:2px;
3454
- color:var(--treeitem-color);
3455
- font-size:13px;
3456
- line-height:15px;
3457
- -webkit-user-select:none;
3458
- -moz-user-select:none;
3459
- user-select:none;
3460
- white-space:normal;
3461
- cursor:pointer;
3462
- }
3463
-
3464
- #layersView .treeItem > a *{
3465
- cursor:pointer;
3466
- }
3467
- #layersView .treeItem > a > label{
3468
- padding-inline-start:4px;
3469
- }
3470
- #layersView .treeItem > a > label > input{
3471
- float:var(--inline-start);
3472
- margin-top:1px;
3473
- }
3474
-
3475
- .treeItemToggler{
3476
- position:relative;
3477
- float:var(--inline-start);
3478
- height:0;
3479
- width:0;
3480
- color:rgb(255 255 255 / 0.5);
3481
- }
3482
- .treeItemToggler::before{
3483
- inset-inline-end:4px;
3484
- -webkit-mask-image:var(--treeitem-expanded-icon);
3485
- mask-image:var(--treeitem-expanded-icon);
3486
- }
3487
- .treeItemToggler.treeItemsHidden::before{
3488
- -webkit-mask-image:var(--treeitem-collapsed-icon);
3489
- mask-image:var(--treeitem-collapsed-icon);
3490
- transform:scaleX(var(--dir-factor));
3491
- }
3492
- .treeItemToggler.treeItemsHidden ~ .treeItems{
3493
- display:none;
3494
- }
3495
-
3496
- .treeItem.selected > a{
3497
- background-color:var(--treeitem-selected-bg-color);
3498
- color:var(--treeitem-selected-color);
3499
- }
3500
-
3501
- .treeItemToggler:hover,
3502
- .treeItemToggler:hover + a,
3503
- .treeItemToggler:hover ~ .treeItems,
3504
- .treeItem > a:hover{
3505
- background-color:var(--treeitem-bg-color);
3506
- background-clip:padding-box;
3507
- border-radius:2px;
3508
- color:var(--treeitem-hover-color);
3509
- }
3510
-
3511
- .dialogButton{
3512
- width:auto;
3513
- margin:3px 4px 2px !important;
3514
- padding:2px 11px;
3515
- color:var(--main-color);
3516
- background-color:var(--dialog-button-bg-color);
3517
- border:var(--dialog-button-border) !important;
3518
- }
3519
-
3520
- dialog{
3521
- margin:auto;
3522
- padding:15px;
3523
- border-spacing:4px;
3524
- color:var(--main-color);
3525
- font:message-box;
3526
- font-size:12px;
3527
- line-height:14px;
3528
- background-color:var(--doorhanger-bg-color);
3529
- border:1px solid rgb(0 0 0 / 0.5);
3530
- border-radius:4px;
3531
- box-shadow:0 1px 4px rgb(0 0 0 / 0.3);
3532
- }
3533
- dialog::backdrop{
3534
- background-color:rgb(0 0 0 / 0.2);
3535
- }
3536
-
3537
- dialog > .row{
3538
- display:table-row;
3539
- }
3540
-
3541
- dialog > .row > *{
3542
- display:table-cell;
3543
- }
3544
-
3545
- dialog .toolbarField{
3546
- margin:5px 0;
3547
- }
3548
-
3549
- dialog .separator{
3550
- display:block;
3551
- margin:4px 0;
3552
- height:1px;
3553
- width:100%;
3554
- background-color:var(--separator-color);
3555
- }
3556
-
3557
- dialog .buttonRow{
3558
- text-align:center;
3559
- vertical-align:middle;
3560
- }
3561
-
3562
- dialog :link{
3563
- color:rgb(255 255 255);
3564
- }
3565
-
3566
- #passwordDialog{
3567
- text-align:center;
3568
- }
3569
- #passwordDialog .toolbarField{
3570
- width:200px;
3571
- }
3572
-
3573
- #documentPropertiesDialog{
3574
- text-align:left;
3575
- }
3576
- #documentPropertiesDialog .row > *{
3577
- min-width:100px;
3578
- text-align:start;
3579
- }
3580
- #documentPropertiesDialog .row > span{
3581
- width:125px;
3582
- word-wrap:break-word;
3583
- }
3584
- #documentPropertiesDialog .row > p{
3585
- max-width:225px;
3586
- word-wrap:break-word;
3587
- }
3588
- #documentPropertiesDialog .buttonRow{
3589
- margin-top:10px;
3590
- }
3591
-
3592
- .grab-to-pan-grab{
3593
- cursor:grab !important;
3594
- }
3595
- .grab-to-pan-grab
3596
- *:not(input):not(textarea):not(button):not(select):not(:link){
3597
- cursor:inherit !important;
3598
- }
3599
- .grab-to-pan-grab:active,
3600
- .grab-to-pan-grabbing{
3601
- cursor:grabbing !important;
3602
- }
3603
- .grab-to-pan-grabbing{
3604
- position:fixed;
3605
- background:rgb(0 0 0 / 0);
3606
- display:block;
3607
- inset:0;
3608
- overflow:hidden;
3609
- z-index:50000;
3610
- }
3611
-
3612
- @page{
3613
- margin:0;
3614
- }
3615
-
3616
- #printContainer{
3617
- display:none;
3618
- }
3619
-
3620
- @media print{
3621
- body{
3622
- background:rgb(0 0 0 / 0) none;
3623
- }
3624
- body[data-pdfjsprinting] #outerContainer{
3625
- display:none;
3626
- }
3627
- body[data-pdfjsprinting] #printContainer{
3628
- display:block;
3629
- }
3630
- #printContainer{
3631
- height:100%;
3632
- }
3633
- #printContainer > .printedPage{
3634
- page-break-after:always;
3635
- page-break-inside:avoid;
3636
- height:100%;
3637
- width:100%;
3638
-
3639
- display:flex;
3640
- flex-direction:column;
3641
- justify-content:center;
3642
- align-items:center;
3643
- }
3644
-
3645
- #printContainer > .xfaPrintedPage .xfaPage{
3646
- position:absolute;
3647
- }
3648
-
3649
- #printContainer > .xfaPrintedPage{
3650
- page-break-after:always;
3651
- page-break-inside:avoid;
3652
- width:100%;
3653
- height:100%;
3654
- position:relative;
3655
- }
3656
-
3657
- #printContainer > .printedPage :is(canvas, img){
3658
- max-width:100%;
3659
- max-height:100%;
3660
-
3661
- direction:ltr;
3662
- display:block;
3663
- }
3664
- }
3665
-
3666
- .visibleMediumView{
3667
- display:none;
3668
- }
3669
-
3670
- @media all and (max-width: 900px){
3671
- #toolbarViewerMiddle{
3672
- display:table;
3673
- margin:auto;
3674
- left:auto;
3675
- position:inherit;
3676
- transform:none;
3677
- }
3678
- }
3679
-
3680
- @media all and (max-width: 840px){
3681
- #sidebarContainer{
3682
- background-color:var(--sidebar-narrow-bg-color);
3683
- }
3684
- #outerContainer.sidebarOpen #viewerContainer{
3685
- inset-inline-start:0 !important;
3686
- }
3687
- }
3688
-
3689
- @media all and (max-width: 750px){
3690
- :root{
3691
- --editor-toolbar-base-offset:40px;
3692
- }
3693
- #outerContainer .hiddenMediumView{
3694
- display:none;
3695
- }
3696
- #outerContainer .visibleMediumView{
3697
- display:inherit;
3698
- }
3699
- }
3700
-
3701
- @media all and (max-width: 690px){
3702
- .hiddenSmallView,
3703
- .hiddenSmallView *{
3704
- display:none;
3705
- }
3706
- .toolbarButtonSpacer{
3707
- width:0;
3708
- }
3709
- .findbar{
3710
- inset-inline-start:34px;
3711
- }
3712
- }
3713
-
3714
- @media all and (max-width: 560px){
3715
- #scaleSelectContainer{
3716
- display:none;
3717
- }
3718
- }
1
+ body {
2
+ width: 100vh!important;
3
+ height: 100%!important;
4
+ padding: 0!important;
5
+ margin: 0!important;
6
+ }
7
+
8
+ #pdf-container{
9
+ width: 100vh!important;
10
+ height: 100%!important;
11
+ padding: 0!important;
12
+ margin: 0!important;
13
+ position: relative!important;
14
+ }