-
Notifications
You must be signed in to change notification settings - Fork 245
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Fixed: Encoding incompatible Update HTML template Remove some code Update template, fix clipboard copy Update HTML template Update HTML template
- Loading branch information
1 parent
3a7d3eb
commit 51a5bbb
Showing
2 changed files
with
113 additions
and
272 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,237 +1,115 @@ | ||
<!DOCTYPE html> | ||
<html> | ||
<head> | ||
<meta charset='UTF-8' /> | ||
<title>RuboCop Inspection Report</title> | ||
<%# TODO: Clean up the messy markup and style definitions. %> | ||
<style> | ||
* { | ||
-webkit-box-sizing: border-box; | ||
-moz-box-sizing: border-box; | ||
box-sizing: border-box; | ||
} | ||
|
||
body, html { | ||
font-size: 62.5%; | ||
} | ||
body { | ||
background-color: #ecedf0; | ||
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; | ||
margin: 0; | ||
} | ||
code { | ||
font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace; | ||
font-size: 85%; | ||
} | ||
#header { | ||
background: #f9f9f9; | ||
color: #333; | ||
border-bottom: 3px solid #ccc; | ||
height: 50px; | ||
padding: 0; | ||
} | ||
#header .logo { | ||
float: left; | ||
margin: 5px 12px 7px 20px; | ||
width: 38px; | ||
height: 38px; | ||
} | ||
#header .title { | ||
display: inline-block; | ||
float: left; | ||
height: 50px; | ||
font-size: 2.4rem; | ||
letter-spacing: normal; | ||
line-height: 50px; | ||
margin: 0; | ||
} | ||
<head> | ||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> | ||
<link rel="stylesheet" href="https://unpkg.com/spectre.css/dist/spectre.min.css"> | ||
<link rel="stylesheet" href="https://unpkg.com/spectre.css/dist/spectre-icons.min.css"> | ||
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script> | ||
|
||
.information, #offenses { | ||
width: 100%; | ||
padding: 20px; | ||
color: #333; | ||
} | ||
#offenses { | ||
padding: 0 20px; | ||
<title>Code Analysis Report</title> | ||
<style> | ||
.logo { | ||
width: 40px; | ||
height: 40px; | ||
} | ||
|
||
.information .infobox { | ||
border-left: 3px solid; | ||
border-radius: 4px; | ||
background-color: #fff; | ||
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05); | ||
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05); | ||
padding: 15px; | ||
border-color: #0088cc; | ||
font-size: 1.4rem; | ||
} | ||
.information .infobox .info-title { | ||
font-size: 1.8rem; | ||
line-height: 2.2rem; | ||
margin: 0 0 0.5em; | ||
} | ||
.information .offenses-list li { | ||
line-height: 1.8rem | ||
} | ||
.information .offenses-list { | ||
padding-left: 20px; | ||
margin-bottom: 0; | ||
.navbar-section h3 { | ||
margin: 0 !important; | ||
} | ||
|
||
#offenses .offense-box { | ||
border-radius: 4px; | ||
margin-bottom: 20px; | ||
background-color: #fff; | ||
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05); | ||
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05); | ||
} | ||
.fixed .box-title { | ||
position: fixed; | ||
top: 0; | ||
z-index: 10; | ||
width: 100%; | ||
} | ||
.box-title-placeholder { | ||
display: none; | ||
} | ||
.fixed .box-title-placeholder { | ||
display: block; | ||
} | ||
#offenses .offense-box .box-title h3, #offenses .offense-box .box-title-placeholder h3 { | ||
color: #33353f; | ||
background-color: #f6f6f6; | ||
font-size: 2rem; | ||
line-height: 2rem; | ||
display: block; | ||
padding: 15px; | ||
border-radius: 5px; | ||
margin: 0; | ||
} | ||
#offenses .offense-box .offense-reports { | ||
padding: 0 15px; | ||
} | ||
#offenses .offense-box .offense-reports .report { | ||
border-bottom: 1px dotted #ddd; | ||
padding: 15px 0px; | ||
position: relative; | ||
font-size: 1.3rem; | ||
} | ||
#offenses .offense-box .offense-reports .report:last-child { | ||
border-bottom: none; | ||
} | ||
#offenses .offense-box .offense-reports .report pre code { | ||
display: block; | ||
background: #000; | ||
color: #fff; | ||
padding: 10px 15px; | ||
border-radius: 5px; | ||
line-height: 1.6rem; | ||
} | ||
#offenses .offense-box .offense-reports .report .location { | ||
font-weight: bold; | ||
} | ||
#offenses .offense-box .offense-reports .report .message code { | ||
padding: 0.3em; | ||
background-color: rgba(0,0,0,0.07); | ||
border-radius: 3px; | ||
.copy-btn, .card-header { | ||
cursor: pointer; | ||
} | ||
.severity { | ||
text-transform: capitalize; | ||
font-weight: bold; | ||
} | ||
.highlight { | ||
padding: 2px; | ||
border-radius: 2px; | ||
font-weight: bold; | ||
} | ||
<%- SEVERITY_COLORS.each do |severity, color| %> | ||
.severity.<%= severity %> { | ||
color: <%= color %>; | ||
} | ||
.highlight.<%= severity %> { | ||
background-color: <%= color.fade_out(0.4) %>; | ||
border: 1px solid <%= color.fade_out(0.6) %>; | ||
} | ||
<%- end %> | ||
footer { | ||
margin-bottom: 20px; | ||
margin-right: 20px; | ||
font-size: 1.3rem; | ||
color: #777; | ||
text-align: right; | ||
} | ||
.extra-code { | ||
color: #ED9C28 | ||
} | ||
</style> | ||
|
||
<script> | ||
(function() { | ||
// floating headers. requires classList support. | ||
if (!('classList' in document.createElement("_"))) return; | ||
.code code { | ||
background: rgb(247, 248, 220) !important; | ||
line-height: 0.5; | ||
} | ||
|
||
var loaded = false, | ||
boxes, | ||
boxPositions; | ||
header { | ||
margin-bottom: 20px; | ||
} | ||
|
||
window.onload = function() { | ||
var scrollY = window.scrollY; | ||
boxes = document.querySelectorAll('.offense-box'); | ||
boxPositions = []; | ||
for (var i = 0; i < boxes.length; i++) | ||
// need to add scrollY because the page might be somewhere other than the top when loaded. | ||
boxPositions[i] = boxes[i].getBoundingClientRect().top + scrollY; | ||
loaded = true; | ||
}; | ||
body { | ||
font-size: 0.75rem !important; | ||
} | ||
</style> | ||
</head> | ||
|
||
window.onscroll = function() { | ||
if (!loaded) return; | ||
var i, | ||
idx, | ||
scrollY = window.scrollY; | ||
for (i = 0; i < boxPositions.length; i++) { | ||
if (scrollY <= boxPositions[i] - 1) { | ||
idx = i; | ||
break; | ||
} | ||
} | ||
if (typeof idx == 'undefined') idx = boxes.length; | ||
if (idx > 0) | ||
boxes[idx - 1].classList.add('fixed'); | ||
for (i = 0; i < boxes.length; i++) { | ||
if (i < idx) continue; | ||
boxes[i].classList.remove('fixed'); | ||
} | ||
}; | ||
})(); | ||
</script> | ||
</head> | ||
<body> | ||
<div id="header"> | ||
<img class="logo" src="data:image/png;base64,<%= base64_encoded_logo_image %>" alt=""> | ||
<h1 class="title">Pronto Inspection Report</h1> | ||
</div> | ||
<div id="offenses"> | ||
<% messages.each do |message| %> | ||
<div class="offense-box" id="offense_<%= message.path %>"> | ||
<div class="box-title-placeholder"><h3> </h3></div> | ||
<div class="offense-reports"> | ||
<div class="report"> | ||
<div class="meta"> | ||
<span class="location">Line #<%= message.line.new_lineno %></span> – | ||
<span class="severity <%= message.level %>"><%= message.level %>:</span> | ||
<span class="message"><%= message.msg %></span> | ||
</div> | ||
<pre><code><%= message.line.line.content %></code></pre> | ||
</div> | ||
</div> | ||
<body> | ||
<header class="navbar bg-dark"> | ||
<section class="navbar-section"> | ||
<h3>Code Analysis Report</h3> | ||
</section> | ||
<section class="navbar-section"> | ||
<a href="https://github.com/dongnhzigexn/pronto" class="btn btn-link text-light">GitHub</a> | ||
</section> | ||
</header> | ||
<div class="container"> | ||
<div class="panel bg-gray"> | ||
<div class="panel-header"> | ||
<div class="panel-title text-bold"><%= pluralize(files.values.flatten.count, 'offense', no_for_zero: true) %> detected:</div> | ||
</div> | ||
<div class="panel-body"> | ||
<ul> | ||
<% files.each do |path, offenses| %> | ||
<li> | ||
<a href="#offense_<%= path %>"> <%= path %> </a> | ||
<span class="chip"><%= pluralize(offenses.count, 'offense') %></span> | ||
<span class="copy-btn tooltip tooltip-right" data-tooltip="Copy relative path" | ||
data-clipboard-text="<%= path %>"> | ||
<i class=" icon icon-copy"></i> | ||
</span> | ||
</li> | ||
<% end %> | ||
</ul> | ||
</div> | ||
<% end %> | ||
</div> | ||
<footer> | ||
Generated by <a href="https://github.com/rubocop-hq/rubocop">RuboCop</a> | ||
<span class="version"><%= RuboCop::Version::STRING %></span> | ||
</footer> | ||
</body> | ||
</html> | ||
|
||
<% files.each do |path, offenses| %> | ||
<details class="card mt-2 accordion" id="offense_<%= path %>"> | ||
<summary class="accordition-header card-header bg-gray text-bold"> | ||
<%= path %> | ||
<span class="chip"> | ||
<%= pluralize(offenses.count, 'offense') %> | ||
</span> | ||
</summary> | ||
<div class="card-body accordion-body"> | ||
<% offenses.each do |offense| %> | ||
<div class="report"> | ||
<div class="meta text-italic"> | ||
<span class="copy-btn tooltip tooltip-right" | ||
data-tooltip="Copy relative path" | ||
data-clipboard-text="<%= path %>:<%= offense.line.new_lineno %>"> | ||
<a>Line #<%= offense.line.new_lineno %></a> | ||
</span> | ||
<%- message = "#{offense.level}: #{decorated_message(offense.msg)}" %> | ||
<span class="message"> | ||
<%= message %> | ||
</span> | ||
<span class="chip"> | ||
<%= offense.runner.to_s.split('::').last %> | ||
</span> | ||
</div> | ||
<pre class="code text-error"><code><%= offense.line.line.content.force_encoding('UTF-8') %></code></pre> | ||
</div> | ||
<% end %> | ||
</div> | ||
</details> | ||
<% end %> | ||
</div> | ||
<script> | ||
(function () { | ||
var clipboard = new ClipboardJS('.copy-btn'); | ||
clipboard.on('success', function (e) { | ||
buttons = document.getElementsByClassName('copy-btn'); | ||
for (let btn of buttons){ | ||
btn.dataset.tooltip = "Copy relative path" | ||
} | ||
e.trigger.dataset.tooltip = "Copied!" | ||
}); | ||
})(); | ||
</script> | ||
</body> | ||
</html> |
Oops, something went wrong.