8000 Redesigned the log message filter · symfony/symfony@2271a3b · GitHub
[go: up one dir, main page]
Skip to content

Commit 2271a3b

Browse files
javiereguiluzjaviereguiluz
committed
Redesigned the log message filter
1 parent dd432c4 commit 2271a3b

File tree

2 files changed

+41
-5
lines changed

2 files changed

+41
-5
lines changed

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

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -694,6 +694,7 @@
694694
var bullet = document.createElement('li');
695695
bullet.innerText = level;
696696
bullet.setAttribute('data-log-level', String(i));
697+
bullet.setAttribute('title', 'Show logs of level ' + level + ' or higher');
697698
bullets.appendChild(bullet);
698699
addEventListener(bullet, 'click', function() {
699700
if (i === this.parentNode.querySelectorAll('.active').length - 1) {

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

Lines changed: 40 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -892,6 +892,9 @@ tr.status-warning td {
892892
background-color: var(--base-5);
893893
color: var(--base-2);
894894
}
895+
.tab-content {
896+
position: relative;
897+
}
895898
.tab-content > *:first-child {
896899
margin-top: 0;
897900
}
@@ -957,11 +960,43 @@ table.logs .metadata {
957960
}
958961
table.logs tr td:last-child { width: 100%; }
959962

960-
.log-levels { width: 100%; margin: 0; padding: 0; display: flex; align-items: center; list-style: none; }
961-
.log-levels li { width: 100%; padding: 3px; margin: 0; cursor: pointer; text-align: center; border: 2px dashed #e0e0e0; border-radius: 5px; color: #888; }
962-
.log-levels li + li { margin-left: 10px; }
963-
.log-levels li.active { background: #eee; color: #666; border-style: solid; border-width: 1px; padding: 4px; border-color: #aaa; }
964-
.log-levels li.last-active { cursor: not-allowed; }
963+
.log-levels { position: absolute; right: 5px; top: 33px; }
964+
.log-levels { border: var(--border); box-shadow: var(--shadow); margin: 0; padding: 0; display: flex; flex-direction: column; align-items: flex-end; }
965+
.log-levels:before {
966+
content: "Filter";
967+
cursor: pointer;
968+
/* "filter" icon provided by FontAwesome - CC BY 4.0 License
969+
https://github.com/FortAwesome/Font-Awesome/blob/master/LICENSE.txt */
970+
background: var(--table-background) no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="%23999" d="M487.976 0H24.028C2.71 0-8.047 25.866 7.058 40.971L192 225.941V432c0 7.831 3.821 15.17 10.237 19.662l80 55.98C298.02 518.69 320 507.493 320 487.98V225.941l184.947-184.97C520.021 25.896 509.338 0 487.976 0z" class=""></path></svg>');
971+
background-position: 6px 6px;
972+
background-size: 14px 14px;
973+
padding: 4px 10px 4px 24px;
974+
position: absolute;
975+
top: -28px;
976+
}
977+
.log-levels:hover li { display: inline-flex; }
978+
.log-levels li {
979+
background: var(--tab-disabled-background);
980+
border-bottom: var(--border);
981+
color: var(--tab-disabled-color);
982+
cursor: s-resize;
983+
display: none;
984+
list-style: none;
985+
margin: 0;
986+
padding: 5px 10px;
987+
text-align: left;
988+
width: 100%;
989+
}
990+
.log-levels li.active {
991+
background: var(--tab-background);
992+
color: var(--tab-color);
993+
cursor: n-resize;
994+
}
995+
.log-levels li.last-active {
996+
background: var(--tab-active-background);
997+
color: var(--tab-active-color);
998+
cursor: unset;
999+
}
9651000

9661001
{# Doctrine panel
9671002
========================================================================= #}

0 commit comments

Comments
 (0)
0