Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit c81478d

Browse files
committed
[WebProfilerBundle] Move panel specific styles to each panel
1 parent a826eb3 commit c81478d

File tree

14 files changed

+750
-716
lines changed

14 files changed

+750
-716
lines changed

src/Symfony/Bundle/SecurityBundle/Resources/views/Collector/security.html.twig

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,35 @@
22

33
{% block page_title 'Security' %}
44

5+
{% block head %}
6+
{{ parent() }}
7+
8+
<style>
9+
#collector-content .decision-log .voter_result td {
10+
border-top-width: 1px;
11+
border-bottom-width: 0;
12+
padding-bottom: 0;
13+
}
14+
15+
#collector-content .decision-log .voter_details td {
16+
border-top-width: 0;
17+
border-bottom-width: 1px;
18+
padding-bottom: 0;
19+
}
20+
21+
#collector-content .decision-log .voter_details table {
22+
border: 0;
23+
margin: 0;
24+
box-shadow: unset;
25+
}
26+
27+
#collector-content .decision-log .voter_details table td {
28+
border: 0;
29+
padding: 0 0 8px 0;
30+
}
31+
</style>
32+
{% endblock %}
33+
534
{% block toolbar %}
635
{% if collector.firewall %}
736
{% set icon %}

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

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,51 @@
11
{% extends '@WebProfiler/Profiler/layout.html.twig' %}
22

3+
{% block head %}
4+
{{ parent() }}
5+
6+
<style>
7+
.config-symfony-version-lts {
8+
border: 0;
9+
color: var(--color-muted);
10+
font-size: 21px;
11+
line-height: 33px;
12+
}
13+
.config-symfony-version-lts[title] {
14+
text-decoration: none;
15+
}
16+
.config-symfony-version-status-badge {
17+
background-color: var(--badge-background);
18+
border-radius: 4px;
19+
color: var(--badge-color);
20+
display: inline-block;
21+
font-size: 15px;
22+
font-weight: bold;
23+
margin: 10px 0 5px;
24+
padding: 3px 7px;
25+
white-space: nowrap;
26+
}
27+
.config-symfony-version-status-badge.status-success {
28+
background-color: var(--badge-success-background);
29+
color: var(--badge-success-color);
30+
}
31+
.config-symfony-version-status-badge.status-warning {
32+
background-color: var(--badge-warning-background);
33+
color: var(--badge-warning-color);
34+
}
35+
.config-symfony-version-status-badge.status-error {
36+
background-color: var(--badge-danger-background);
37+
color: var(--badge-danger-color);
38+
}
39+
.config-symfony-version-roadmap-link {
40+
display: inline-block;
41+
margin: 10px 5px 5px;
42+
}
43+
.config-symfony-eol {
44+
margin-top: 5px;
45+
}
46+
</style>
47+
{% endblock %}
48+
349
{% block toolbar %}
450
{% if 'unknown' == collector.symfonyState %}
551
{% set block_status = '' %}

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

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,27 @@
4343
{{ parent() }}
4444

4545
<style>
46+
.form-type-class {
47+
font-size: 14px;
48+
display: flex;
49+
margin: 0 0 15px;
50+
}
51+
.form-type-class-label {
52+
margin-right: 4px;
53+
}
54+
.form-type-class pre.sf-dump {
55+
font-family: var(--font-family-system) !important;
56+
font-size: 14px !important;
57+
margin-left: 5px;
58+
}
59+
.form-type-class .sf-dump .sf-dump-str {
60+
color: var(--color-link) !important;
61+
text-decoration: underline;
62+
}
63+
.form-type-class .sf-dump .sf-dump-str:hover {
64+
text-decoration: none;
65+
}
66+
4667
#tree-menu {
4768
float: left;
4869
padding-right: 10px;

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

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,41 @@
11
{% extends '@WebProfiler/Profiler/layout.html.twig' %}
22

3+
{% block head %}
4+
{{ parent() }}
5+
6+
<style>
7+
.sf-profiler-httpclient-requests thead th {
8+
vertical-align: top;
9+
}
10+
.sf-profiler-httpclient-requests .http-method {
11+
border: 1px solid var(--header-status-request-method-color);
12+
border-radius: 5px;
13+
color: var(--header-status-request-method-color);
14+
display: inline-block;
15+
font-weight: 500;
16+
line-height: 1;
17+
margin-right: 6px;
18+
padding: 2px 4px;
19+
text-align: center;
20+
white-space: nowrap;
21+
}
22+
.sf-profiler-httpclient-requests .status-response-status-code {
23+
background: var(--gray-600);
24+
border-radius: 4px;
25+
color: var(--white);
26+
display: inline-block;
27+
font-size: 12px;
28+
font-weight: bold;
29+
margin-bottom: 2px;
30+
padding: 1px 3px;
31+
}
32+
.sf-profiler-httpclient-requests .status-response-status-code.status-success { background: var(--header-success-status-code-background); color: var(--header-success-status-code-color); }
33+
.sf-profiler-httpclient-requests .status-response-status-code.status-warning { background: var(--header-warning-status-code-background); color: var(--header-warning-status-code-color); }
34+
.sf-profiler-httpclient-requests .status-response-status-code.status-error { background: var(--header-error-status-code-background); color: var(--header-error-status-code-color); }
35+
</style>
36+
{% endblock %}
37+
38+
339
{% block toolbar %}
440
{% if collector.requestCount %}
541
{% set icon %}

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

Lines changed: 215 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,221 @@
22

33
{% import _self as helper %}
44

5+
{% block head %}
6+
{{ parent() }}
7+
8+
<style>
9+
:root {
10+
--log-filter-active-num-color: #2563EB;
11+
--log-timestamp-color: #555;
12+
}
13+
.theme-dark {
14+
--log-filter-active-num-color: #2563EB;
15+
--log-timestamp-color: #ccc;
16+
}
17+
18+
.log-filters {
19+
display: flex;
20+
flex-wrap: wrap;
21+
}
22+
.log-filters .log-filter {
23+
flex-shrink: 0;
24+
margin-right: 15px;
25+
position: relative;
26+
}
27+
.log-filters .log-filter summary {
28+
align-items: center;
29+
background: var(--button-background);
30+
border-radius: 6px;
31+
border: 1px solid var(--button-border-color);
32+
box-shadow: var(--button-box-shadow);
33+
color: var(--button-color);
34+
cursor: pointer;
35+
display: flex;
36+
font-size: 13px;
37+
font-weight: 500;
38+
padding: 4px 8px;
39+
white-space: nowrap;
40+
}
41+
.log-filters .log-filter summary:active {
42+
box-shadow: none;
43+
transform: translateY(1px);
44+
}
45+
.log-filters .log-filter summary .icon {
46+
height: 18px;mai
47+
width: 18px;
48+
margin: 0 7px 0 0;
49+
}
50+
.log-filters .log-filter summary svg {
51+
height: 18px;
52+
width: 18px;
53+
opacity: 0.7;
54+
}
55+
.log-filters .log-filter summary svg {
56+
stroke-width: 2;
57+
}
58+
.log-filters .log-filter summary .filter-active-num {
59+
color: var(--log-filter-active-num-color);
60+
font-weight: bold;
61+
padding: 0 1px;
62+
}
63+
.log-filter .tab-navigation li input {
64+
display: none;
65+
}
66+
.log-filter .tab-navigation li label {
67+
cursor: pointer;
68+
}
69+
.log-filters .log-filter .log-filter-content {
70+
background: var(--base-0);
71+
border: 1px solid var(--table-border-color);
72+
border-radius: 6px;
73+
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
74+
padding: 15px;
75+
position: absolute;
76+
left: 0;
77+
top: 32px;
78+
max-width: 400px;
79+
min-width: 200px;
80+
z-index: 9999;
81+
}
82+
.log-filters .log-filter .log-filter-content .log-filter-option {
83+
align-items: center;
84+
display: flex;
85+
}
86+
.log-filter .filter-select-all-or-none {
87+
margin-bottom: 10px;
88+
}
89+
.log-filter .filter-select-all-or-none button + button {
90+
margin-left: 15px;
91+
}
92+
.log-filters .log-filter .log-filter-content .log-filter-option + .log-filter-option {
93+
margin: 7px 0 0;
94+
}
95+
.log-filters .log-filter .log-filter-content .log-filter-option label {
96+
cursor: pointer;
97+
flex: 1;
98+
padding-left: 10px;
99+
}
100+
101+
table.logs {
102+
border-bottom-width: 0;
103+
border-collapse: collapse;
104+
}
105+
table.logs tr + tr td {
106+
border-width: 1px 0 0;
107+
}
108+
table.logs .metadata {
109+
display: block;
110+
font-size: 12px;
111+
}
112+
.theme-dark tr.status-error td,
113+
.theme-dark tr.status-warning td { border-bottom: unset; border-top: unset; }
114+
115+
table.logs .log-timestamp {
116+
color: var(--log-timestamp-color);
117+
}
118+
table.logs .log-metadata {
119+
margin: 8px 0 0;
120+
}
121+
table.logs .log-metadata > span {
122+
display: inline-block;
123+
}
124+
table.logs .log-metadata > span + span {
125+
margin-left: 10px;
126+
}
127+
table.logs .log-metadata .log-channel {
128+
color: var(--base-1);
129+
font-size: 13px;
130+
font-weight: bold;
131+
}
132+
table.logs .log-metadata .badge {
133+
background: var(--badge-light-background);
134+
color: var(--badge-light-color);
135+
}
136+
table.logs .log-metadata .log-num-occurrences {
137+
color: var(--color-muted);
138+
font-size: 13px;
139+
}
140+
table.logs .log-metadata .context {
141+
background: var(--code-block-background);
142+
border-radius: 4px;
143+
padding: 5px;
144+
}
145+
table.logs .log-metadata .context + .context {
146+
margin-top: 10px;
147+
}
148+
.log-type-badge {
149+
background: var(--badge-light-background);
150+
box-shadow: none;
151+
color: var(--badge-light-color);
152+
display: inline-block;
153+
font-family: var(--font-family-system);
154+
margin-top: 5px;
155+
}
156+
.log-type-badge.badge-deprecation,
157+
.log-type-badge.badge-warning {
158+
background: var(--badge-warning-background);
159+
color: var(--badge-warning-color);
160+
}
161+
.log-type-badge.badge-error {
162+
background: var(--badge-danger-background);
163+
color: var(--badge-danger-color);
164+
}
165+
.log-type-badge.badge-silenced {
166+
background: #EDE9FE;
167+
color: #6D28D9;
168+
}
169+
.theme-dark .log-type-badge.badge-silenced {
170+
background: #5B21B6;
171+
color: #EDE9FE;
172+
}
173+
174+
tr.log-status-warning > td:first-child,
175+
tr.log-status-error > td:first-child,
176+
tr.log-status-silenced > td:first-child {
177+
position: relative;
178+
}
179+
tr.log-status-warning > td:first-child:before,
180+
tr.log-status-error > td:first-child:before,
181+
tr.log-status-silenced > td:first-child:before {
182+
background: transparent;
183+
border-radius: 0;
184+
content: '';
185+
position: absolute;
186+
top: 0;
187+
left: 0;
188+
width: 4px;
189+
height: 100%;
190+
}
191+
tr.log-status-warning > td:first-child:before {
192+
background: var(--yellow-400);
193+
}
194+
tr.log-status-error > td:first-child:before {
195+
background: var(--red-400);
196+
}
197+
tr.log-status-silenced > td:first-child:before {
198+
background: #a78bfa;
199+
}
200+
201+
.container-compilation-logs {
202+
background: var(--table-background);
203+
border: 1px solid var(--base-2);
204+
border-radius: 6px;
205+
margin-top: 30px;
206+
padding: 15px;
207+
}
208+
.container-compilation-logs summary {
209+
cursor: pointer;
210+
}
211+
.container-compilation-logs summary h4 {
212+
margin: 0 0 5px;
213+
}
214+
.container-compilation-logs summary p {
215+
margin: 0;
216+
}
217+
</style>
218+
{% endblock %}
219+
5220
{% block toolbar %}
6221
{% if collector.counterrors or collector.countdeprecations or collector.countwarnings %}
7222
{% set icon %}

0 commit comments

Comments
 (0)