~holger-seelig/cobweb.js/trunk

« back to all changes in this revision

Viewing changes to dist/cobweb.css

  • Committer: Holger Seelig
  • Date: 2017-08-22 04:53:24 UTC
  • Revision ID: holger.seelig@yahoo.de-20170822045324-4of4xxgt79669gbt
Switched to npm.

Show diffs side-by-side

added added

removed removed

Lines of Context:
 
1
/* Cobweb CSS StyleSheet */
 
2
 
 
3
@charset "utf-8";
 
4
 
 
5
@import url(https://fonts.googleapis.com/css?family=PT+Sans:400,400italic,700,700italic);
 
6
@import url(spinner.css);
 
7
 
 
8
X3DCanvas {
 
9
        overflow: hidden;
 
10
        position: relative;
 
11
        display: inline-block;
 
12
        margin: 0px;
 
13
        padding: 0px;
 
14
        border: 0px;
 
15
        width: 300px;
 
16
        height: 150px;
 
17
}
 
18
 
 
19
X3DCanvas.cobweb-fullscreen {
 
20
        width: 100% !important;
 
21
        height: 100% !important;
 
22
}
 
23
 
 
24
X3DCanvas > *:not(.cobweb-fallback) {
 
25
        display: none;
 
26
}
 
27
 
 
28
.cobweb-console {
 
29
        font-family: monospace;
 
30
        white-space: pre;
 
31
}
 
32
 
 
33
X3DCanvas .cobweb-browser {
 
34
        z-index: 0;
 
35
        display: block;
 
36
        position: absolute;
 
37
        top: 0;
 
38
        right: 0;
 
39
        bottom: 0;
 
40
        left: 0;
 
41
        margin: 0px;
 
42
        padding: 0px;
 
43
        border: 0px;
 
44
}
 
45
 
 
46
X3DCanvas .cobweb-surface {
 
47
        margin: 0px;
 
48
        padding: 0px;
 
49
        border: 0px;
 
50
        height: 100%;
 
51
        margin-right: 0px;
 
52
}
 
53
 
 
54
X3DCanvas canvas {
 
55
        display: block;
 
56
        outline: none;
 
57
        margin: 0px;
 
58
        padding: 0px;
 
59
        border: 0px;
 
60
        width: 100%;
 
61
        height: 100%;
 
62
}
 
63
 
 
64
X3DCanvas .cobweb-notification {
 
65
        display: none;
 
66
        padding: 2px 5px 5px 5px;
 
67
        position: absolute;
 
68
        top: 20px;
 
69
        right: -4px;
 
70
        background: rgba(0,0,0,0.61803);
 
71
        background: -moz-linear-gradient(top, rgba(50,50,50,0.61803) 0%, rgba(0,0,0,0.61803) 100%); /* FF3.6-15 */
 
72
        background: -webkit-linear-gradient(top, rgba(50,50,50,0.61803) 0%,rgba(0,0,0,0.61803) 100%); /* Chrome10-25,Safari5.1-6 */
 
73
        background: linear-gradient(to bottom, rgba(50,50,50,0.61803) 0%,rgba(0,0,0,0.61803) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 
74
        border: 4px solid rgba(60,60,60,0.61803);
 
75
        border-radius: 5px;
 
76
        -webkit-background-clip: padding-box; /* for Safari */
 
77
        background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
 
78
        color: white;
 
79
        font-family: PT Sans, sans-serif;
 
80
        font-size: 10pt;
 
81
        white-space: pre;
 
82
        pointer-events: none;
 
83
}
 
84
 
 
85
X3DCanvas .cobweb-notification span {
 
86
        padding: 0px 24px 0px 20px;
 
87
        background: url(images/icon.bw.png) no-repeat 0px center;
 
88
}
 
89
 
 
90
X3DCanvas .cobweb-browser-timings {
 
91
        display: none;
 
92
        position: absolute;
 
93
        bottom: -4px;
 
94
        left: -4px;
 
95
        padding: 10px 15px 14px 14px;
 
96
        background: rgba(0,0,0,0.61803);
 
97
        background: -moz-linear-gradient(top, rgba(50,50,50,0.61803) 0%, rgba(0,0,0,0.61803) 100%); /* FF3.6-15 */
 
98
        background: -webkit-linear-gradient(top, rgba(50,50,50,0.61803) 0%,rgba(0,0,0,0.61803) 100%); /* Chrome10-25,Safari5.1-6 */
 
99
        background: linear-gradient(to bottom, rgba(50,50,50,0.61803) 0%,rgba(0,0,0,0.61803) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 
100
        border: 4px solid rgba(60,60,60,0.61803);
 
101
        border-radius: 5px;
 
102
        -webkit-background-clip: padding-box; /* for Safari */
 
103
        background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
 
104
        color: white;
 
105
        font-family: PT Sans, sans-serif;
 
106
        font-size: 9pt;
 
107
        line-height: 1.1;
 
108
        white-space: pre;
 
109
        pointer-events: none;
 
110
}
 
111
 
 
112
X3DCanvas .cobweb-browser-timings table,
 
113
X3DCanvas .cobweb-browser-timings thead,
 
114
X3DCanvas .cobweb-browser-timings tbody,
 
115
X3DCanvas .cobweb-browser-timings tfoot,
 
116
X3DCanvas .cobweb-browser-timings tr,
 
117
X3DCanvas .cobweb-browser-timings th,
 
118
X3DCanvas .cobweb-browser-timings td {
 
119
        outline: 0;
 
120
        margin: 0;
 
121
        border: 0;
 
122
        padding: 0;
 
123
        background: none;
 
124
        color: white;
 
125
        font-weight: normal;
 
126
        font-style: normal;
 
127
        line-height: 1;
 
128
        text-align: left;
 
129
}
 
130
 
 
131
X3DCanvas .cobweb-browser-timings table {
 
132
        background: url(images/Time.png) no-repeat;
 
133
}
 
134
 
 
135
X3DCanvas .cobweb-browser-timings tr,
 
136
X3DCanvas .cobweb-browser-timings th,
 
137
X3DCanvas .cobweb-browser-timings td {
 
138
        border-collapse: separate;
 
139
}
 
140
 
 
141
X3DCanvas .cobweb-browser-timings thead th {
 
142
        padding-left: 20px;
 
143
        padding-bottom: 5px;
 
144
}
 
145
 
 
146
X3DCanvas .cobweb-browser-timings thead th {
 
147
        font-weight: bold;
 
148
}
 
149
 
 
150
X3DCanvas .cobweb-browser-timings td:first-child {
 
151
        padding-right: 10px;
 
152
}
 
153
 
 
154
X3DCanvas .cobweb-browser-timings tr.cobweb-more td {
 
155
        padding-bottom: 5px;
 
156
}
 
157
 
 
158
X3DCanvas .cobweb-browser-timings td {
 
159
        padding-bottom: 2px;
 
160
}
 
161
 
 
162
X3DCanvas .cobweb-browser-timings tfoot td {
 
163
        padding-top: 4px;
 
164
}
 
165
 
 
166
X3DCanvas .cobweb-browser-timings button {
 
167
        border: 0;
 
168
        padding: 2px;
 
169
        background: rgba(0,0,0,0.38196601);
 
170
        color: white;
 
171
        font-size: 9pt;
 
172
        line-height: 1.1;
 
173
        font-family: PT Sans, sans-serif;
 
174
        font-style: italic;
 
175
        pointer-events: all;
 
176
        cursor: default;
 
177
}
 
178
 
 
179
X3DCanvas .cobweb-browser-timings button:hover {
 
180
        cursor: pointer;
 
181
}
 
182
 
 
183
/*!
 
184
 * jQuery contextMenu - Plugin for simple contextMenu handling
 
185
 *
 
186
 * Version: v1.8.1
 
187
 *
 
188
 * Authors: Björn Brala (SWIS.nl), Rodney Rehm, Addy Osmani (patches for FF)
 
189
 * Web: http://swisnl.github.io/jQuery-contextMenu/
 
190
 *
 
191
 * Copyright (c) 2011-2015 SWIS BV and contributors
 
192
 *
 
193
 * Licensed under
 
194
 *   MIT License http://www.opensource.org/licenses/mit-license
 
195
 
 
196
 * Date: 2015-09-20T18:47:54.927Z
 
197
 */
 
198
 
 
199
/* menu title */
 
200
.cobweb-menu.cobweb-menu-title:before {
 
201
    content: "Cobweb X3D Browser";
 
202
    display: block;
 
203
    padding: 4px 32px 4px 8px;
 
204
    font-weight: bold;
 
205
}
 
206
 
 
207
.cobweb-menu .context-menu-selected {
 
208
        font-weight: bold;
 
209
        font-style: italic;
 
210
}
 
211
 
 
212
.cobweb-menu.context-menu-list,
 
213
.cobweb-menu .context-menu-list {
 
214
        position: absolute;
 
215
        display: inline-block;
 
216
        min-width: 120px;
 
217
        padding: 0;
 
218
        margin: 0;
 
219
        white-space: pre;
 
220
        font-family: PT Sans, sans-serif;
 
221
        font-size: 10pt;
 
222
        line-height: 1.2;
 
223
        list-style-type: none;
 
224
        background: #222;
 
225
        color: #eee;
 
226
        border: 0px solid #ddd;
 
227
        -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, .5);
 
228
                box-shadow: 0 2px 5px rgba(0, 0, 0, .5);
 
229
}
 
230
 
 
231
.cobweb-menu .context-menu-item {
 
232
        position: relative;
 
233
        background-color: #222;
 
234
        border-top: 1px solid #222;
 
235
        border-bottom: 1px solid #222;
 
236
        padding: 3px 24px 3px 24px;
 
237
        -webkit-user-select: none;
 
238
           -moz-user-select: none;
 
239
            -ms-user-select: none;
 
240
                user-select: none;
 
241
}
 
242
 
 
243
.cobweb-menu .context-menu-separator {
 
244
        padding-bottom: 0;
 
245
        border-bottom: 1px solid #111;
 
246
}
 
247
 
 
248
.cobweb-menu .context-menu-item > label > input,
 
249
.cobweb-menu .context-menu-item > label > textarea {
 
250
        -webkit-user-select: text;
 
251
           -moz-user-select: text;
 
252
            -ms-user-select: text;
 
253
               user-select: text;
 
254
}
 
255
 
 
256
.cobweb-menu .context-menu-item.hover {
 
257
        cursor: pointer;
 
258
        background-color: #444;
 
259
        border-top: 1px solid #eee;
 
260
        border-bottom: 1px solid #eee;
 
261
}
 
262
 
 
263
.cobweb-menu .context-menu-item.disabled {
 
264
        color: #666;
 
265
}
 
266
 
 
267
.cobweb-menu .context-menu-input.hover,
 
268
.cobweb-menu .context-menu-item.disabled.hover {
 
269
        cursor: default;
 
270
}
 
271
 
 
272
.cobweb-menu .context-menu-submenu:after {
 
273
        content: "";
 
274
        position: absolute;
 
275
        display: block;
 
276
        right: 0;
 
277
        top: 5px;
 
278
        margin-right: 2px;
 
279
        /* CSS triangle */
 
280
        width: 0;
 
281
        height: 0;
 
282
        border-style: solid;
 
283
        border-width: 4px 0 4px 5px;
 
284
        border-color: transparent transparent transparent #eee;
 
285
}
 
286
 
 
287
/* icons
 
288
   #protip:
 
289
   In case you want to use sprites for icons (which I would suggest you do) have a look at
 
290
   http://css-tricks.com/13224-pseudo-spriting/ to get an idea of how to implement 
 
291
   .context-menu-item.icon:before {}
 
292
 */
 
293
 
 
294
.cobweb-menu .context-menu-item.context-menu-icon {
 
295
        background-repeat: no-repeat;
 
296
        background-position: 3px 2px;
 
297
}
 
298
 
 
299
/* vertically align inside labels */
 
300
.cobweb-menu .context-menu-input > label > * {
 
301
        vertical-align: top;
 
302
}
 
303
 
 
304
/* position checkboxes and radios as icons */
 
305
.cobweb-menu .context-menu-input > label > input[type="checkbox"],
 
306
.cobweb-menu .context-menu-input > label > input[type="radio"] {
 
307
        display: inline;
 
308
        margin: 0;
 
309
        margin-left: -20px;
 
310
        margin-right: 3px;
 
311
        padding: 0;
 
312
}
 
313
 
 
314
.cobweb-menu .context-menu-input > label > span {
 
315
        margin-left: 4px;
 
316
}
 
317
 
 
318
.cobweb-menu .context-menu-input > label,
 
319
.cobweb-menu .context-menu-input > label > input[type="text"],
 
320
.cobweb-menu .context-menu-input > label > textarea,
 
321
.cobweb-menu .context-menu-input > label > select {
 
322
        display: block;
 
323
        width: 100%;
 
324
        -webkit-box-sizing: border-box;
 
325
           -moz-box-sizing: border-box;
 
326
                box-sizing: border-box;
 
327
}
 
328
 
 
329
.cobweb-menu .context-menu-input > label > textarea {
 
330
        height: 100px;
 
331
}
 
332
 
 
333
.cobweb-menu .context-menu-item > .context-menu-list {
 
334
        top: 5px;
 
335
        /* re-positioned by js */
 
336
        right: -5px;
 
337
        display: none;
 
338
}
 
339
 
 
340
.cobweb-menu .context-menu-item.visible > .context-menu-list {
 
341
        display: block;
 
342
}
 
343
 
 
344
.cobweb-menu .context-menu-accesskey {
 
345
        text-decoration: underline;
 
346
}
 
347
 
 
348
/* Icons */
 
349
 
 
350
.cobweb-icon-viewpoint {
 
351
        background: url("images/Viewpoint.png");
 
352
}
 
353
 
 
354
.cobweb-icon-examine-viewer {
 
355
        background: url("images/ExamineViewer.png");
 
356
}
 
357
 
 
358
.cobweb-icon-walk-viewer {
 
359
        background: url("images/WalkViewer.png");
 
360
}
 
361
 
 
362
.cobweb-icon-fly-viewer {
 
363
        background: url("images/FlyViewer.png");
 
364
}
 
365
 
 
366
.cobweb-icon-lookat-viewer {
 
367
        background: url("images/gtk-zoom-in.png");
 
368
}
 
369
 
 
370
.cobweb-icon-plane-viewer {
 
371
        background: url("images/PlaneViewer.png");
 
372
}
 
373
 
 
374
.cobweb-icon-none-viewer {
 
375
        background: url("images/NoneViewer.png");
 
376
}
 
377
 
 
378
.cobweb-icon-zoom-fit {
 
379
        background: url("images/gtk-zoom-fit.png");
 
380
}
 
381
 
 
382
.cobweb-icon-zoom-in {
 
383
        background: url("images/gtk-zoom-in.png");
 
384
}
 
385
 
 
386
.cobweb-icon-primitive-quality {
 
387
        background: url("images/PrimitiveQuality.png");
 
388
}
 
389
 
 
390
.cobweb-icon-texture-quality {
 
391
        background: url("images/TextureQuality.png");
 
392
}
 
393
 
 
394
.cobweb-icon-fullscreen {
 
395
        background: url("images/gtk-fullscreen.png");
 
396
}
 
397
 
 
398
.cobweb-icon-leave-fullscreen {
 
399
        background: url("images/gtk-leave-fullscreen.png");
 
400
}
 
401
 
 
402
.cobweb-icon-help-about {
 
403
        background: url("images/help-about.png");
 
404
}