rack-mini-profiler 1.0.2 → 1.1.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,545 +1,619 @@
1
1
  @mixin box-shadow($dx, $dy, $radius, $color) {
2
- -moz-box-shadow: $dx $dy $radius $color;
3
- -webkit-box-shadow: $dx $dy $radius $color;
4
- box-shadow: $dx $dy $radius $color;
2
+ -moz-box-shadow: $dx $dy $radius $color;
3
+ -webkit-box-shadow: $dx $dy $radius $color;
4
+ box-shadow: $dx $dy $radius $color;
5
5
  }
6
6
 
7
- $anchorColor: #0077CC;
7
+ $anchorColor: #0077cc;
8
8
  $buttonBorderColor: #888;
9
9
  $numberColor: #111;
10
10
  $textColor: #555;
11
11
  $mutedColor: #767676;
12
12
  $normalFonts: Helvetica, Arial, sans-serif;
13
13
  $codeFonts: Consolas, monospace, serif;
14
- $zindex:2147483640; // near 32bit max 2147483647
14
+ $zindex: 2147483640; // near 32bit max 2147483647
15
15
 
16
16
  // do some resets
17
- .profiler-result, .profiler-queries {
18
- color:#555;
19
- line-height:1;
20
- font-size:12px;
21
-
22
- pre, code, label, table, tbody, thead, tfoot, tr, th, td {
23
- margin:0;
24
- padding:0;
25
- border:0;
26
- font-size:100%;
27
- font:inherit;
28
- vertical-align:baseline;
29
- background-color:transparent;
30
- overflow:visible;
31
- max-height:none;
32
- }
33
- table {
34
- border-collapse:collapse;
35
- border-spacing:0;
36
- }
37
- a, a:hover {
38
- cursor:pointer;
39
- color:$anchorColor;
40
- }
41
- a {
42
- text-decoration:none;
43
- &:hover {
44
- text-decoration:underline;
45
- }
17
+ .profiler-result,
18
+ .profiler-queries {
19
+ color: #555;
20
+ line-height: 1;
21
+ font-size: 12px;
22
+
23
+ pre,
24
+ code,
25
+ label,
26
+ table,
27
+ tbody,
28
+ thead,
29
+ tfoot,
30
+ tr,
31
+ th,
32
+ td {
33
+ margin: 0;
34
+ padding: 0;
35
+ border: 0;
36
+ font-size: 100%;
37
+ font: inherit;
38
+ vertical-align: baseline;
39
+ background-color: transparent;
40
+ overflow: visible;
41
+ max-height: none;
42
+ }
43
+ table {
44
+ border-collapse: collapse;
45
+ border-spacing: 0;
46
+ }
47
+ a,
48
+ a:hover {
49
+ cursor: pointer;
50
+ color: $anchorColor;
51
+ }
52
+ a {
53
+ text-decoration: none;
54
+ &:hover {
55
+ text-decoration: underline;
46
56
  }
57
+ }
47
58
  }
48
59
 
49
60
  // styles shared between popup view and full view
50
- .profiler-result
51
- {
52
-
53
- .profiler-toggle-duration-with-children
54
- {
55
- float: right;
61
+ .profiler-result {
62
+ .profiler-toggle-duration-with-children {
63
+ float: right;
64
+ }
65
+ table.profiler-client-timings {
66
+ margin-top: 10px;
67
+ }
68
+ font-family: $normalFonts;
69
+
70
+ .profiler-label {
71
+ color: $textColor;
72
+ overflow: hidden;
73
+ text-overflow: ellipsis;
74
+ }
75
+
76
+ .profiler-unit {
77
+ color: $mutedColor;
78
+ }
79
+
80
+ .profiler-trivial {
81
+ display: none;
82
+ td,
83
+ td * {
84
+ color: $mutedColor !important;
56
85
  }
57
- table.profiler-client-timings
58
- {
59
- margin-top: 10px;
86
+ }
87
+
88
+ pre,
89
+ code,
90
+ .profiler-number,
91
+ .profiler-unit {
92
+ font-family: $codeFonts;
93
+ }
94
+
95
+ .profiler-number {
96
+ color: $numberColor;
97
+ }
98
+
99
+ .profiler-info {
100
+ text-align: right;
101
+ .profiler-name {
102
+ float: left;
60
103
  }
61
- font-family:$normalFonts;
62
-
63
- .profiler-label {
64
- color:$textColor;
65
- overflow:hidden;
66
- text-overflow: ellipsis;
104
+ .profiler-server-time {
105
+ white-space: nowrap;
67
106
  }
107
+ }
68
108
 
69
- .profiler-unit {
70
- color:$mutedColor;
109
+ .profiler-timings {
110
+ th {
111
+ background-color: #fff;
112
+ color: $mutedColor;
113
+ text-align: right;
71
114
  }
72
-
73
- .profiler-trivial {
74
- display:none;
75
- td, td * {
76
- color:$mutedColor !important;
77
- }
115
+ th,
116
+ td {
117
+ white-space: nowrap;
78
118
  }
79
-
80
- pre, code, .profiler-number, .profiler-unit {
81
- font-family:$codeFonts;
119
+ .profiler-duration-with-children {
120
+ display: none;
82
121
  }
83
-
84
- .profiler-number {
85
- color:$numberColor;
122
+ .profiler-duration {
123
+ color: $numberColor;
124
+ text-align: right;
86
125
  }
87
-
88
- .profiler-info {
89
- text-align:right;
90
- .profiler-name {
91
- float:left;
92
- }
93
- .profiler-server-time {
94
- white-space:nowrap;
95
- }
126
+ .profiler-indent {
127
+ letter-spacing: 4px;
128
+ }
129
+ .profiler-queries-show {
130
+ .profiler-number,
131
+ .profiler-unit {
132
+ color: $anchorColor;
133
+ }
134
+ }
135
+ .profiler-queries-duration {
136
+ padding-left: 6px;
137
+ }
138
+ .profiler-percent-in-sql {
139
+ white-space: nowrap;
140
+ text-align: right;
96
141
  }
97
142
 
98
- .profiler-timings {
99
- th {
100
- background-color:#fff;
101
- color:$mutedColor;
102
- text-align:right;
103
- }
104
- th, td {
105
- white-space:nowrap;
106
- }
107
- .profiler-duration-with-children {
108
- display:none;
109
- }
110
- .profiler-duration {
111
- color:$numberColor;
112
- text-align:right;
113
- }
114
- .profiler-indent {
115
- letter-spacing:4px;
116
- }
117
- .profiler-queries-show {
118
- .profiler-number, .profiler-unit {
119
- color:$anchorColor;
120
- }
121
- }
122
- .profiler-queries-duration {
123
- padding-left:6px;
124
- }
125
- .profiler-percent-in-sql {
126
- white-space:nowrap;
127
- text-align:right;
128
- }
143
+ tfoot {
144
+ td {
145
+ padding-top: 10px;
146
+ text-align: right;
147
+
148
+ a {
149
+ font-size: 95%;
150
+ display: inline-block;
151
+ margin-left: 12px;
129
152
 
130
- tfoot {
131
- td {
132
- padding-top:10px;
133
- text-align:right;
134
-
135
- a {
136
- font-size:95%;
137
- display:inline-block;
138
- margin-left:12px;
139
-
140
- &:first-child {
141
- float:left;
142
- margin-left:0px;
143
- }
144
- &.profiler-custom-link {
145
- float:left;
146
- }
147
- }
148
- }
153
+ &:first-child {
154
+ float: left;
155
+ margin-left: 0px;
156
+ }
157
+ &.profiler-custom-link {
158
+ float: left;
159
+ }
149
160
  }
161
+ }
150
162
  }
163
+ }
151
164
 
152
- .profiler-queries {
153
- font-family:$normalFonts;
165
+ .profiler-queries {
166
+ font-family: $normalFonts;
154
167
 
155
- .profiler-stack-trace {
156
- margin-bottom:15px;
157
- }
168
+ .profiler-stack-trace {
169
+ margin-bottom: 15px;
170
+ }
158
171
 
159
- tbody tr {
160
- border-bottom: 1px solid #f1f1f1;
161
- }
172
+ tbody tr {
173
+ border-bottom: 1px solid #f1f1f1;
174
+ }
162
175
 
163
- tr {
164
- background-color: #FFF;
165
- }
176
+ tr {
177
+ background-color: #fff;
178
+ &.higlight-animate {
179
+ animation: highlight-in 3s;
180
+ }
181
+ }
166
182
 
167
- tr.slow {
168
- background-color: #FEE;
169
- }
183
+ tr.slow {
184
+ background-color: #fee;
185
+ }
170
186
 
171
- tr.very-slow {
172
- background-color: #FDD;
173
- }
187
+ tr.very-slow {
188
+ background-color: #fdd;
189
+ }
174
190
 
175
- tr.very-very-slow {
176
- background-color: #FCC;
177
- }
191
+ tr.very-very-slow {
192
+ background-color: #fcc;
193
+ }
178
194
 
179
- pre {
180
- font-family:$codeFonts;
181
- white-space:pre-wrap;
182
- }
195
+ pre {
196
+ font-family: $codeFonts;
197
+ white-space: pre-wrap;
198
+ }
183
199
 
184
- th {
185
- background-color:#fff;
186
- border-bottom:1px solid #555;
187
- font-weight:bold;
188
- padding:15px;
189
- white-space:nowrap;
190
- }
200
+ th {
201
+ background-color: #fff;
202
+ border-bottom: 1px solid #555;
203
+ font-weight: bold;
204
+ padding: 15px;
205
+ white-space: nowrap;
206
+ }
191
207
 
192
- td {
193
- padding:15px;
194
- text-align:left;
208
+ td {
209
+ padding: 15px;
210
+ text-align: left;
195
211
 
196
- &:last-child {
197
- padding-right:25px; // compensate for scrollbars
198
- }
199
- }
212
+ &:last-child {
213
+ padding-right: 25px; // compensate for scrollbars
214
+ }
215
+ }
200
216
 
201
- .profiler-since-start, .profiler-duration {
202
- text-align:right;
203
- }
217
+ .profiler-since-start,
218
+ .profiler-duration {
219
+ text-align: right;
220
+ }
204
221
 
205
- .profiler-info div {
206
- text-align:right;
207
- margin-bottom:5px;
208
- }
222
+ .profiler-info div {
223
+ text-align: right;
224
+ margin-bottom: 5px;
225
+ }
209
226
 
210
- .profiler-gap-info, .profiler-gap-info td { background-color: #ccc;}
211
- .profiler-gap-info {
212
- .profiler-unit {color: #777;}
213
- .profiler-info {text-align: right}
214
- &.profiler-trivial-gaps {display: none}
215
- }
227
+ .profiler-gap-info,
228
+ .profiler-gap-info td {
229
+ background-color: #ccc;
230
+ }
231
+ .profiler-gap-info {
232
+ .profiler-unit {
233
+ color: #777;
234
+ }
235
+ .profiler-info {
236
+ text-align: right;
237
+ }
238
+ &.profiler-trivial-gaps {
239
+ display: none;
240
+ }
241
+ }
216
242
 
217
- .profiler-trivial-gap-container { text-align: center;}
218
-
219
- // prettify colors
220
- .str{color:maroon}
221
- .kwd{color:#00008b}
222
- .com{color:gray}
223
- .typ{color:#2b91af}
224
- .lit{color:maroon}
225
- .pun{color:#000}
226
- .pln{color:#000}
227
- .tag{color:maroon}
228
- .atn{color:red}
229
- .atv{color:blue}
230
- .dec{color:purple}
231
- }
232
-
233
- .profiler-warning, .profiler-warning *, .profiler-warning .profiler-queries-show, .profiler-warning .profiler-queries-show .profiler-unit { // i'm no good at css
234
- color:#f00;
235
- &:hover {
236
- color:#f00;
237
- }
243
+ .profiler-trivial-gap-container {
244
+ text-align: center;
238
245
  }
239
246
 
240
- .profiler-nuclear {
241
- color:#f00;
242
- &:hover {
243
- color:#f00;
244
- }
245
- font-weight:bold;
246
- padding-right:2px;
247
+ // prettify colors
248
+ .str {
249
+ color: maroon;
250
+ }
251
+ .kwd {
252
+ color: #00008b;
253
+ }
254
+ .com {
255
+ color: gray;
256
+ }
257
+ .typ {
258
+ color: #2b91af;
247
259
  }
260
+ .lit {
261
+ color: maroon;
262
+ }
263
+ .pun {
264
+ color: #000;
265
+ }
266
+ .pln {
267
+ color: #000;
268
+ }
269
+ .tag {
270
+ color: maroon;
271
+ }
272
+ .atn {
273
+ color: red;
274
+ }
275
+ .atv {
276
+ color: blue;
277
+ }
278
+ .dec {
279
+ color: purple;
280
+ }
281
+ }
282
+
283
+ .profiler-warning,
284
+ .profiler-warning *,
285
+ .profiler-warning .profiler-queries-show,
286
+ .profiler-warning .profiler-queries-show .profiler-unit {
287
+ // i'm no good at css
288
+ color: #f00;
289
+ &:hover {
290
+ color: #f00;
291
+ }
292
+ }
293
+
294
+ .profiler-nuclear {
295
+ color: #f00;
296
+ &:hover {
297
+ color: #f00;
298
+ }
299
+ font-weight: bold;
300
+ padding-right: 2px;
301
+ }
248
302
  }
249
303
 
250
304
  // ajaxed-in results will be appended to this
251
- .profiler-results
252
- {
253
- z-index:$zindex + 3;
254
- position:fixed;
255
-
256
- $radius:10px;
257
-
258
- &.profiler-top {
259
- top:0px;
260
-
261
- &.profiler-left {
262
- left:0px;
263
-
264
- &.profiler-no-controls .profiler-totals, &.profiler-no-controls .profiler-result:last-child .profiler-button, .profiler-controls {
265
- -webkit-border-bottom-right-radius: $radius;
266
- -moz-border-radius-bottomright: $radius;
267
- border-bottom-right-radius: $radius;
268
- }
305
+ .profiler-results {
306
+ z-index: $zindex + 3;
307
+ position: fixed;
269
308
 
270
- .profiler-button, .profiler-controls {
271
- border-right: 1px solid $buttonBorderColor;
272
- }
273
- }
309
+ $radius: 10px;
274
310
 
275
- &.profiler-right {
276
- right:0px;
311
+ &.profiler-top {
312
+ top: 0px;
277
313
 
278
- &.profiler-no-controls .profiler-totals, &.profiler-no-controls .profiler-result:last-child .profiler-button, .profiler-controls {
279
- -webkit-border-bottom-left-radius: $radius;
280
- -moz-border-radius-bottomleft: $radius;
281
- border-bottom-left-radius: $radius;
282
- }
314
+ &.profiler-left {
315
+ left: 0px;
283
316
 
284
- .profiler-button, .profiler-controls {
285
- border-left: 1px solid $buttonBorderColor;
286
- }
317
+ &.profiler-no-controls .profiler-totals,
318
+ &.profiler-no-controls .profiler-result:last-child .profiler-button,
319
+ .profiler-controls {
320
+ -webkit-border-bottom-right-radius: $radius;
321
+ -moz-border-radius-bottomright: $radius;
322
+ border-bottom-right-radius: $radius;
287
323
  }
288
- }
289
324
 
290
- &.profiler-bottom {
291
- bottom:0px;
325
+ .profiler-button,
326
+ .profiler-controls {
327
+ border-right: 1px solid $buttonBorderColor;
328
+ }
329
+ }
292
330
 
293
- &.profiler-left {
294
- left:0px;
331
+ &.profiler-right {
332
+ right: 0px;
295
333
 
296
- &.profiler-no-controls .profiler-totals, &.profiler-no-controls .profiler-result:first-child .profiler-button, .profiler-controls {
297
- -webkit-border-top-right-radius: $radius;
298
- -moz-border-radius-topright: $radius;
299
- border-top-right-radius: $radius;
300
- }
334
+ &.profiler-no-controls .profiler-totals,
335
+ &.profiler-no-controls .profiler-result:last-child .profiler-button,
336
+ .profiler-controls {
337
+ -webkit-border-bottom-left-radius: $radius;
338
+ -moz-border-radius-bottomleft: $radius;
339
+ border-bottom-left-radius: $radius;
340
+ }
301
341
 
302
- .profiler-button, .profiler-controls {
303
- border-right: 1px solid $buttonBorderColor;
304
- }
342
+ .profiler-button,
343
+ .profiler-controls {
344
+ border-left: 1px solid $buttonBorderColor;
305
345
  }
346
+ }
347
+ }
306
348
 
307
- &.profiler-right {
308
- right:0px;
349
+ &.profiler-bottom {
350
+ bottom: 0px;
309
351
 
310
- &.profiler-no-controls .profiler-totals, &.profiler-no-controls .profiler-result:first-child .profiler-button, .profiler-controls {
311
- -webkit-border-bottom-top-radius: $radius;
312
- -moz-border-radius-topleft: $radius;
313
- border-top-left-radius: $radius;
314
- }
352
+ &.profiler-left {
353
+ left: 0px;
315
354
 
316
- .profiler-button, .profiler-controls {
317
- border-left: 1px solid $buttonBorderColor;
318
- }
355
+ &.profiler-no-controls .profiler-totals,
356
+ &.profiler-no-controls .profiler-result:first-child .profiler-button,
357
+ .profiler-controls {
358
+ -webkit-border-top-right-radius: $radius;
359
+ -moz-border-radius-topright: $radius;
360
+ border-top-right-radius: $radius;
319
361
  }
320
- }
321
362
 
322
- .profiler-button, .profiler-controls {
323
- display:none;
324
- z-index:$zindex;
325
- border-bottom: 1px solid $buttonBorderColor;
326
- background-color:#fff;
327
- padding: 4px 7px;
328
- text-align:right;
329
- cursor:pointer;
330
-
331
- &.profiler-button-active {
332
- background-color:maroon;
333
-
334
- .profiler-number, .profiler-nuclear {
335
- color:#fff;
336
- font-weight:bold;
337
- }
338
- .profiler-unit {
339
- color:#fff;
340
- font-weight:normal;
341
- }
342
- }
363
+ .profiler-button,
364
+ .profiler-controls {
365
+ border-right: 1px solid $buttonBorderColor;
366
+ }
343
367
  }
344
368
 
369
+ &.profiler-right {
370
+ right: 0px;
345
371
 
346
- .profiler-totals {
347
- .profiler-reqs {
348
- font-family: $codeFonts;
349
- font-size: 10px;
350
- margin-left: 6px;
351
- &:before {
352
- font-family: $codeFonts;
353
- content: "×";
354
- margin-right: 1px;
355
- }
372
+ &.profiler-no-controls .profiler-totals,
373
+ &.profiler-no-controls .profiler-result:first-child .profiler-button,
374
+ .profiler-controls {
375
+ -webkit-border-bottom-top-radius: $radius;
376
+ -moz-border-radius-topleft: $radius;
377
+ border-top-left-radius: $radius;
356
378
  }
357
- }
358
379
 
359
- .profiler-controls {
360
- display: block;
361
- font-size:12px;
380
+ .profiler-button,
381
+ .profiler-controls {
382
+ border-left: 1px solid $buttonBorderColor;
383
+ }
384
+ }
385
+ }
386
+
387
+ .profiler-button,
388
+ .profiler-controls {
389
+ display: none;
390
+ z-index: $zindex;
391
+ border-bottom: 1px solid $buttonBorderColor;
392
+ background-color: #fff;
393
+ padding: 4px 7px;
394
+ text-align: right;
395
+ cursor: pointer;
396
+
397
+ &.profiler-button-active {
398
+ background-color: maroon;
399
+
400
+ .profiler-number,
401
+ .profiler-nuclear {
402
+ color: #fff;
403
+ font-weight: bold;
404
+ }
405
+ .profiler-unit {
406
+ color: #fff;
407
+ font-weight: normal;
408
+ }
409
+ }
410
+ }
411
+
412
+ .profiler-totals {
413
+ .profiler-reqs {
414
+ font-family: $codeFonts;
415
+ font-size: 10px;
416
+ margin-left: 6px;
417
+ &:before {
362
418
  font-family: $codeFonts;
363
- cursor:default;
364
- text-align: center;
365
-
366
- span {
367
- border-right: 1px solid $mutedColor;
368
- padding-right: 5px;
369
- margin-right: 5px;
370
- cursor:pointer;
371
- }
372
-
373
- span:last-child {
374
- border-right: none;
375
- }
419
+ content: "×";
420
+ margin-right: 1px;
421
+ }
422
+ }
423
+ }
424
+
425
+ .profiler-controls {
426
+ display: block;
427
+ font-size: 12px;
428
+ font-family: $codeFonts;
429
+ cursor: default;
430
+ text-align: center;
431
+
432
+ span {
433
+ border-right: 1px solid $mutedColor;
434
+ padding-right: 5px;
435
+ margin-right: 5px;
436
+ cursor: pointer;
376
437
  }
377
438
 
378
- .profiler-popup {
379
- display:none;
380
- z-index:$zindex + 1;
381
- position:absolute;
382
- background-color:#fff;
383
- border: 1px solid #aaa;
384
- padding:5px 10px;
385
- text-align:left;
386
- line-height:18px;
387
- overflow:auto;
388
-
389
- @include box-shadow(0px, 1px, 15px, #555);
390
-
391
- .profiler-info {
392
- margin-bottom:3px;
393
- padding-bottom:2px;
394
- border-bottom:1px solid #ddd;
395
-
396
- .profiler-name {
397
- font-size:110%;
398
- font-weight:bold;
399
- .profiler-overall-duration {
400
- display:none;
401
- }
402
- }
403
- .profiler-server-time {
404
- font-size:95%;
405
- }
406
- }
439
+ span:last-child {
440
+ border-right: none;
441
+ }
442
+ }
407
443
 
408
- .profiler-timings {
444
+ .profiler-popup {
445
+ display: none;
446
+ z-index: $zindex + 1;
447
+ position: absolute;
448
+ background-color: #fff;
449
+ border: 1px solid #aaa;
450
+ padding: 5px 10px;
451
+ text-align: left;
452
+ line-height: 18px;
453
+ overflow: auto;
409
454
 
410
- th, td {
411
- padding-left:6px;
412
- padding-right:6px;
413
- }
455
+ @include box-shadow(0px, 1px, 15px, #555);
414
456
 
415
- th {
416
- font-size:95%;
417
- padding-bottom:3px;
418
- }
457
+ .profiler-info {
458
+ margin-bottom: 3px;
459
+ padding-bottom: 2px;
460
+ border-bottom: 1px solid #ddd;
419
461
 
420
- .profiler-label {
421
- max-width:275px;
422
- }
462
+ .profiler-name {
463
+ font-size: 110%;
464
+ font-weight: bold;
465
+ .profiler-overall-duration {
466
+ display: none;
423
467
  }
468
+ }
469
+ .profiler-server-time {
470
+ font-size: 95%;
471
+ }
424
472
  }
425
473
 
426
- .profiler-queries {
427
- display:none;
428
- z-index:$zindex + 3;
429
- position:absolute;
430
- overflow-y:auto;
431
- overflow-x:auto;
432
- background-color:#fff;
474
+ .profiler-timings {
475
+ th,
476
+ td {
477
+ padding-left: 6px;
478
+ padding-right: 6px;
479
+ }
433
480
 
434
- th {
435
- font-size:17px;
436
- }
437
- }
481
+ th {
482
+ font-size: 95%;
483
+ padding-bottom: 3px;
484
+ }
438
485
 
439
- &.profiler-min .profiler-result {
440
- display: none;
486
+ .profiler-label {
487
+ max-width: 275px;
488
+ }
441
489
  }
442
-
443
- &.profiler-min .profiler-controls span {
444
- display: none;
490
+ }
491
+
492
+ .profiler-queries {
493
+ display: none;
494
+ z-index: $zindex + 3;
495
+ position: absolute;
496
+ overflow-y: auto;
497
+ overflow-x: auto;
498
+ background-color: #fff;
499
+
500
+ th {
501
+ font-size: 17px;
445
502
  }
503
+ }
446
504
 
447
- &.profiler-min .profiler-controls .profiler-min-max {
448
- border-right: none;
449
- padding: 0px;
450
- margin: 0px;
451
- }
505
+ &.profiler-min .profiler-result {
506
+ display: none;
507
+ }
452
508
 
453
- .profiler-more-actions { float: left; }
509
+ &.profiler-min .profiler-controls span {
510
+ display: none;
511
+ }
454
512
 
455
- @media print {
456
- display: none;
457
- }
513
+ &.profiler-min .profiler-controls .profiler-min-max {
514
+ border-right: none;
515
+ padding: 0px;
516
+ margin: 0px;
517
+ }
518
+
519
+ .profiler-more-actions {
520
+ float: left;
521
+ }
522
+
523
+ @media print {
524
+ display: none;
525
+ }
458
526
  }
459
527
 
460
528
  // popup results' queries will be displayed in front of this
461
529
  .profiler-queries-bg {
462
- z-index:$zindex + 2;
463
- display:none;
464
- background:#000;
465
- opacity:0.7;
466
- position:absolute;
467
- top:0px;
468
- left:0px;
469
- min-width:100%;
530
+ z-index: $zindex + 2;
531
+ display: none;
532
+ background: #000;
533
+ opacity: 0.7;
534
+ position: absolute;
535
+ top: 0px;
536
+ left: 0px;
537
+ min-width: 100%;
470
538
  }
471
539
 
472
-
473
540
  // used when viewing a shared, full page result
474
541
  .profiler-result-full {
475
- .profiler-result {
542
+ .profiler-result {
543
+ width: 950px;
544
+ margin: 30px auto;
545
+
546
+ .profiler-button {
547
+ display: none;
548
+ }
549
+
550
+ .profiler-popup {
551
+ .profiler-info {
552
+ font-size: 25px;
553
+ border-bottom: 1px solid $mutedColor;
554
+ padding-bottom: 3px;
555
+ margin-bottom: 25px;
476
556
 
477
- width:950px;
478
- margin:30px auto;
557
+ .profiler-overall-duration {
558
+ padding-right: 20px;
559
+ font-size: 80%;
560
+ color: #888;
561
+ }
562
+ }
479
563
 
480
- .profiler-button {
481
- display:none;
564
+ .profiler-timings {
565
+ td,
566
+ th {
567
+ padding-left: 8px;
568
+ padding-right: 8px;
569
+ }
570
+ th {
571
+ padding-bottom: 7px;
482
572
  }
573
+ td {
574
+ font-size: 14px;
575
+ padding-bottom: 4px;
483
576
 
484
- .profiler-popup {
485
-
486
- .profiler-info {
487
- font-size: 25px;
488
- border-bottom:1px solid $mutedColor;
489
- padding-bottom:3px;
490
- margin-bottom:25px;
491
-
492
- .profiler-overall-duration {
493
- padding-right:20px;
494
- font-size:80%;
495
- color:#888;
496
- }
497
- }
498
-
499
- .profiler-timings {
500
- td, th {
501
- padding-left:8px;
502
- padding-right:8px;
503
- }
504
- th {
505
- padding-bottom:7px;
506
- }
507
- td {
508
- font-size:14px;
509
- padding-bottom:4px;
510
-
511
- &:first-child {
512
- padding-left:10px;
513
- }
514
- }
515
-
516
- .profiler-label {
517
- max-width:550px;
518
- }
519
- }
577
+ &:first-child {
578
+ padding-left: 10px;
579
+ }
520
580
  }
521
581
 
522
- .profiler-queries {
523
- margin:25px 0;
524
- table {
525
- width:100%;
526
- }
527
- th {
528
- font-size:16px;
529
- color:#555;
530
- line-height:20px;
531
- }
532
-
533
- td {
534
- padding:15px 10px;
535
- text-align:left;
536
- }
537
-
538
- .profiler-info div {
539
- text-align:right;
540
- margin-bottom:5px;
541
- }
582
+ .profiler-label {
583
+ max-width: 550px;
542
584
  }
585
+ }
543
586
  }
544
587
 
588
+ .profiler-queries {
589
+ margin: 25px 0;
590
+ table {
591
+ width: 100%;
592
+ }
593
+ th {
594
+ font-size: 16px;
595
+ color: #555;
596
+ line-height: 20px;
597
+ }
598
+
599
+ td {
600
+ padding: 15px 10px;
601
+ text-align: left;
602
+ }
603
+
604
+ .profiler-info div {
605
+ text-align: right;
606
+ margin-bottom: 5px;
607
+ }
608
+ }
609
+ }
610
+ }
611
+
612
+ @keyframes highlight-in {
613
+ 0% {
614
+ background: #ffffbb;
615
+ }
616
+ 100% {
617
+ background: #fff;
618
+ }
545
619
  }