bug #23274 Display a better error design when the toolbar cannot be displayed (yceruto)
This PR was squashed before being merged into the 2.7 branch (closes #23274).
Discussion
----------
Display a better error design when the toolbar cannot be displayed
| Q | A
| ------------- | ---
| Branch? | 2.7
| Bug fix? | yes
| New feature? | no
| BC breaks? | no
| Deprecations? | no
| Tests pass? | yes (failure unrelated)
| Fixed tickets | https://github.com/symfony/symfony/pull/23266
| License | MIT
| Doc PR | n/a
Fixing the left position of the bar (tested in app without style) and escaping the literal newline (ES5) as some IDEs fails with previous syntax (and Github diff too). Btw, I have added the Symfony icon to make clear that this message comes from Symfony ;)
**Before:**
![current_toolbar_error](https://user-images.githubusercontent.com/2028198/27466735-cd5f0da8-57aa-11e7-8431-3025c41557e6.png)
**After:**
![after_toolbar_27](https://user-images.githubusercontent.com/2028198/27467928-75e45d4e-57b4-11e7-9e1f-e252d9085596.png)
Commits
-------
ed3e403b4b
Display a better error design when the toolbar cannot be displayed
This commit is contained in:
commit
64ea580eae
@ -440,3 +440,33 @@
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
/***** Error Toolbar *****/
|
||||
.sf-error-toolbar .sf-toolbarreset {
|
||||
background: #222;
|
||||
color: #f5f5f5;
|
||||
font: 13px/36px Arial, sans-serif;
|
||||
height: 36px;
|
||||
padding: 0 15px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.sf-error-toolbar .sf-toolbarreset svg {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.sf-error-toolbar .sf-toolbarreset a {
|
||||
color: #99cdd8;
|
||||
margin-left: 5px;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.sf-error-toolbar .sf-toolbarreset a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.sf-error-toolbar .sf-toolbarreset .sf-toolbar-icon {
|
||||
float: left;
|
||||
padding: 5px 0;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
@ -57,17 +57,15 @@
|
||||
}
|
||||
},
|
||||
function(xhr) {
|
||||
var errorToolbarHtml = '
|
||||
<style>
|
||||
.sfErrorToolbar { background: #222; bottom: 0; color: #f5f5f5; font: 13px/36px Arial, sans-serif; height: 36px; padding: 0 15px; position: fixed; width: 100%; }
|
||||
.sfErrorToolbar a { color: #99cdd8; margin-left: 5px; text-decoration: underline; }
|
||||
.sfErrorToolbar a:hover { text-decoration: none; }
|
||||
</style>
|
||||
<div class="sfErrorToolbar">An error occurred while loading the web debug toolbar. <a href="{{ path("_profiler", { "token": token }) }}">Open the web profiler.</a></div>
|
||||
';
|
||||
|
||||
if (xhr.status !== 0) {
|
||||
window.document.body.insertAdjacentHTML('beforeend', errorToolbarHtml);
|
||||
var sfwdt = document.getElementById('sfwdt{{ token }}');
|
||||
sfwdt.innerHTML = '\
|
||||
<div class="sf-toolbarreset">\
|
||||
<div class="sf-toolbar-icon"><svg width="26" height="28" xmlns="http://www.w3.org/2000/svg" version="1.1" x="0px" y="0px" viewBox="0 0 26 28" enable-background="new 0 0 26 28" xml:space="preserve"><path fill="#FFFFFF" d="M13 0C5.8 0 0 5.8 0 13c0 7.2 5.8 13 13 13c7.2 0 13-5.8 13-13C26 5.8 20.2 0 13 0z M20 7.5 c-0.6 0-1-0.3-1-0.9c0-0.2 0-0.4 0.2-0.6c0.1-0.3 0.2-0.3 0.2-0.4c0-0.3-0.5-0.4-0.7-0.4c-2 0.1-2.5 2.7-2.9 4.8l-0.2 1.1 c1.1 0.2 1.9 0 2.4-0.3c0.6-0.4-0.2-0.8-0.1-1.3C18 9.2 18.4 9 18.7 8.9c0.5 0 0.8 0.5 0.8 1c0 0.8-1.1 2-3.3 1.9 c-0.3 0-0.5 0-0.7-0.1L15 14.1c-0.4 1.7-0.9 4.1-2.6 6.2c-1.5 1.8-3.1 2.1-3.8 2.1c-1.3 0-2.1-0.6-2.2-1.6c0-0.9 0.8-1.4 1.3-1.4 c0.7 0 1.2 0.5 1.2 1.1c0 0.5-0.2 0.6-0.4 0.7c-0.1 0.1-0.3 0.2-0.3 0.4c0 0.1 0.1 0.3 0.4 0.3c0.5 0 0.9-0.3 1.2-0.5 c1.3-1 1.7-2.9 2.4-6.2l0.1-0.8c0.2-1.1 0.5-2.3 0.8-3.5c-0.9-0.7-1.4-1.5-2.6-1.8c-0.8-0.2-1.3 0-1.7 0.4C8.4 10 8.6 10.7 9 11.1 l0.7 0.7c0.8 0.9 1.3 1.7 1.1 2.7c-0.3 1.6-2.1 2.8-4.3 2.1c-1.9-0.6-2.2-1.9-2-2.7c0.2-0.6 0.7-0.8 1.2-0.6 c0.5 0.2 0.7 0.8 0.6 1.3c0 0.1 0 0.1-0.1 0.3C6 15 5.9 15.2 5.9 15.3c-0.1 0.4 0.4 0.7 0.8 0.8c0.8 0.3 1.7-0.2 1.9-0.9 c0.2-0.6-0.2-1.1-0.4-1.2l-0.8-0.9c-0.4-0.4-1.2-1.5-0.8-2.8c0.2-0.5 0.5-1 0.9-1.4c1-0.7 2-0.8 3-0.6c1.3 0.4 1.9 1.2 2.8 1.9 c0.5-1.3 1.1-2.6 2-3.8c0.9-1 2-1.7 3.3-1.8C20 4.8 21 5.4 21 6.3C21 6.7 20.8 7.5 20 7.5z"/></svg></div>\
|
||||
An error occurred while loading the web debug toolbar. <a href="{{ path("_profiler", { "token": token }) }}">Open the web profiler.</a>\
|
||||
</div>\
|
||||
';
|
||||
sfwdt.setAttribute('class', 'sf-toolbar sf-error-toolbar');
|
||||
}
|
||||
},
|
||||
{'maxTries': 5}
|
||||
|
Reference in New Issue
Block a user