Skip to content

Commit a0030b8

Browse files
committed
[WebProfilerBundle] Changed toggle color back to blue and made headlines in the form debugger clickable
1 parent 505c5be commit a0030b8

File tree

1 file changed

+46
-29
lines changed
  • src/Symfony/Bundle/WebProfilerBundle/Resources/views/Collector

1 file changed

+46
-29
lines changed

src/Symfony/Bundle/WebProfilerBundle/Resources/views/Collector/form.html.twig

Lines changed: 46 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -29,15 +29,15 @@
2929
/*background: #F6F6F6;*/
3030
margin: -30px -40px -40px;
3131
}
32-
.toggle-button {
32+
.toggle-icon {
3333
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;
3535
}
36-
.toggle-button.closed {
36+
.closed .toggle-icon, .closed.toggle-icon {
3737
background-position: bottom left;
3838
}
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') }}");
4141
}
4242
.tree {
4343
width: 230px;
@@ -70,7 +70,7 @@
7070
.tree a {
7171
text-decoration: none;
7272
}
73-
.tree .toggle-button {
73+
.tree .toggle-icon {
7474
width: 10px;
7575
height: 10px;
7676
/* vertically center the button */
@@ -79,8 +79,9 @@
7979
margin-top: -5px;
8080
margin-left: -15px;
8181
background-size: 10px 20px;
82+
background-color: #ccc;
8283
}
83-
.tree .toggle-button.empty {
84+
.tree .toggle-icon.empty {
8485
background-size: 10px 10px;
8586
}
8687
.tree ul ul .tree-inner {
@@ -103,12 +104,12 @@
103104
font-weight: bold;
104105
color: #313131;
105106
}
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') }}");
108109
background-color: #aaa;
109110
}
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') }}");
112113
}
113114
.tree-details {
114115
border-left: 1px solid #dfdfdf;
@@ -120,7 +121,7 @@
120121
position: relative;
121122
padding-left: 22px;
122123
}
123-
.tree-details .toggle-button {
124+
.tree-details .toggle-icon {
124125
width: 16px;
125126
height: 16px;
126127
/* vertically center the button */
@@ -149,15 +150,19 @@
149150
color: #800;
150151
}
151152
.errors th, .errors td {
152-
border: 1px solid #800;
153+
border-color: #800;
153154
}
154155
.errors th {
155156
background: #a33;
156157
color: #fff;
157158
}
158-
.errors .toggle-button {
159+
.errors .toggle-icon {
159160
background-color: #a33;
160161
}
162+
h3 a, h3 a:hover, h3 a:focus {
163+
color: inherit;
164+
text-decoration: inherit;
165+
}
161166
</style>
162167

163168
{% if collector.data.forms|length %}
@@ -255,7 +260,7 @@
255260
256261
function TabView() {
257262
"use strict";
258-
263+
259264
var activeTab = null,
260265
261266
activeTarget = null,
@@ -328,9 +333,9 @@
328333
<li>
329334
<div class="tree-inner" data-tab-target-id="{{ data.id }}-details">
330335
{% 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>
332337
{% else %}
333-
<div class="toggle-button empty"></div>
338+
<div class="toggle-icon empty"></div>
334339
{% endif %}
335340
{{ name }}
336341
{% if data.errors is defined and data.errors|length > 0 %}
@@ -360,8 +365,10 @@
360365
{% if data.errors is defined and data.errors|length > 0 %}
361366
<div class="errors">
362367
<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>
365372
</h3>
366373

367374
<table id="{{ data.id }}-errors">
@@ -381,8 +388,10 @@
381388

382389
{% if data.default_data is defined %}
383390
<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>
386395
</h3>
387396

388397
<div id="{{ data.id }}-default_data">
@@ -417,8 +426,10 @@
417426

418427
{% if data.submitted_data is defined %}
419428
<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>
422433
</h3>
423434

424435
<div id="{{ data.id }}-submitted_data">
@@ -457,8 +468,10 @@
457468

458469
{% if data.passed_options is defined %}
459470
<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>
462475
</h3>
463476

464477
<div id="{{ data.id }}-passed_options">
@@ -491,8 +504,10 @@
491504

492505
{% if data.resolved_options is defined %}
493506
<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>
496511
</h3>
497512

498513
<div id="{{ data.id }}-resolved_options" class="hidden">
@@ -513,8 +528,10 @@
513528

514529
{% if data.view_vars is defined %}
515530
<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>
518535
</h3>
519536

520537
<div id="{{ data.id }}-view_vars" class="hidden">

0 commit comments

Comments
 (0)