1 |
|
2 |
|
3 | #include <string>
|
4 |
|
5 | namespace souffle {
|
6 | namespace profile {
|
7 | namespace html {
|
8 | std::string cssStyle = R"___(
|
9 | a, abbr, acronym, address,
|
10 | applet, article, aside, audio, b, big, blockquote, body, canvas, caption,
|
11 | center, cite, code, dd, del, details, dfn, dl, dt, em, embed, fieldset,
|
12 | figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, html,
|
13 | i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav,
|
14 | object, ol, output, p, pre, q, ruby, s, samp, section, small,
|
15 | span, strike, strong, sub, summary, sup, table, tbody, td,
|
16 | tfoot, th, thead, time, tr, tt, u, ul, var, video {
|
17 | margin: 0;
|
18 | padding: 0;
|
19 | border: 0;
|
20 | font: inherit;
|
21 | vertical-align: baseline;
|
22 | }
|
23 |
|
24 | th[role=columnheader]:not(.no-sort) {
|
25 | cursor: pointer;
|
26 | }
|
27 |
|
28 | th[role=columnheader]:not(.no-sort):after {
|
29 | content: '';
|
30 | float: right;
|
31 | margin-top: 7px;
|
32 | border-width: 0 4px 4px;
|
33 | border-style: solid;
|
34 | border-color: #404040 transparent;
|
35 | visibility: hidden;
|
36 | opacity: 0;
|
37 | -webkit-user-select: none;
|
38 | -moz-user-select: none;
|
39 | user-select: none;
|
40 | }
|
41 |
|
42 | th[aria-sort=ascending]:not(.no-sort):after {
|
43 | border-bottom: none;
|
44 | border-width: 4px 4px 0;
|
45 | }
|
46 |
|
47 | th[aria-sort]:not(.no-sort):after {
|
48 | visibility: visible;
|
49 | opacity: 0.4;
|
50 | }
|
51 |
|
52 | th[role=columnheader]:not(.no-sort):hover:after {
|
53 | visibility: visible;
|
54 | opacity: 1;
|
55 | }
|
56 |
|
57 | body,
|
58 | h1 {
|
59 | font-size: 13px
|
60 | }
|
61 |
|
62 | article, aside, details, figcaption, figure, footer, header, menu, nav, section {
|
63 | display: block
|
64 | }
|
65 |
|
66 | body,
|
67 | html {
|
68 | line-height: 1
|
69 | }
|
70 |
|
71 | ol,
|
72 | ul {
|
73 | list-style: none
|
74 | }
|
75 |
|
76 | blockquote,
|
77 | q {
|
78 | quotes: none
|
79 | }
|
80 |
|
81 | blockquote:after,
|
82 | blockquote:before,
|
83 | q:after,
|
84 | q:before {
|
85 | content: none
|
86 | }
|
87 |
|
88 | :focus {
|
89 | outline: 0
|
90 | }
|
91 |
|
92 | *,
|
93 | :after,
|
94 | :before {
|
95 | box-sizing: border-box
|
96 | }
|
97 |
|
98 | body {
|
99 | margin: 0;
|
100 | font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
101 | line-height: 18px;
|
102 | color: #303030;
|
103 | background-color: #fafafa;
|
104 | -webkit-font-smoothing: antialiased;
|
105 | padding: 0
|
106 | }
|
107 |
|
108 | h1,
|
109 | h2,
|
110 | h3,
|
111 | h4,
|
112 | h5 {
|
113 | font-weight: 700;
|
114 | display: block;
|
115 | margin: 0 0 10px;
|
116 | text-align: center;
|
117 | }
|
118 |
|
119 | h1,
|
120 | ul {
|
121 | margin: 0 0 20px
|
122 | }
|
123 |
|
124 | h1 {
|
125 | display: block;
|
126 | font-weight: 400;
|
127 | text-shadow: 0 1px 0 #fff
|
128 | }
|
129 |
|
130 | a,
|
131 | strong,
|
132 | table th {
|
133 | font-weight: 700
|
134 | }
|
135 |
|
136 | h1 span.description {
|
137 | color: #6d6d6d
|
138 | }
|
139 |
|
140 | h2 {
|
141 | font-size: 18px;
|
142 | line-height: 24px;
|
143 | margin: 20px 0 10px
|
144 | }
|
145 |
|
146 | h3 {
|
147 | font-size: 15px;
|
148 | margin: 20px 0
|
149 | }
|
150 |
|
151 | li {
|
152 | margin-left: 30px;
|
153 | margin-bottom: 3px
|
154 | }
|
155 |
|
156 | ul li {
|
157 | list-style: disc
|
158 | }
|
159 |
|
160 | ol li {
|
161 | list-style: decimal
|
162 | }
|
163 |
|
164 | a {
|
165 | color: #404040;
|
166 | text-decoration: none;
|
167 | border-bottom: 1px solid #ddd
|
168 | }
|
169 |
|
170 | a:hover {
|
171 | border-color: #d0d0d0
|
172 | }
|
173 |
|
174 | .notice {
|
175 | background: #ffa;
|
176 | border: 1px solid #cc7;
|
177 | display: block;
|
178 | padding: 10px;
|
179 | margin-bottom: 10px
|
180 | }
|
181 |
|
182 | .stretch {
|
183 | display: block;
|
184 | width: 100%
|
185 | }
|
186 |
|
187 | .pad1y {
|
188 | padding: 10px 0
|
189 | }
|
190 |
|
191 | .center {
|
192 | text-align: center
|
193 | }
|
194 |
|
195 | .content {
|
196 | margin-top: 40px;
|
197 | padding: 0 0 20px
|
198 | }
|
199 |
|
200 | table {
|
201 | background: #fff;
|
202 | max-width: 100%;
|
203 | border-spacing: 0;
|
204 | width: 100%;
|
205 | margin: 10px 0;
|
206 | border: 1px solid #ddd;
|
207 | border-collapse: separate;
|
208 | -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, .1);
|
209 | -moz-box-shadow: 0 0 4px rgba(0, 0, 0, .1);
|
210 | box-shadow: 0 0 4px rgba(0, 0, 0, .1)
|
211 | }
|
212 |
|
213 | table td,
|
214 | table th {
|
215 | position: relative;
|
216 | padding: 4px;
|
217 | line-height: 15px;
|
218 | text-align: left;
|
219 | border-top: 1px solid #ddd
|
220 | }
|
221 |
|
222 | .limiter,
|
223 | header {
|
224 | margin: 0 auto;
|
225 | padding: 0 20px
|
226 | }
|
227 |
|
228 | table th {
|
229 | background: #eee;
|
230 | background: -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#eee));
|
231 | background: -moz-linear-gradient(top, #f6f6f6, #eee);
|
232 | text-shadow: 0 1px 0 #fff;
|
233 | vertical-align: bottom
|
234 | }
|
235 |
|
236 | table td {
|
237 | vertical-align: top
|
238 | }
|
239 |
|
240 | table tr {
|
241 | background: rgba(0, 255, 0, 0)
|
242 | }
|
243 |
|
244 | table tbody:first-child tr:first-child td,
|
245 | table tbody:first-child tr:first-child th,
|
246 | table thead:first-child tr td,
|
247 | table thead:first-child tr th,
|
248 | table thead:first-child tr:first-child th {
|
249 | border-top: 0
|
250 | }
|
251 |
|
252 | table tbody + tbody {
|
253 | border-top: 2px solid #ddd
|
254 | }
|
255 |
|
256 | table td + td,
|
257 | table td + th,
|
258 | table th + td,
|
259 | table th + th {
|
260 | border-left: 1px solid #ddd
|
261 | }
|
262 |
|
263 | header {
|
264 | width: 960px
|
265 | }
|
266 |
|
267 | .limiter {
|
268 | width: 520px
|
269 | }
|
270 |
|
271 | .links {
|
272 | width: 480px;
|
273 | margin: 50px auto 0
|
274 | }
|
275 |
|
276 | .links a {
|
277 | width: 50%;
|
278 | float: left
|
279 | }
|
280 |
|
281 | a.button {
|
282 | background: #1F90FF;
|
283 | border: 1px solid #1f4fff;
|
284 | height: 40px;
|
285 | line-height: 38px;
|
286 | color: #fff;
|
287 | display: inline-block;
|
288 | text-align: center;
|
289 | padding: 0 10px;
|
290 | -webkit-border-radius: 1px;
|
291 | border-radius: 1px;
|
292 | -webkit-transition: box-shadow 150ms linear;
|
293 | -moz-transition: box-shadow 150ms linear;
|
294 | -o-transition: box-shadow 150ms linear;
|
295 | transition: box-shadow 150ms linear
|
296 | }
|
297 |
|
298 | pre,
|
299 | pre code {
|
300 | line-height: 1.25em
|
301 | }
|
302 |
|
303 | a.button:hover {
|
304 | background-color: #0081ff;
|
305 | -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, .25);
|
306 | box-shadow: 0 1px 5px rgba(0, 0, 0, .25);
|
307 | border: 1px solid #1f4fff
|
308 | }
|
309 |
|
310 | a.button:active,
|
311 | a.button:focus {
|
312 | background: #0081ff;
|
313 | -webkit-box-shadow: inset 0 1px 5px rgba(0, 0, 0, .25);
|
314 | box-shadow: inset 0 1px 5px rgba(0, 0, 0, .25)
|
315 | }
|
316 |
|
317 | .options {
|
318 | margin: 10px 0 30px 15px
|
319 | }
|
320 |
|
321 | .options h3 {
|
322 | display: block;
|
323 | padding-top: 10px;
|
324 | margin-top: 20px
|
325 | }
|
326 |
|
327 | .options h3:first-child {
|
328 | border: none;
|
329 | margin-top: 0
|
330 | }
|
331 |
|
332 | code,
|
333 | pre {
|
334 | font-family: Consolas, Menlo, 'Liberation Mono', Courier, monospace;
|
335 | word-wrap: break-word;
|
336 | color: #333
|
337 | }
|
338 |
|
339 | pre {
|
340 | font-size: 13px;
|
341 | background: #fff;
|
342 | padding: 10px 15px;
|
343 | margin: 10px 0;
|
344 | overflow: auto;
|
345 | -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
|
346 | box-shadow: 0 1px 3px rgba(0, 0, 0, .3)
|
347 | }
|
348 |
|
349 | code {
|
350 | font-size: 12px;
|
351 | border: 0;
|
352 | padding: 0;
|
353 | background: #e6e6e6;
|
354 | background: rgba(0, 0, 0, .08);
|
355 | box-shadow: 0 0 0 2px rgba(0, 0, 0, .08)
|
356 | }
|
357 |
|
358 | pre code {
|
359 | font-size: 13px;
|
360 | background: 0 0;
|
361 | box-shadow: none;
|
362 | border: none;
|
363 | padding: 0;
|
364 | margin: 0
|
365 | }
|
366 |
|
367 | .col12 {
|
368 | width: 100%
|
369 | }
|
370 |
|
371 | .col6 {
|
372 | width: 50%;
|
373 | float: left;
|
374 | display: block
|
375 | }
|
376 |
|
377 | #toolbar-button,
|
378 | ul.tab li a {
|
379 | display: inline-block;
|
380 | text-align: center;
|
381 | text-decoration: none
|
382 | }
|
383 |
|
384 | .pill-group {
|
385 | margin: 40px 0 0
|
386 | }
|
387 |
|
388 | .pill-group a:first-child {
|
389 | border-radius: 20px 0 0 20px;
|
390 | border-right-width: 0
|
391 | }
|
392 |
|
393 | .pill-group a:last-child {
|
394 | border-radius: 0 20px 20px 0
|
395 | }
|
396 |
|
397 | #toolbar-button {
|
398 | background-color: #4CAF50;
|
399 | border: none;
|
400 | color: #fff;
|
401 | margin: 7px 12px;
|
402 | padding: 8px 14px;
|
403 | font-size: 32px
|
404 | }
|
405 |
|
406 | .tabcontent,
|
407 | ul.tab {
|
408 | border: 1px solid #ccc
|
409 | }
|
410 |
|
411 | #toolbar-button:hover {
|
412 | background-color: #0081ff;
|
413 | -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, .25);
|
414 | box-shadow: 0 1px 5px rgba(0, 0, 0, .25)
|
415 | }
|
416 |
|
417 | #toolbar-button:active,
|
418 | #toolbar-button:focus {
|
419 | background: #0081ff;
|
420 | -webkit-box-shadow: inset 0 1px 5px rgba(0, 0, 0, .25);
|
421 | box-shadow: inset 0 1px 5px rgba(0, 0, 0, .25)
|
422 | }
|
423 |
|
424 | ul.tab {
|
425 | margin: 0;
|
426 | padding: 0;
|
427 | overflow: hidden;
|
428 | border: 1px solid #ccc;
|
429 | background-color: #f1f1f1;
|
430 | }
|
431 |
|
432 | ul.tab li {
|
433 | float: left;
|
434 | list-style: none;
|
435 | }
|
436 |
|
437 | ul.tab li a {
|
438 | display: inline-block;
|
439 | color: black;
|
440 | text-align: center;
|
441 | padding: 14px 16px;
|
442 | text-decoration: none;
|
443 | transition: 0.3s;
|
444 | font-size: 17px;
|
445 | }
|
446 |
|
447 | ul.tab li a:hover {
|
448 | background-color: #ddd;
|
449 | }
|
450 |
|
451 | ul.tab li a:focus, .active {
|
452 | background-color: #ccc;
|
453 | }
|
454 |
|
455 | .tabcontent {
|
456 | display: none;
|
457 | padding: 6px 12px;
|
458 | border: 1px solid #ccc;
|
459 | border-top: none;
|
460 | }
|
461 |
|
462 | .rulesofrel {
|
463 | display: none;
|
464 | animation: fadeEffect 1s
|
465 | }
|
466 |
|
467 | .RulVerTable {
|
468 | display: none;
|
469 | -webkit-animation: fadeEffect 1s;
|
470 | animation: fadeEffect 1s
|
471 | }
|
472 |
|
473 | @-webkit-keyframes fadeEffect {
|
474 | from {
|
475 | opacity: 0
|
476 | }
|
477 | to {
|
478 | opacity: 1
|
479 | }
|
480 | }
|
481 |
|
482 | @keyframes fadeEffect {
|
483 | from {
|
484 | opacity: 0
|
485 | }
|
486 | to {
|
487 | opacity: 1
|
488 | }
|
489 | }
|
490 |
|
491 | .rulesofrel,
|
492 | .tabcontent {
|
493 | -webkit-animation: fadeEffect 1s
|
494 | }
|
495 |
|
496 | .perc_time,
|
497 | .perc_tup {
|
498 | padding: 0;
|
499 | margin: 0;
|
500 | background: #aaf;
|
501 | width: 100%;
|
502 | height: 30px;
|
503 | font: inherit;
|
504 | font-weight: 700;
|
505 | color: #000
|
506 | }
|
507 |
|
508 | .text_cell {
|
509 | position: relative;
|
510 | }
|
511 |
|
512 | .text_cell span {
|
513 | word-break: break-all;
|
514 | position: absolute;
|
515 | width: 95%;
|
516 | text-overflow: ellipsis;
|
517 | white-space: nowrap;
|
518 | overflow: hidden;
|
519 | }
|
520 |
|
521 | .text_cell span:hover {
|
522 | word-break: break-all;
|
523 | position: absolute;
|
524 | width: 95%;
|
525 | height: auto;
|
526 | text-overflow: initial;
|
527 | white-space: normal;
|
528 | overflow: visible;
|
529 | background: #fff;
|
530 | z-index: 10;
|
531 | }
|
532 |
|
533 | th:last-child {
|
534 | width: 20%;
|
535 | }
|
536 |
|
537 | th:first-child {
|
538 | width: 80%;
|
539 | }
|
540 |
|
541 | .table_wrapper {
|
542 | max-height: 50vh;
|
543 | overflow-y: scroll;
|
544 | }
|
545 |
|
546 | /* chartist tooltip plugin css */
|
547 | .chartist-tooltip {
|
548 | position: absolute;
|
549 | display: none;
|
550 | opacity: 0;
|
551 | min-width: 5em;
|
552 | padding: .5em;
|
553 | background: #F4C63D;
|
554 | color: #453D3F;
|
555 | font-family: Oxygen, Helvetica, Arial, sans-serif;
|
556 | font-weight: 700;
|
557 | text-align: center;
|
558 | pointer-events: none;
|
559 | z-index: 1;
|
560 | -webkit-transition: opacity .2s linear;
|
561 | -moz-transition: opacity .2s linear;
|
562 | -o-transition: opacity .2s linear;
|
563 | transition: opacity .2s linear;
|
564 | }
|
565 |
|
566 | .chartist-tooltip:before {
|
567 |
|
568 | content: "";
|
569 | position: absolute;
|
570 | top: 100%;
|
571 | left: 50%;
|
572 | width: 0;
|
573 | height: 0;
|
574 | margin-left: -15px;
|
575 | border: 15px solid transparent;
|
576 | border-top-color: #F4C63D;
|
577 | }
|
578 |
|
579 | .chartist-tooltip.tooltip-show {
|
580 | display: inline-block;
|
581 | opacity: 1;
|
582 | }
|
583 |
|
584 | .ct-area, .ct-line {
|
585 | pointer-events: none;
|
586 | }
|
587 |
|
588 | button {
|
589 | font-family: inherit;
|
590 | font-size: 100%;
|
591 | padding: .5em 1em;
|
592 | color: #444;
|
593 | color: rgba(0, 0, 0, .8);
|
594 | border: 1px solid #999;
|
595 | background-color: #E6E6E6;
|
596 | text-decoration: none;
|
597 | border-radius: 2px
|
598 | }
|
599 | button:hover {
|
600 | filter: alpha(opacity=90);
|
601 | background-image: -webkit-linear-gradient(transparent, rgba(0, 0, 0, .05) 40%, rgba(0, 0, 0, .1));
|
602 | background-image: linear-gradient(transparent, rgba(0, 0, 0, .05) 40%, rgba(0, 0, 0, .1))
|
603 | }
|
604 |
|
605 | button {
|
606 | border: none;
|
607 | display: inline-block;
|
608 | zoom: 1;
|
609 | line-height: normal;
|
610 | white-space: nowrap;
|
611 | vertical-align: middle;
|
612 | text-align: center;
|
613 | cursor: pointer;
|
614 | -webkit-user-drag: none;
|
615 | -webkit-user-select: none;
|
616 | -moz-user-select: none;
|
617 | -ms-user-select: none;
|
618 | user-select: none;
|
619 | box-sizing: border-box;
|
620 | }
|
621 |
|
622 | #Help p {
|
623 | margin-bottom: 1em;
|
624 | }
|
625 |
|
626 | #code-list {
|
627 | background: #AAA;
|
628 | padding-left: 2em;
|
629 | color: #666;
|
630 | }
|
631 |
|
632 | .code-li {
|
633 | background: #FAFAFA;
|
634 | marginBottom: 0;
|
635 | }
|
636 |
|
637 | #code-view {
|
638 | overflow: auto;
|
639 | height: calc( 100vh - 160px );
|
640 | width: calc( 100vw - 25px );
|
641 | font-family: Consolas, Menlo, Monaco, Lucida Console,'Bitstream Vera Sans Mono','Courier',monospace;
|
642 | line-height: 21px;
|
643 | }
|
644 |
|
645 | #code-view .text-span {
|
646 | white-space: nowrap;
|
647 | padding-left: 6px;
|
648 | color: #666;
|
649 | }
|
650 |
|
651 | #code-view .ol li:before {
|
652 | color: #666;
|
653 | background: #AAA;
|
654 | }
|
655 |
|
656 | .code-li:hover {
|
657 | background: #eacf7d;
|
658 | }
|
659 |
|
660 | .number-span {
|
661 | content: counter(item) ". ";
|
662 | counter-increment: item;
|
663 | list-style:decimal;
|
664 | width: 60px;
|
665 | }
|
666 | )___";
|
667 | }
|
668 | } // namespace profile
|
669 | } // namespace souffle
|