-
Notifications
You must be signed in to change notification settings - Fork 5
/
issues.html
103 lines (103 loc) · 4.19 KB
/
issues.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Issue Viewer</title>
<script src="issues.js"></script>
<style>
@import url("https://martinthomson.github.io/i-d-template/fonts.css");
body { font: 15px/20px "Lora", serif; }
h2, h3, h4, h5, th, .item, .meta {
font-family: "Cabin Condensed", sans-serif; font-weight: 600; line-height: 150%; }
tt { font: 14px/20px "Oxygen Mono", monospace; }
pre { font: 12.5px/16px "Oxygen Mono", monospace; }
tt, pre { background-color: #eee; border-radius: 2px; padding: 0 2px; }
table { border: 1px solid #ddd; border-collapse: collapse; }
td, th { border: 1px solid #eee; padding: 5px 2px;
text-align: left; vertical-align: text-bottom; }
td .extra { display: none; max-width: 600px; overflow: auto; margin-top: 5px; }
.date, .id { text-align: right; }
.id a, .title a { text-decoration: none; color: #000; }
.assignees { max-width: 120px; }
.item { white-space: nowrap; }
.item span, .item a {
margin: 0 2px; padding: 1px 3px; max-width: 100px;
font-size: 14px; overflow: hidden; text-overflow: ellipsis; }
.item a { text-decoration: none; font-weight: 600; color: #000; }
.item a:hover { text-decoration: underline; }
.item a.short { max-width: 32px; }
.item .swatch, .item .avatar {
display: inline-block; width: 16px; height: 16px; border-radius: 2px;
vertical-align: text-bottom; padding: 0; margin: 0 2px; font-size: 10px; }
.warning { font-weight: 600; padding: 2px 10px; }
code { background-color: #eee; white-space: nowrap; }
#cmd { width: 600px; }
#help, #issue, #overlay { display: none; position: fixed; }
#help.active, #issue.active, #overlay.active { display: block; }
#overlay {
z-index: 1; width: 100%; height: 100%; left: 0; top: 0;
background-color: #333; opacity: 0.5; }
#issue, #help {
z-index: 2; width: calc(100% - 150px); height: calc(100% - 80px);
left: 50px; top: 20px; border: 1px solid #eee;
background-color: #fff; padding: 20px 25px; border-radius: 5px;
overflow-y: auto; overscroll-behavior: contain; }
h2 { margin: 20px 0 10px; } h3, h4, h5 { margin: 10px 0 5px; }
h2 .number { display: inline-block; min-width: 50px; text-align: right; }
h2 { font-size: 32px; } h3 { font-size: 20px; }
h4 { font-size: 18px; } h5 { font-size: 16px; }
.meta { margin: 2px 64px; font-size: 15px; color: #444; }
.meta > span { margin: 0 5px; }
.comments { margin: 5px; border: none; }
.comments td { border: none; }
.comments td.date { color: #555; font-size: 14px; }
.body { max-width: 550px; border: none; }
#issue > .body { margin: 20px 64px 20px 10px; }
p { margin: 0 2px 0.8em; }
blockquote { font-style: italic; margin: 0.5em 10px 1.3em;
padding: 0 5px; border-left: 3px solid #eee; }
ul, ol { padding-left: 32px; }
</style>
</head>
<body>
<div>
<label for="cmd">Filter:</label>
<input id="cmd" name="cmd" type="search" autofocus
placeholder="type '/help' to show filter syntax">
<span id="status"><span id="count"></span> records</span>
</div>
<div id="display">
<table>
<thead>
<tr>
<th id="sort-id">ID</th>
<th id="sort-title">Title</th>
<th id="sort-state">State</th>
<th id="sort-author">Author</th>
<th>Assignee</th>
<th>Labels</th>
</tr>
</thead>
<tbody id="issuelist">
</tbody>
</table>
</div>
<div id="overlay"></div>
<div id="help">
<p>This page shows GitHub issues in a simple form.</p>
<p>The filter box above accepts a set of filters, each separated by space.</p>
<ul id="functions">
</ul>
<p>You can <tt>/sort</tt> on <tt>id</tt>, <tt>recent</tt>, or <tt>closed</tt>.</p>
<p>Pressing <tt>enter</tt> saves the current search.
Pressing <tt>esc</tt> leaves the text input area.</p>
<h3>Outside the search box</h3>
<p>Clicking an issue title displays details for the issue including comments.
Pressing <tt>n</tt> or <tt>j</tt> moves to the next issue,
and <tt>p</tt> or <tt>k</tt> move to the previous one.</p>
<p>Pressing <tt>esc</tt> closes the issue view, <tt>'</tt> focuses search, and
<tt>c</tt> clears the search.</p>
</div>
<div id="issue"></div>
</body>
</html>