|
29 | 29 | /*background: #F6F6F6;*/
|
30 | 30 | margin: -30px -40px -40px;
|
31 | 31 | }
|
32 |
| - .toggle-button { |
| 32 | + .toggle-icon { |
33 | 33 | display: inline-block;
|
34 |
| - background: url("/bundles/framework/images/toggler.png") no-repeat top left #ccc; |
| 34 | + background: url("{{ asset('/bundles/framework/images/toggler.png') }}") no-repeat top left #5eb5e0; |
35 | 35 | }
|
36 |
| - .toggle-button.closed { |
| 36 | + .closed .toggle-icon, .closed.toggle-icon { |
37 | 37 | background-position: bottom left;
|
38 | 38 | }
|
39 |
| - .toggle-button.empty { |
40 |
| - background-image: url("/bundles/framework/images/toggler_empty.png"); |
| 39 | + .toggle-icon.empty { |
| 40 | + background-image: url("{{ asset('/bundles/framework/images/toggler_empty.png') }}"); |
41 | 41 | }
|
42 | 42 | .tree {
|
43 | 43 | width: 230px;
|
|
70 | 70 | .tree a {
|
71 | 71 | text-decoration: none;
|
72 | 72 | }
|
73 |
| - .tree .toggle-button { |
| 73 | + .tree .toggle-icon { |
74 | 74 | width: 10px;
|
75 | 75 | height: 10px;
|
76 | 76 | /* vertically center the button */
|
|
79 | 79 | margin-top: -5px;
|
80 | 80 | margin-left: -15px;
|
81 | 81 | background-size: 10px 20px;
|
| 82 | + background-color: #ccc; |
82 | 83 | }
|
83 |
| - .tree .toggle-button.empty { |
| 84 | + .tree .toggle-icon.empty { |
84 | 85 | background-size: 10px 10px;
|
85 | 86 | }
|
86 | 87 | .tree ul ul .tree-inner {
|
|
103 | 104 | font-weight: bold;
|
104 | 105 | color: #313131;
|
105 | 106 | }
|
106 |
| - .tree .tree-inner.active .toggle-button, .tree .tree-inner:hover .toggle-button, .tree .tree-inner.active:hover .toggle-button { |
107 |
| - background-image: url("/bundles/framework/images/toggler_hover.png"); |
| 107 | + .tree .tree-inner.active .toggle-icon, .tree .tree-inner:hover .toggle-icon, .tree .tree-inner.active:hover .toggle-icon { |
| 108 | + background-image: url("{{ asset('/bundles/framework/images/toggler_hover.png') }}"); |
108 | 109 | background-color: #aaa;
|
109 | 110 | }
|
110 |
| - .tree .tree-inner.active .toggle-button.empty, .tree .tree-inner:hover .toggle-button.empty, .tree .tree-inner.active:hover .toggle-button.empty { |
111 |
| - background-image: url("/bundles/framework/images/toggler_hover_empty.png"); |
| 111 | + .tree .tree-inner.active .toggle-icon.empty, .tree .tree-inner:hover .toggle-icon.empty, .tree .tree-inner.active:hover .toggle-icon.empty { |
| 112 | + background-image: url("{{ asset('/bundles/framework/images/toggler_hover_empty.png') }}"); |
112 | 113 | }
|
113 | 114 | .tree-details {
|
114 | 115 | border-left: 1px solid #dfdfdf;
|
|
120 | 121 | position: relative;
|
121 | 122 | padding-left: 22px;
|
122 | 123 | }
|
123 |
| - .tree-details .toggle-button { |
| 124 | + .tree-details .toggle-icon { |
124 | 125 | width: 16px;
|
125 | 126 | height: 16px;
|
126 | 127 | /* vertically center the button */
|
|
149 | 150 | color: #800;
|
150 | 151 | }
|
151 | 152 | .errors th, .errors td {
|
152 |
| - border: 1px solid #800; |
| 153 | + border-color: #800; |
153 | 154 | }
|
154 | 155 | .errors th {
|
155 | 156 | background: #a33;
|
156 | 157 | color: #fff;
|
157 | 158 | }
|
158 |
| - .errors .toggle-button { |
| 159 | + .errors .toggle-icon { |
159 | 160 | background-color: #a33;
|
160 | 161 | }
|
| 162 | + h3 a, h3 a:hover, h3 a:focus { |
| 163 | + color: inherit; |
| 164 | + text-decoration: inherit; |
| 165 | + } |
161 | 166 | </style>
|
162 | 167 |
|
163 | 168 | {% if collector.data.forms|length %}
|
|
255 | 260 |
|
256 | 261 | function TabView() {
|
257 | 262 | "use strict";
|
258 |
| - |
| 263 | +
|
259 | 264 | var activeTab = null,
|
260 | 265 |
|
261 | 266 | activeTarget = null,
|
|
328 | 333 | <li>
|
329 | 334 | <div class="tree-inner" data-tab-target-id="{{ data.id }}-details">
|
330 | 335 | {% if data.children is not empty %}
|
331 |
| - <a class="toggle-button" data-toggle-target-id="{{ data.id }}-children" href="#"></a> |
| 336 | + <a class="toggle-button toggle-icon" data-toggle-target-id="{{ data.id }}-children" href="#"></a> |
332 | 337 | {% else %}
|
333 |
| - <div class="toggle-button empty"></div> |
| 338 | + <div class="toggle-icon empty"></div> |
334 | 339 | {% endif %}
|
335 | 340 | {{ name }}
|
336 | 341 | {% if data.errors is defined and data.errors|length > 0 %}
|
|
360 | 365 | {% if data.errors is defined and data.errors|length > 0 %}
|
361 | 366 | <div class="errors">
|
362 | 367 | <h3>
|
363 |
| - <a class="toggle-button" data-toggle-target-id="{{ data.id }}-errors" href="#"></a> |
364 |
| - Errors |
| 368 | + <a class="toggle-button" data-toggle-target-id="{{ data.id }}-errors" href="#"> |
| 369 | + <span class="toggle-icon"></span> |
| 370 | + Errors |
| 371 | + </a> |
365 | 372 | </h3>
|
366 | 373 |
|
367 | 374 | <table id="{{ data.id }}-errors">
|
|
381 | 388 |
|
382 | 389 | {% if data.default_data is defined %}
|
383 | 390 | <h3>
|
384 |
| - <a class="toggle-button" data-toggle-target-id="{{ data.id }}-default_data" href="#"></a> |
385 |
| - Default Data |
| 391 | + <a class="toggle-button" data-toggle-target-id="{{ data.id }}-default_data" href="#"> |
| 392 | + <span class="toggle-icon"></span> |
| 393 | + Default Data |
| 394 | + </a> |
386 | 395 | </h3>
|
387 | 396 |
|
388 | 397 | <div id="{{ data.id }}-default_data">
|
|
417 | 426 |
|
418 | 427 | {% if data.submitted_data is defined %}
|
419 | 428 | <h3>
|
420 |
| - <a class="toggle-button" data-toggle-target-id="{{ data.id }}-submitted_data" href="#"></a> |
421 |
| - Submitted Data |
| 429 | + <a class="toggle-button" data-toggle-target-id="{{ data.id }}-submitted_data" href="#"> |
| 430 | + <span class="toggle-icon"></span> |
| 431 | + Submitted Data |
| 432 | + </a> |
422 | 433 | </h3>
|
423 | 434 |
|
424 | 435 | <div id="{{ data.id }}-submitted_data">
|
|
457 | 468 |
|
458 | 469 | {% if data.passed_options is defined %}
|
459 | 470 | <h3>
|
460 |
| - <a class="toggle-button" data-toggle-target-id="{{ data.id }}-passed_options" href="#"></a> |
461 |
| - Passed Options |
| 471 | + <a class="toggle-button" data-toggle-target-id="{{ data.id }}-passed_options" href="#"> |
| 472 | + <span class="toggle-icon"></span> |
| 473 | + Passed Options |
| 474 | + </a> |
462 | 475 | </h3>
|
463 | 476 |
|
464 | 477 | <div id="{{ data.id }}-passed_options">
|
|
491 | 504 |
|
492 | 505 | {% if data.resolved_options is defined %}
|
493 | 506 | <h3>
|
494 |
| - <a class="toggle-button" data-toggle-target-id="{{ data.id }}-resolved_options" href="#"></a> |
495 |
| - Resolved Options |
| 507 | + <a class="toggle-button" data-toggle-target-id="{{ data.id }}-resolved_options" href="#"> |
| 508 | + <span class="toggle-icon"></span> |
| 509 | + Resolved Options |
| 510 | + </a> |
496 | 511 | </h3>
|
497 | 512 |
|
498 | 513 | <div id="{{ data.id }}-resolved_options" class="hidden">
|
|
513 | 528 |
|
514 | 529 | {% if data.view_vars is defined %}
|
515 | 530 | <h3>
|
516 |
| - <a class="toggle-button" data-toggle-target-id="{{ data.id }}-view_vars" href="#"></a> |
517 |
| - View Variables |
| 531 | + <a class="toggle-button" data-toggle-target-id="{{ data.id }}-view_vars" href="#"> |
| 532 | + <span class="toggle-icon"></span> |
| 533 | + View Variables |
| 534 | + </a> |
518 | 535 | </h3>
|
519 | 536 |
|
520 | 537 | <div id="{{ data.id }}-view_vars" class="hidden">
|
|
0 commit comments