Qt
Internal/Contributor docs for the Qt SDK. <b>Note:</b> These are NOT official API docs; those are found <a href='https://doc.qt.io/'>here</a>.
Loading...
Searching...
No Matches
qwasmcssstyle.cpp
Go to the documentation of this file.
1
// Copyright (C) 2022 The Qt Company Ltd.
2
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only
3
4
#include "
qwasmcssstyle.h
"
5
6
#include "
qwasmbase64iconstore.h
"
7
8
#include <QtCore/qstring.h>
9
#include <QtCore/qfile.h>
10
11
QT_BEGIN_NAMESPACE
12
13
namespace
{
14
const
char
*
Style
= R
"css(
15
.qt-screen {
16
--border-width: 4px;
17
--resize-outline-width: 8px;
18
--resize-outline-half-width: var(--resize-outline-width) / 2;
19
20
position: relative;
21
border: none;
22
caret-color: transparent;
23
cursor: default;
24
width: 100%;
25
height: 100%;
26
overflow: hidden;
27
}
28
29
.qt-screen div {
30
touch-action: none;
31
}
32
33
.qt-window {
34
position: absolute;
35
background-color: lightgray;
36
}
37
38
.qt-window-contents {
39
overflow: hidden;
40
position: relative;
41
}
42
43
.qt-window.transparent-for-input {
44
pointer-events: none;
45
}
46
47
.qt-window.has-shadow {
48
box-shadow: rgb(0 0 0 / 20%) 0px 10px 16px 0px, rgb(0 0 0 / 19%) 0px 6px 20px 0px;
49
}
50
51
.qt-window.has-border {
52
border: var(--border-width) solid lightgray;
53
caret-color: transparent;
54
}
55
56
.qt-window.frameless {
57
background-color: transparent;
58
}
59
60
.resize-outline {
61
position: absolute;
62
display: none;
63
}
64
65
.qt-window.no-resize > .resize-outline { display: none; }
66
67
.qt-window.has-border:not(.maximized):not(.no-resize) .resize-outline {
68
display: block;
69
}
70
71
.resize-outline.nw {
72
left: calc(-1 * var(--resize-outline-half-width) - var(--border-width));
73
top: calc(-1 * var(--resize-outline-half-width) - var(--border-width));
74
width: var(--resize-outline-width);
75
height: var(--resize-outline-width);
76
cursor: nwse-resize;
77
}
78
79
.resize-outline.n {
80
left: var(--resize-outline-half-width);
81
top: calc(-1 * var(--resize-outline-half-width) - var(--border-width));
82
height: var(--resize-outline-width);
83
width: calc(100% + 2 * var(--border-width) - var(--resize-outline-width));
84
cursor: ns-resize;
85
}
86
87
.resize-outline.ne {
88
left: calc(100% + var(--border-width) - var(--resize-outline-half-width));
89
top: calc(-1 * var(--resize-outline-half-width) - var(--border-width));
90
width: var(--resize-outline-width);
91
height: var(--resize-outline-width);
92
cursor: nesw-resize;
93
}
94
95
.resize-outline.w {
96
left: calc(-1 * var(--resize-outline-half-width) - var(--border-width));
97
top: 0;
98
height: calc(100% + 2 * var(--border-width) - var(--resize-outline-width));
99
width: var(--resize-outline-width);
100
cursor: ew-resize;
101
}
102
103
.resize-outline.e {
104
left: calc(100% + var(--border-width) - var(--resize-outline-half-width));
105
top: 0;
106
height: calc(100% + 2 * var(--border-width) - var(--resize-outline-width));
107
width: var(--resize-outline-width);
108
cursor: ew-resize;
109
}
110
111
.resize-outline.sw {
112
left: calc(-1 * var(--resize-outline-half-width) - var(--border-width));
113
top: calc(100% + var(--border-width) - var(--resize-outline-half-width));
114
width: var(--resize-outline-width);
115
height: var(--resize-outline-width);
116
cursor: nesw-resize;
117
}
118
119
.resize-outline.s {
120
left: var(--resize-outline-half-width);
121
top: calc(100% + var(--border-width) - var(--resize-outline-half-width));
122
height: var(--resize-outline-width);
123
width: calc(100% + 2 * var(--border-width) - var(--resize-outline-width));
124
cursor: ns-resize;
125
}
126
127
.resize-outline.se {
128
left: calc(100% + var(--border-width) - var(--resize-outline-half-width));
129
top: calc(100% + var(--border-width) - var(--resize-outline-half-width));
130
width: var(--resize-outline-width);
131
height: var(--resize-outline-width);
132
cursor: nwse-resize;
133
}
134
135
.title-bar {
136
display: none;
137
align-items: center;
138
overflow: hidden;
139
height: 18px;
140
padding-bottom: 4px;
141
}
142
143
.qt-window.has-border > .title-bar {
144
display: flex;
145
}
146
147
.title-bar .window-name {
148
display: none;
149
font-family: 'Lucida Grande';
150
white-space: nowrap;
151
user-select: none;
152
overflow: hidden;
153
}
154
155
156
.qt-window.has-title .title-bar .window-name {
157
display: block;
158
}
159
160
.title-bar .spacer {
161
flex-grow: 1
162
}
163
164
.qt-window.inactive .title-bar {
165
opacity: 0.35;
166
}
167
168
.qt-window-canvas-container {
169
display: flex;
170
pointer-events: none;
171
}
172
173
.title-bar div {
174
pointer-events: none;
175
}
176
177
.qt-window-a11y-container {
178
position: absolute;
179
z-index: -1;
180
}
181
182
.title-bar .image-button {
183
width: 18px;
184
height: 18px;
185
display: flex;
186
justify-content: center;
187
user-select: none;
188
align-items: center;
189
}
190
191
.title-bar .image-button img {
192
width: 10px;
193
height: 10px;
194
user-select: none;
195
pointer-events: none;
196
-webkit-user-drag: none;
197
background-size: 10px 10px;
198
}
199
200
.title-bar .action-button {
201
pointer-events: all;
202
}
203
204
.qt-window.blocked div {
205
pointer-events: none;
206
}
207
208
.title-bar .action-button img {
209
transition: filter 0.08s ease-out;
210
}
211
212
.title-bar .action-button:hover img {
213
filter: invert(0.45);
214
}
215
216
.title-bar .action-button:active img {
217
filter: invert(0.6);
218
}
219
220
/* This will clip the content within 50% frame in 1x1 pixel area, preventing it
221
from being rendered on the page, but it should still be read by modern
222
screen readers */
223
.hidden-visually-read-by-screen-reader {
224
visibility: visible;
225
clip: rect(1px, 1px, 1px, 1px);
226
clip-path: inset(50%);
227
height: 1px;
228
width: 1px;
229
margin: -1px;
230
overflow: hidden;
231
padding: 0;
232
position: absolute;
233
}
234
235
)css";
236
237
}
// namespace
238
239
emscripten::val
QWasmCSSStyle::createStyleElement
(emscripten::val parent)
240
{
241
auto
document = parent[
"ownerDocument"
];
242
auto
screenStyle = document.call<emscripten::val>(
"createElement"
, emscripten::val(
"style"
));
243
244
screenStyle.set(
"textContent"
, std::string(Style));
245
return
screenStyle;
246
}
247
248
QT_END_NAMESPACE
QT_BEGIN_NAMESPACE
Combined button and popup list for selecting options.
Definition
qstandardpaths_haiku.cpp:21
QT_BEGIN_NAMESPACE::Style
const char * Style
Definition
qwasmcssstyle.cpp:14
QT_END_NAMESPACE
Definition
qsharedpointer.cpp:1590
QWasmCSSStyle::createStyleElement
emscripten::val createStyleElement(emscripten::val parent)
Definition
qwasmcssstyle.cpp:239
qwasmbase64iconstore.h
qwasmcssstyle.h
qtbase
src
plugins
platforms
wasm
qwasmcssstyle.cpp
Generated by
1.10.0