8000 Finished the Ajax panel redesign · symfony/symfony@acee052 · GitHub
[go: up one dir, main page]
Skip to content

Commit acee052

Browse files
javiereguiluzjaviereguiluz
committed
Finished the Ajax panel redesign
1 parent fac5391 commit acee052

File tree

5 files changed

+51
-36
lines changed

5 files changed

+51
-36
lines changed

‎src/Symfony/Bundle/WebProfilerBundle/Resources/views/Collector/ajax.html.twig

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,13 @@
22

33
{% block toolbar %}
44
{% set icon %}
5+
{{ include('@WebProfiler/Icon/ajax.svg.twig') }}
56
<span class="sf-toolbar-value sf-toolbar-ajax-requests">0</span>
6-
<span class="sf-toolbar-label">ajax</span>
77
{% endset %}
8+
89
{% set text %}
910
<div class="sf-toolbar-info-piece">
10-
<b>AJAX requests</b>
11-
<span class="sf-toolbar-ajax-info"></span>
11+
<b class="sf-toolbar-ajax-info"></b>
1212
</div>
1313
<div class="sf-toolbar-info-piece">
1414
<table class="sf-toolbar-ajax-requests">
@@ -24,5 +24,6 @@
2424
</table>
2525
</div>
2626
{% endset %}
27-
{% include '@WebProfiler/Profiler/toolbar_item.html.twig' with { 'link': false } %}
27+
28+
{{ include('@WebProfiler/Profiler/toolbar_item.html.twig', { link: false }) }}
2829
{% endblock %}

‎src/Symfony/Bundle/WebProfilerBundle/Resources/views/Collector/request.html.twig

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,14 +4,19 @@
44
{% set request_handler %}
55
{% if collector.controller.class is defined %}
66
{% set link = collector.controller.file|file_link(collector.controller.line) %}
7+
{% if link %}<a href="#" onclick="window.location='{{link|e('js')}}';window.event.stopPropagation();return false;">{% endif %}
8+
9+
<span class="sf-toolbar-info-class">
10+
{{ collector.controller.class|abbr_class }}
11+
</span>
12+
713
{% if collector.controller.method %}
8-
<span class="sf-toolbar-info-class sf-toolbar-info-with-next-pointer">{{ collector.controller.class|abbr_class }}</span>
9-
<span class="sf-toolbar-info-method"{% if link %} onclick="window.location='{{link|e('js')}}';window.event.stopPropagation();return false;"{% endif %}>
14+
<span class=" 8000 sf-toolbar-info-method">
1015
{{ collector.controller.method }}
1116
</span>
12-
{% else %}
13-
<span class="sf-toolbar-info-class"{% if link %} onclick="window.location='{{link|e('js')}}';window.event.stopPropagation();return false;"{% endif %}>{{ collector.controller.class|abbr_class }}</span>
1417
{% endif %}
18+
19+
{% if link %}</a>{% endif %}
1520
{% else %}
1621
<span class="sf-toolbar-info-class">{{ collector.controller }}</span>
1722
{% endif %}

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
{% set time = collector.templatecount ? '%0.0f'|format(collector.time) : 'n/a' %}
55
{% set icon %}
66
<span>
7-
<img height="28" alt="Twig" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAcCAYAAACOGPReAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAbElEQVRIx2NgGAXUBowMDAwMaWlp/6ll4KxZsxhZYJy0tDRqGMjAwMDAwEQL77OgCxSXlJBsSG9PDwqfJi6lj/fRvTJ4XYocUTBXE4q8oRtRRBnKwsw8RFw6fA0lKkd1dnYOIpfCCthRMIIAAI0IFu9Hxh7ZAAAAAElFTkSuQmCC" />
7+
{{ include('@WebProfiler/Icon/twig.html.twig') }}
88
<span class="sf-toolbar-value">{{ time }}</span>
99
<span class="sf-toolbar-label">ms</span>
1010
</span>

‎src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/base_js.html.twig

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -165,7 +165,7 @@
165165
tbody.appendChild(rows);
166166
167167
if (infoSpan) {
168-
var text = requestStack.length + ' call' + (requestStack.length > 1 ? 's' : '');
168+
var text = requestStack.length + ' AJAX request' + (requestStack.length > 1 ? 's' : '');
169169
infoSpan.textContent = text;
170170
}
171171
} else {
@@ -181,15 +181,16 @@
181181
requestCounter[0].textContent = requestStack.length;
182182
183183
var className = 'sf-toolbar-ajax-requests sf-toolbar-value';
184+
requestCounter[0].className = className;
185+
186+
var ajaxToolbarPanel = document.querySelectorAll('.sf-toolbar-block-ajax');
184187
if (state == 'ok') {
185-
className += ' sf-toolbar-status-green';
188+
ajaxToolbarPanel.className = 'sf-toolbar-status-green';
186189
} else if (state == 'error') {
187-
className += ' sf-toolbar-status-red';
190+
ajaxToolbarPanel.className = 'sf-toolbar-status-red';
188191
} else {
189-
className += ' sf-ajax-request-loading';
192+
ajaxToolbarPanel.className = 'sf-ajax-request-loading';
190193
}
191-
192-
requestCounter[0].className = className;
193194
};
194195
195196
var addEventListener;

‎src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/toolbar.css.twig

Lines changed: 29 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -92,12 +92,6 @@
9292
.sf-toolbar-block-config svg {
9393
padding-right: 4px;
9494
}
95-
.sf-toolbar-block-time {
96-
margin-right: 0;
97-
}
98-
.sf-toolbar-block-ajax {
99-
display: none;
100-
}
10195

10296
.sf-toolbar-block span {
10397
display: inline-block;
@@ -140,7 +134,7 @@
140134
}
141135

142136
.sf-toolbar-block .sf-toolbar-info-piece a {
143-
color: #75D1EA;
137+
color: #99CDD8;
144138
text-decoration: underline;
145139
}
146140
.sf-toolbar-block .sf-toolbar-info-piece a:hover {
@@ -288,17 +282,13 @@
288282
margin-top: 0;
289283
}
290284

291-
.sf-toolbar-block .sf-toolbar-info-method {
285+
.sf-toolbar-block-time .sf-toolbar-icon {
286+
padding-right: 5px;
292287
}
293-
294-
.sf-toolbar-block .sf-toolbar-info-method[onclick=""] {
295-
border-bottom: none;
296-
cursor: inherit;
288+
.sf-toolbar-block-memory .sf-toolbar-icon {
289+
padding-left: 5px;
297290
}
298291

299-
.sf-toolbar-info-php {}
300-
.sf-toolbar-info-php-ext {}
301-
302292
.sf-toolbar-info-php-ext .sf-toolbar-status + .sf-toolbar-status {
303293
margin-left: 4px;
304294
}
@@ -339,21 +329,39 @@
339329
overflow-y: auto;
340330
}
341331

342-
.sf-toolbar-ajax-requests th, .sf-toolbar-ajax-requests td {
343-
border-bottom: 1px solid #ddd;
344-
padding: 0 4px;
345-
color: #2f2f2f;
346-
background-color: #fff;
332+
.sf-toolbar-info-piece b.sf-toolbar-ajax-info {
333+
color: #F5F5F5;
334+
}
335+
.sf-toolbar-ajax-requests {
336+
width: 100%;
337+
}
338+
339+
.sf-toolbar-ajax-requests td {
340+
background-color: #444;
341+
border-bottom: 1px solid #777;
342+
color: #F5F5F5;
343+
font-size: 12px;
344+
padding: 4px;
347345
}
348346
.sf-toolbar-ajax-requests th {
349-
background-color: #eee;
347+
background-color: #222;
348+
border-bottom: 0;
349+
color: #AAA;
350+
font-size: 11px;
351+
padding: 4px;
350352
}
351353
.sf-ajax-request-url {
352354
max-width: 300px;
353355
line-height: 9px;
354356
overflow: hidden;
355357
text-overflow: ellipsis;
356358
}
359+
.sf-toolbar-ajax-requests .sf-ajax-request-url a {
360+
text-decoration: none;
361+
}
362+
.sf-toolbar-ajax-requests .sf-ajax-request-url a:hover {
363+
text-decoration: underline;
364+
}
357365
.sf-ajax-request-duration {
358366
text-align: right;
359367
}

0 commit comments

Comments
 (0)
0