Commit 55f6db972f0aab3c631c7523f892d9bf35414b40
1 parent
34f719db
Exists in
master
and in
1 other branch
Changed ul/li in backtrace 'table' to th/td. Subpixel rendering caused the lines…
… to go out of sync depending on zoom levels for webkit browsers. Sure, you shouldn't use tables for layouts, but when you have a 'heading' and a 'column' for a 'table' of data ... that's what they're for! [ci skip]
Showing
2 changed files
with
35 additions
and
24 deletions
Show diff stats
app/views/notices/_backtrace.html.haml
1 | 1 | .window |
2 | 2 | %table.backtrace |
3 | - %tr | |
3 | + %tr.padding | |
4 | + %th | |
5 | + %td | |
6 | + - lines.each do |line| | |
7 | + %tr | |
8 | + %th.line-numbers= line_number_with_link(@app, line) | |
9 | + %td.lines{:class => (Notice.in_app_backtrace_line?(line) ? 'in-app' : nil)} | |
10 | + = line['file'] | |
11 | + → | |
12 | + %strong= line['method'] | |
13 | + %tr.padding | |
4 | 14 | %th |
5 | - %ul.line-numbers | |
6 | - - lines.each do |line| | |
7 | - %li= line_number_with_link(@app, line) | |
8 | 15 | %td |
9 | - %ul.lines | |
10 | - - lines.each do |line| | |
11 | - - in_app = line['file'].to_s.gsub!('[PROJECT_ROOT]','') && !line['file'].to_s.match(/^\/vendor\//) | |
12 | - %li{:class => (in_app ? 'in-app' : nil)} | |
13 | - = line['file'] | |
14 | - → | |
15 | - %strong= line['method'] | |
16 | 16 | ... | ... |
public/stylesheets/application.css
... | ... | @@ -683,38 +683,49 @@ table.deploys td.when { |
683 | 683 | margin: 0; |
684 | 684 | } |
685 | 685 | |
686 | +table.backtrace td, table.backtrace th { | |
687 | + border-top: none; | |
688 | +} | |
686 | 689 | table.backtrace td { |
687 | 690 | width: 100%; |
688 | 691 | padding: 0; |
689 | 692 | margin: 0; |
690 | 693 | color: #C7C7C7; |
691 | - background-color: #222 !important; | |
692 | -} | |
693 | -table.backtrace ul.line-numbers { | |
694 | - padding-top: 1px; | |
694 | + background-color: #222; | |
695 | 695 | } |
696 | -table.backtrace ul.line-numbers li { | |
696 | + | |
697 | +/* remove alternating color rules */ | |
698 | +table.backtrace tr:nth-child(2n+1) td { background-color: #222; } | |
699 | +table.backtrace tr:first-child td { border-top: 0; } | |
700 | + | |
701 | +table.backtrace th.line-numbers { | |
697 | 702 | border-bottom: 1px solid #F0F0F0; |
698 | 703 | font-size: 13px; |
699 | - line-height: 20px; | |
700 | 704 | text-align: right; |
705 | + vertical-align: middle; | |
706 | + padding: 1px 6px 1px 7px; | |
701 | 707 | } |
702 | 708 | |
703 | -table.backtrace ul.lines { | |
704 | - padding: 10px 8px; | |
705 | - overflow: auto; | |
706 | -} | |
707 | -table.backtrace ul.lines li { | |
709 | +table.backtrace td.lines { | |
708 | 710 | border-bottom: 1px solid #2A2A2A; |
709 | 711 | font-size: 13px; |
710 | - line-height: 20px; | |
712 | + padding-left: 8px; | |
713 | + vertical-align: middle; | |
711 | 714 | white-space: nowrap; |
712 | 715 | } |
713 | -table.backtrace ul.lines li.in-app { | |
716 | +table.backtrace td.lines.in-app { | |
714 | 717 | color: #2adb2e; |
715 | 718 | background-color: #2f2f2f; |
716 | 719 | } |
717 | 720 | |
721 | +/* Extra empty rows at top and bottom of table */ | |
722 | +table.backtrace tr.padding th, table.backtrace tr.padding td { | |
723 | + height: 10px; | |
724 | + margin: 0; | |
725 | + padding: 0; | |
726 | +} | |
727 | + | |
728 | + | |
718 | 729 | span.click_span { |
719 | 730 | font-size: 0.7em; |
720 | 731 | } | ... | ... |