mirror of
https://github.com/elastic/kibana.git
synced 2025-04-24 17:59:23 -04:00
[APM] Add section titles to span detail modal (#20717)
* Adding fontSize from variables * SectionHeader style added * Adding section headers Needed titling for DB statement and Stacktrace on the page * Pluralization * Adding fontSize variable * Creating new header title style * Moving title into Stacktrace container * Updated snapshots
This commit is contained in:
parent
b142f80d7d
commit
ecefab55e6
4 changed files with 183 additions and 154 deletions
|
@ -64,6 +64,11 @@ exports[`DetailView should render with data 1`] = `
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
.c14 {
|
||||
margin: 24px 0;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.c11 {
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
|
@ -89,12 +94,12 @@ exports[`DetailView should render with data 1`] = `
|
|||
user-select: none;
|
||||
}
|
||||
|
||||
.c18 {
|
||||
.c19 {
|
||||
position: relative;
|
||||
border-radius: 0 0 5px 5px;
|
||||
}
|
||||
|
||||
.c19 {
|
||||
.c20 {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 18px;
|
||||
|
@ -103,7 +108,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
background-color: #FCF2E6;
|
||||
}
|
||||
|
||||
.c20 {
|
||||
.c21 {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
@ -111,21 +116,6 @@ exports[`DetailView should render with data 1`] = `
|
|||
background: #f5f5f5;
|
||||
}
|
||||
|
||||
.c21 {
|
||||
position: relative;
|
||||
min-width: 42px;
|
||||
padding-left: 8px;
|
||||
padding-right: 4px;
|
||||
color: #999999;
|
||||
line-height: 18px;
|
||||
text-align: right;
|
||||
border-right: 1px solid #d9d9d9;
|
||||
}
|
||||
|
||||
.c21:last-of-type {
|
||||
border-radius: 0 0 0 5px;
|
||||
}
|
||||
|
||||
.c22 {
|
||||
position: relative;
|
||||
min-width: 42px;
|
||||
|
@ -135,7 +125,6 @@ exports[`DetailView should render with data 1`] = `
|
|||
line-height: 18px;
|
||||
text-align: right;
|
||||
border-right: 1px solid #d9d9d9;
|
||||
background-color: #FCF2E6;
|
||||
}
|
||||
|
||||
.c22:last-of-type {
|
||||
|
@ -143,17 +132,33 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
|
||||
.c23 {
|
||||
position: relative;
|
||||
min-width: 42px;
|
||||
padding-left: 8px;
|
||||
padding-right: 4px;
|
||||
color: #999999;
|
||||
line-height: 18px;
|
||||
text-align: right;
|
||||
border-right: 1px solid #d9d9d9;
|
||||
background-color: #FCF2E6;
|
||||
}
|
||||
|
||||
.c23:last-of-type {
|
||||
border-radius: 0 0 0 5px;
|
||||
}
|
||||
|
||||
.c24 {
|
||||
overflow: auto;
|
||||
margin: 0 0 0 42px;
|
||||
padding: 0;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.c23:last-of-type {
|
||||
.c24:last-of-type {
|
||||
border-radius: 0 0 5px 0;
|
||||
}
|
||||
|
||||
.c24 {
|
||||
.c25 {
|
||||
margin: 0;
|
||||
color: inherit;
|
||||
background: inherit;
|
||||
|
@ -164,7 +169,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
line-height: 18px;
|
||||
}
|
||||
|
||||
.c25 {
|
||||
.c26 {
|
||||
position: relative;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
@ -172,18 +177,18 @@ exports[`DetailView should render with data 1`] = `
|
|||
z-index: 2;
|
||||
}
|
||||
|
||||
.c15 {
|
||||
.c16 {
|
||||
color: #999999;
|
||||
padding: 8px;
|
||||
border-bottom: 1px solid #d9d9d9;
|
||||
border-radius: 5px 5px 0 0;
|
||||
}
|
||||
|
||||
.c17 {
|
||||
.c18 {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.c14 {
|
||||
.c15 {
|
||||
margin: 0 0 24px 0;
|
||||
position: relative;
|
||||
font-family: "SFMono-Regular",Consolas,"Liberation Mono",Menlo,Courier,monospace;
|
||||
|
@ -192,11 +197,11 @@ exports[`DetailView should render with data 1`] = `
|
|||
background: #f5f5f5;
|
||||
}
|
||||
|
||||
.c14 .c16 {
|
||||
.c15 .c17 {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.c26 {
|
||||
.c27 {
|
||||
margin: 0 0 24px 0;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
|
@ -500,138 +505,143 @@ exports[`DetailView should render with data 1`] = `
|
|||
className="c13"
|
||||
>
|
||||
<div>
|
||||
<div
|
||||
<h4
|
||||
className="c14"
|
||||
>
|
||||
Stacktraces
|
||||
</h4>
|
||||
<div
|
||||
className="c15"
|
||||
>
|
||||
<div
|
||||
className="c15"
|
||||
className="c16"
|
||||
>
|
||||
<span
|
||||
className="c16 c17"
|
||||
className="c17 c18"
|
||||
>
|
||||
server/coffee.js
|
||||
</span>
|
||||
in
|
||||
|
||||
<span
|
||||
className="c16 c17"
|
||||
className="c17 c18"
|
||||
>
|
||||
<anonymous>
|
||||
</span>
|
||||
at
|
||||
|
||||
<span
|
||||
className="c16 c17"
|
||||
className="c17 c18"
|
||||
>
|
||||
line
|
||||
9
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
className="c18"
|
||||
className="c19"
|
||||
>
|
||||
<div
|
||||
className="c19"
|
||||
className="c20"
|
||||
/>
|
||||
<div
|
||||
className="c20"
|
||||
className="c21"
|
||||
>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
2
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
3
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
4
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
5
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
6
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
7
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
8
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c22"
|
||||
className="c23"
|
||||
>
|
||||
9
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
10
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
11
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
12
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
13
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
14
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
15
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
16
|
||||
.
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="c23"
|
||||
className="c24"
|
||||
>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -643,14 +653,14 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
|
||||
|
||||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -662,7 +672,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
<span
|
||||
style={
|
||||
|
@ -697,7 +707,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -709,7 +719,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
<span
|
||||
style={
|
||||
|
@ -744,7 +754,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -756,14 +766,14 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
|
||||
|
||||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -775,7 +785,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
<span
|
||||
style={
|
||||
|
@ -810,7 +820,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -822,14 +832,14 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
|
||||
|
||||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -841,7 +851,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
app.get(
|
||||
<span
|
||||
|
@ -882,7 +892,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -894,7 +904,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
|
||||
<span
|
||||
|
@ -920,7 +930,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -932,7 +942,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
res.send(
|
||||
<span
|
||||
|
@ -948,7 +958,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -960,7 +970,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
}
|
||||
<span
|
||||
|
@ -976,7 +986,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -988,7 +998,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
res.send(
|
||||
<span
|
||||
|
@ -1004,7 +1014,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1016,13 +1026,13 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
}
|
||||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1034,13 +1044,13 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
})
|
||||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1052,14 +1062,14 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
|
||||
|
||||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1071,7 +1081,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
app.get(
|
||||
<span
|
||||
|
@ -1116,7 +1126,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</div>
|
||||
<div>
|
||||
<div
|
||||
className="c26"
|
||||
className="c27"
|
||||
>
|
||||
<button
|
||||
className="euiLink euiLink--primary"
|
||||
|
@ -1143,137 +1153,137 @@ exports[`DetailView should render with data 1`] = `
|
|||
/>
|
||||
</div>
|
||||
<div
|
||||
className="c14"
|
||||
className="c15"
|
||||
>
|
||||
<div
|
||||
className="c15"
|
||||
className="c16"
|
||||
>
|
||||
<span
|
||||
className="c16 c17"
|
||||
className="c17 c18"
|
||||
>
|
||||
server.js
|
||||
</span>
|
||||
in
|
||||
|
||||
<span
|
||||
className="c16 c17"
|
||||
className="c17 c18"
|
||||
>
|
||||
<anonymous>
|
||||
</span>
|
||||
at
|
||||
|
||||
<span
|
||||
className="c16 c17"
|
||||
className="c17 c18"
|
||||
>
|
||||
line
|
||||
27
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
className="c18"
|
||||
className="c19"
|
||||
>
|
||||
<div
|
||||
className="c19"
|
||||
className="c20"
|
||||
/>
|
||||
<div
|
||||
className="c20"
|
||||
className="c21"
|
||||
>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
20
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
21
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
22
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
23
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
24
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
25
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
26
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c22"
|
||||
className="c23"
|
||||
>
|
||||
27
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
28
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
29
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
30
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
31
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
32
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
33
|
||||
.
|
||||
</div>
|
||||
<div
|
||||
className="c21"
|
||||
className="c22"
|
||||
>
|
||||
34
|
||||
.
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="c23"
|
||||
className="c24"
|
||||
>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1285,7 +1295,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
app.use(
|
||||
<span
|
||||
|
@ -1311,7 +1321,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1323,7 +1333,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
app.use(express.static(
|
||||
<span
|
||||
|
@ -1339,7 +1349,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1351,7 +1361,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
app.use(
|
||||
<span
|
||||
|
@ -1382,7 +1392,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1394,7 +1404,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
apm.setTag(
|
||||
<span
|
||||
|
@ -1420,7 +1430,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1432,7 +1442,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
apm.setTag(
|
||||
<span
|
||||
|
@ -1458,7 +1468,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1470,7 +1480,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
apm.setTag(
|
||||
<span
|
||||
|
@ -1496,7 +1506,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1508,7 +1518,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
apm.setTag(
|
||||
<span
|
||||
|
@ -1534,7 +1544,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1546,13 +1556,13 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
next()
|
||||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1564,13 +1574,13 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
})
|
||||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1582,14 +1592,14 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
|
||||
|
||||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1601,7 +1611,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
app.use(
|
||||
<span
|
||||
|
@ -1627,7 +1637,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1639,7 +1649,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
app.use(
|
||||
<span
|
||||
|
@ -1675,7 +1685,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1687,7 +1697,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
app.get(
|
||||
<span
|
||||
|
@ -1728,7 +1738,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1740,7 +1750,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
res.sendFile(path.resolve(__dirname,
|
||||
<span
|
||||
|
@ -1766,7 +1776,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</code>
|
||||
</pre>
|
||||
<pre
|
||||
className="c24"
|
||||
className="c25"
|
||||
style={
|
||||
Object {
|
||||
"background": "#fff",
|
||||
|
@ -1778,7 +1788,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
}
|
||||
>
|
||||
<code
|
||||
className="c25"
|
||||
className="c26"
|
||||
>
|
||||
})
|
||||
</code>
|
||||
|
@ -1788,7 +1798,7 @@ exports[`DetailView should render with data 1`] = `
|
|||
</div>
|
||||
<div>
|
||||
<div
|
||||
className="c26"
|
||||
className="c27"
|
||||
>
|
||||
<button
|
||||
className="euiLink euiLink--primary"
|
||||
|
|
|
@ -38,6 +38,7 @@ import SyntaxHighlighter, {
|
|||
import { xcode } from 'react-syntax-highlighter/dist/styles';
|
||||
|
||||
import sql from 'react-syntax-highlighter/dist/languages/sql';
|
||||
import { HeaderXSmall } from '../../../../../shared/UIComponents';
|
||||
|
||||
registerLanguage('sql', sql);
|
||||
|
||||
|
@ -174,22 +175,25 @@ function DatabaseContext({ dbContext }) {
|
|||
}
|
||||
|
||||
return (
|
||||
<DatabaseStatement>
|
||||
<SyntaxHighlighter
|
||||
language={'sql'}
|
||||
style={xcode}
|
||||
customStyle={{
|
||||
color: null,
|
||||
background: null,
|
||||
padding: null,
|
||||
lineHeight: px(unit * 1.5),
|
||||
whiteSpace: 'pre-wrap',
|
||||
overflowX: 'scroll'
|
||||
}}
|
||||
>
|
||||
{dbContext.statement}
|
||||
</SyntaxHighlighter>
|
||||
</DatabaseStatement>
|
||||
<div>
|
||||
<HeaderXSmall>DB Statement</HeaderXSmall>
|
||||
<DatabaseStatement>
|
||||
<SyntaxHighlighter
|
||||
language={'sql'}
|
||||
style={xcode}
|
||||
customStyle={{
|
||||
color: null,
|
||||
background: null,
|
||||
padding: null,
|
||||
lineHeight: px(unit * 1.5),
|
||||
whiteSpace: 'pre-wrap',
|
||||
overflowX: 'scroll'
|
||||
}}
|
||||
>
|
||||
{dbContext.statement}
|
||||
</SyntaxHighlighter>
|
||||
</DatabaseStatement>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
|
|
@ -12,6 +12,7 @@ import { Ellipsis } from '../../shared/Icons';
|
|||
import { units, px } from '../../../style/variables';
|
||||
import EmptyMessage from '../../shared/EmptyMessage';
|
||||
import { EuiLink } from '@elastic/eui';
|
||||
import { HeaderXSmall } from '../UIComponents';
|
||||
|
||||
const LibraryFrameToggle = styled.div`
|
||||
margin: 0 0 ${px(units.plus)} 0;
|
||||
|
@ -74,6 +75,7 @@ class Stacktrace extends PureComponent {
|
|||
|
||||
return (
|
||||
<div>
|
||||
<HeaderXSmall>Stacktraces</HeaderXSmall>
|
||||
{getCollapsedLibraryFrames(stackframes).map((item, i) => {
|
||||
if (!item.libraryFrame) {
|
||||
return (
|
||||
|
|
|
@ -5,7 +5,14 @@
|
|||
*/
|
||||
|
||||
import styled from 'styled-components';
|
||||
import { unit, units, px, fontSizes, colors } from '../../style/variables';
|
||||
import {
|
||||
unit,
|
||||
units,
|
||||
px,
|
||||
fontSizes,
|
||||
colors,
|
||||
fontSize
|
||||
} from '../../style/variables';
|
||||
import { RelativeLink } from '../../utils/url';
|
||||
|
||||
export const HeaderContainer = styled.div`
|
||||
|
@ -40,6 +47,12 @@ export const HeaderSmall = styled.h3`
|
|||
${props => props.css};
|
||||
`;
|
||||
|
||||
export const HeaderXSmall = styled.h4`
|
||||
margin: ${px(units.plus)} 0;
|
||||
font-size: ${fontSize};
|
||||
${props => props.css};
|
||||
`;
|
||||
|
||||
export const Tab = styled.div`
|
||||
display: inline-block;
|
||||
font-size: ${fontSizes.large};
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue