Skip to content

Commit cf19370

Browse files
gavinwahlThomas Grainger
gavinwahl
authored and
Thomas Grainger
committed
Remove the use of inline styles for CSP compatibility
Conflicts: debug_toolbar/templates/debug_toolbar/panels/profiling.html
1 parent 81b8c61 commit cf19370

File tree

13 files changed

+58
-30
lines changed

13 files changed

+58
-30
lines changed

‎debug_toolbar/static/debug_toolbar/css/print.css‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
#djDebug {
2+
display:none;
3+
}

‎debug_toolbar/static/debug_toolbar/css/toolbar.css‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -646,3 +646,16 @@
646646
display: none;
647647
}
648648
}
649+
650+
#djDebug .width-20 {
651+
width: 20%;
652+
}
653+
#djDebug .width-60 {
654+
width: 60%;
655+
}
656+
#djDebug .width-60 {
657+
width: 60%;
658+
}
659+
#djDebug .highlighted {
660+
background-color: lightgrey;
661+
}

‎debug_toolbar/static/debug_toolbar/js/toolbar.js‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -285,13 +285,21 @@
285285

286286
return value;
287287
}
288+
},
289+
applyStyle: function(name) {
290+
$('#djDebug [data-' + name + ']').each(function() {
291+
var css = {};
292+
css[name] = $(this).data(name);
293+
$(this).css(css);
294+
});
288295
}
289296
};
290297
$.extend(publicAPI, {
291298
show_toolbar: djdt.show_toolbar,
292299
hide_toolbar: djdt.hide_toolbar,
293300
close: djdt.close,
294-
cookie: djdt.cookie
301+
cookie: djdt.cookie,
302+
applyStyle: djdt.applyStyle
295303
});
296304
$(document).ready(djdt.init);
297305
})(djdt.jQuery, djdt);

‎debug_toolbar/static/debug_toolbar/js/toolbar.profiling.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,4 +17,5 @@
1717
subcalls.hide();
1818
}
1919
});
20+
djdt.applyStyle('padding-left');
2021
})(djdt.jQuery);

‎debug_toolbar/static/debug_toolbar/js/toolbar.sql.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,4 +4,7 @@
44
$(this).parent().find('.djDebugCollapsed').toggle();
55
$(this).parent().find('.djDebugUncollapsed').toggle();
66
});
7+
djdt.applyStyle('background-color');
8+
djdt.applyStyle('left');
9+
djdt.applyStyle('width');
710
})(djdt.jQuery);

‎debug_toolbar/static/debug_toolbar/js/toolbar.timer.js‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,14 +24,17 @@
2424
if (endStat) {
2525
// Render a start through end bar
2626
$row.html('<td>' + stat.replace('Start', '') + '</td>' +
27-
'<td class="timeline"><div class="djDebugTimeline"><div class="djDebugLineChart" style="left:' + getLeft(stat) + '%;"><strong style="width:' + getCSSWidth(stat, endStat) + ';">&nbsp;</strong></div></div></td>' +
27+
'<td class="timeline"><div class="djDebugTimeline"><div class="djDebugLineChart"><strong>&nbsp;</strong></div></div></td>' +
2828
'<td>' + (perf.timing[stat] - timingOffset) + ' (+' + (perf.timing[endStat] - perf.timing[stat]) + ')</td>');
29+
$row.find('strong').css({width: getCSSWidth(stat, endStat)});
2930
} else {
3031
// Render a point in time
3132
$row.html('<td>' + stat + '</td>' +
32-
'<td class="timeline"><div class="djDebugTimeline"><div class="djDebugLineChart" style="left:' + getLeft(stat) + '%;"><strong style="width:2px;">&nbsp;</strong></div></div></td>' +
33+
'<td class="timeline"><div class="djDebugTimeline"><div class="djDebugLineChart"><strong>&nbsp;</strong></div></div></td>' +
3334
'<td>' + (perf.timing[stat] - timingOffset) + '</td>');
35+
$row.find('strong').css({width: 2});
3436
}
37+
$row.find('djDebugLineChart').css({left: getLeft(stat) + '%'});
3538
$('#djDebugBrowserTimingTableBody').append($row);
3639
}
3740

‎debug_toolbar/templates/debug_toolbar/base.html‎

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
11
{% load i18n %}{% load static from staticfiles %}{% load url from compat %}
2-
<style type="text/css">
3-
@media print { #djDebug {display:none;}}
4-
</style>
2+
<link rel="stylesheet" href="{% static 'debug_toolbar/css/print.css' %}" type="text/css" media="print" />
53
<link rel="stylesheet" href="{% static 'debug_toolbar/css/toolbar.css' %}" type="text/css" />
64
{% if toolbar.config.JQUERY_URL %}
75
<!-- Prevent our copy of jQuery from registering as an AMD module on sites that use RequireJS. -->
@@ -12,10 +10,10 @@
1210
<script src="{% static 'debug_toolbar/js/jquery_existing.js' %}"></script>
1311
{% endif %}
1412
<script src="{% static 'debug_toolbar/js/toolbar.js' %}"></script>
15-
<div id="djDebug" style="display:none;" dir="ltr"
13+
<div id="djDebug" hidden dir="ltr"
1614
data-store-id="{{ toolbar.store_id }}" data-render-panel-url="{% url 'djdt:render_panel' %}"
1715
{{ toolbar.config.ROOT_TAG_EXTRA_ATTRS|safe }}>
18-
<div style="display:none;" id="djDebugToolbar">
16+
<div hidden id="djDebugToolbar">
1917
<ul id="djDebugPanelList">
2018
{% if toolbar.panels %}
2119
<li><a id="djHideToolBarButton" href="#" title="{% trans "Hide toolbar" %}">{% trans "Hide" %} &#187;</a></li>
@@ -45,7 +43,7 @@
4543
{% endfor %}
4644
</ul>
4745
</div>
48-
<div style="display:none;" id="djDebugToolbarHandle">
46+
<div hidden id="djDebugToolbarHandle">
4947
<span title="{% trans "Show toolbar" %}" id="djShowToolBarButton">&#171;</span>
5048
</div>
5149
{% for panel in toolbar.panels %}

‎debug_toolbar/templates/debug_toolbar/panels/cache.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@ <h4>{% trans "Calls" %}</h4>
5151
{% for call in calls %}
5252
<tr class="{% cycle 'djDebugOdd' 'djDebugEven' %}" id="cacheMain_{{ forloop.counter }}">
5353
<td class="djdt-toggle">
54-
<a class="djToggleSwitch" data-toggle-name="cacheMain" data-toggle-id="{{ forloop.counter }}" data-toggle-open="+" data-toggle-close="-" href="javascript:void(0)">+</a>
54+
<a class="djToggleSwitch" data-toggle-name="cacheMain" data-toggle-id="{{ forloop.counter }}" data-toggle-open="+" data-toggle-close="-" href>+</a>
5555
</td>
5656
<td>{{ call.time|floatformat:"4" }}</td>
5757
<td>{{ call.name|escape }}</td>

‎debug_toolbar/templates/debug_toolbar/panels/profiling.html‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -12,12 +12,11 @@
1212
</thead>
1313
<tbody>
1414
{% for call in func_list %}
15-
<!-- style="background:{{ call.background }}" -->
16-
<tr class="{% cycle 'djDebugOdd' 'djDebugEven' %} djDebugProfileRow{% for parent_id in call.parent_ids %} djToggleDetails_{{ parent_id }}{% endfor %}" depth="{{ call.depth }}">
15+
<tr class="djDebugProfileRow{% for parent_id in call.parent_ids %} djToggleDetails_{{ parent_id }}{% endfor %}" depth="{{ call.depth }}">
1716
<td>
18-
<div style="padding-left: {{ call.indent }}px;">
17+
<div data-padding-left="{{ call.indent }}px">
1918
{% if call.has_subfuncs %}
20-
<a class="djProfileToggleDetails djToggleSwitch" data-toggle-id="{{ call.id }}" data-toggle-open="+" data-toggle-close="-" href="javascript:void(0)">-</a>
19+
<a class="djProfileToggleDetails djToggleSwitch" data-toggle-id="{{ call.id }}" data-toggle-open="+" data-toggle-close="-" href>-</a>
2120
{% else %}
2221
<span class="djNoToggleSwitch"></span>
2322
{% endif %}

‎debug_toolbar/templates/debug_toolbar/panels/request.html‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ <h4>{% trans "View information" %}</h4>
2424
<h4>{% trans "Cookies" %}</h4>
2525
<table>
2626
<colgroup>
27-
<col style="width:20%"/>
27+
<col class="width-20"/>
2828
<col/>
2929
</colgroup>
3030
<thead>
@@ -50,7 +50,7 @@ <h4>{% trans "No cookies" %}</h4>
5050
<h4>{% trans "Session data" %}</h4>
5151
<table>
5252
<colgroup>
53-
<col style="width:20%"/>
53+
<col class="width-20"/>
5454
<col/>
5555
</colgroup>
5656
<thead>
@@ -76,7 +76,7 @@ <h4>{% trans "No session data" %}</h4>
7676
<h4>{% trans "GET data" %}</h4>
7777
<table>
7878
<colgroup>
79-
<col style="width:20%"/>
79+
<col class="width-20"/>
8080
<col/>
8181
</colgroup>
8282
<thead>
@@ -102,7 +102,7 @@ <h4>{% trans "No GET data" %}</h4>
102102
<h4>{% trans "POST data" %}</h4>
103103
<table>
104104
<colgroup>
105-
<col style="width:20%"/>
105+
<col class="width-20"/>
106106
<col/>
107107
</colgroup>
108108
<tr>

0 commit comments

Comments
 (0)