File size: 2,291 Bytes
21db406
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
:root {
    --bg: 222.2 84% 4.9%;
    --fg: 210 40% 98%;
    --bd: 217.2 32.6% 17.5%;
    --ri: 224.3 76.3% 48%;
    --rd: .5rem;
    --pr: 217.2 91.2% 59.8%;
    --mu: 217.2 32.6% 17.5%;
    --mu-fg: 215 20.2% 65.1%;
    --ac: 217.2 32.6% 17.5%;
    --ac-fg: 210 40% 98%;
    --ca: 222.2 84% 4.9%;
    --ca-fg: 210 40% 98%
}

body,
.gradio-container {
    font-family: 'Outfit', sans-serif !important;
    background: hsl(var(--bg)) !important;
    color: hsl(var(--fg)) !important
}

.gradio-container {
    background: radial-gradient(circle at top right, rgba(99, 102, 241, .08), transparent 40%), radial-gradient(circle at bottom left, rgba(236, 72, 153, .05), transparent 40%), hsl(var(--bg)) !important
}

.layout-tree {
    max-height: 550px;
    overflow-y: auto
}

.tree-summary::before {
    content: '\25B6';
    display: inline-block;
    margin-right: 8px;
    transition: transform .2s;
    font-size: .75rem;
    color: hsl(var(--mu-fg))
}

.tree-item[open]>.tree-summary::before {
    transform: rotate(90deg);
    color: hsl(var(--ri))
}

.tree-summary::-webkit-details-marker {
    display: none
}

.ocr-box {
    fill: transparent;
    cursor: pointer;
    transition: all .15s;
    pointer-events: auto;
    stroke-linejoin: round
}

.ocr-box:hover {
    fill: rgba(255, 255, 255, .08);
    stroke-width: 2.5px !important
}

.ocr-box.selected {
    fill: rgba(251, 191, 36, .15) !important;
    stroke: #fbbf24 !important;
    stroke-width: 3px !important;
    filter: drop-shadow(0 0 3px rgba(251, 191, 36, .5))
}

.box-block {
    stroke: rgba(244, 114, 182, .75);
    stroke-width: 2.2px
}

.box-paragraph {
    stroke: rgba(34, 211, 238, .75);
    stroke-width: 1.6px
}

.box-line {
    stroke: rgba(139, 92, 246, .75);
    stroke-width: 1.3px
}

.box-word {
    stroke: rgba(16, 185, 129, .75);
    stroke-width: 1px
}

.box-symbol {
    stroke: rgba(245, 158, 11, .75);
    stroke-width: .8px
}

.box-whitespace {
    stroke: rgba(239, 68, 68, .65);
    stroke-width: .8px
}

.box-block,
.box-paragraph,
.box-line,
.box-word,
.box-symbol,
.box-whitespace {
    display: none
}

.show-blocks .box-block,
.show-paragraphs .box-paragraph,
.show-lines .box-line,
.show-words .box-word,
.show-symbols .box-symbol,
.show-whitespace .box-whitespace {
    display: block
}