8000 bug #46565 [WebProfilerBundle] Fix dark theme selected line highlight… · symfony/symfony@573d3ea · GitHub
[go: up one dir, main page]

Skip to content

Commit 573d3ea

Browse files
committed
bug #46565 [WebProfilerBundle] Fix dark theme selected line highlight color & reuse css vars (ogizanagi)
This PR was merged into the 4.4 branch. Discussion ---------- [WebProfilerBundle] Fix dark theme selected line highlight color & reuse css vars | Q | A | ------------- | --- | Branch? | 4.4 <!-- see below --> | Bug fix? | yes | New feature? | no <!-- please update src/**/CHANGELOG.md files --> | Deprecations? | no <!-- please update UPGRADE-*.md and src/**/CHANGELOG.md files --> | Tickets | N/A | License | MIT | Doc PR | N/A When using the profiler with a dark theme, the Messenger panel was missing using the dedicated vars and was still using a light bg: ![Capture d’écran 2022-06-03 à 09 56 42](https://user-images.githubusercontent.com/2211145/171813241-7494009d-d4c2-4f8e-bafa-5bea6ceafb33.png) and the selected lines on file excerpts (for any panel) are not contrasted enough: ![Capture d’écran 2022-06-03 à 09 56 57](https://user-images.githubusercontent.com/2211145/171813271-5ca66891-989b-4e97-98a7-0dd4c24fd0b4.png) I suggest using a more contrasted highlight color for selected lines: ![Capture d’écran 2022-06-03 à 09 56 07](https://user-images.githubusercontent.com/2211145/171813357-4bac1e45-d1fa-4aaa-b7b2-0e17978f63e3.png) Commits ------- 5514bdf [WebProfilerBundle] Fix dark theme selected line highlight color & reuse css vars
2 parents 03bccf1 + 5514bdf commit 573d3ea

File tree

1 file changed

+6
-4
lines changed

1 file changed

+6
-4
lines changed

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

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@
3939
--highlight-default: #222222;
4040
--highlight-keyword: #a71d5d;
4141
--highlight-string: #183691;
42+
--highlight-selected-line: rgba(255, 255, 153, 0.5);
4243
--base-0: #fff;
4344
--base-1: #f5f5f5;
4445
--base-2: #e0e0e0;
@@ -80,6 +81,7 @@
8081
--highlight-default: var(--base-6);
8182
--highlight-keyword: #ff413c;
8283
--highlight-string: #70a6fd;
84+
--highlight-selected-line: rgba(14, 14, 14, 0.5);
8385
--base-0: #2e3136;
8486
--base-1: #444;
8587
--base-2: #666;
@@ -1091,15 +1093,15 @@ table.logs .metadata {
10911093
padding: 0;
10921094
}
10931095
#collector-content .sf-validator .trace li.selected {
1094-
background: rgba(255, 255, 153, 0.5);
1096+
background: var(--highlight-selected-line);
10951097
}
10961098

10971099
{# Messenger panel
10981100
========================================================================= #}
10991101

11001102
#collector-content .message-bus .trace {
1101-
border: 1px solid #DDD;
1102-
background: #FFF;
1103+
border: var(--border);
1104+
background: var(--base-0);
11031105
padding: 10px;
11041106
margin: 0.5em 0;
11051107
overflow: auto;
@@ -1112,7 +1114,7 @@ table.logs .metadata {
11121114
padding: 0;
11131115
}
11141116
#collector-content .message-bus .trace li.selected {
1115-
background: rgba(255, 255, 153, 0.5);
1117+
background: var(--highlight-selected-line);
11161118
}
11171119

11181120
{# Dump panel

0 commit comments

Comments
 (0)
0