-
Notifications
You must be signed in to change notification settings - Fork 4
/
Copy pathindex.html
81 lines (74 loc) · 3.61 KB
/
index.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
---
layout: compress
---
<!DOCTYPE html>
<html lang='en'>
<head>
<title>{{ site.title }}</title>
<meta name="description" content="{{ site.description }}"/>
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' name='viewport'/>
<meta content='IE=edge' http-equiv='X-UA-Compatible'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<link rel="stylesheet" href="{{ "/css/main.css" | prepend: site.baseurl }}">
</head>
<body>
<main>
<aside></aside>
<div class="pre" style="color:#fff">
{% assign DATA = site.data.data %}
{% if DATA.comments contains 'top' %}
<div class="code comment-item">
<div class="comment">{{DATA.comments.top}}</div>
</div>
{% endif %}
{% for CODE in DATA.code %}
<div class="code{% if DATA.meta.newSelection contains CODE[0] %} gutter-new{% endif %}">
<span class="code-selection">{{CODE[0]}}</span>
<span class="code-content">
{% for LINE in CODE[1] %}
<span class="code-line{% if DATA.meta.quotes contains LINE[0] %} value-content{% endif %}{% if DATA.meta.newLine contains LINE[0] %} gutter-new{% endif %}">
{% assign key = LINE[0] %}
{% assign value = LINE[1] %}
<span class="code-attr">{{key}}</span>
{% if DATA.meta.links contains key %}
<span class="code-value"><a href="{{DATA.meta.links[key]}}" target="_blank">{{value}}</a></span>
{% elsif value contains "%" %}
<span class="code-value value-number">{{value | remove: '%'}}<span class="value-number-percent">%</span></span>
{% else %}
<span class="code-value">{{value}}</span>
{% endif %}
</span>
{% endfor %}
</span>
</div>
{% endfor %}
{% if DATA.comments.bottom %}
<div class="code comment-item">
<div class="comment">{{DATA.comments.bottom}}</div>
</div>
{% endif %}
</div>
</main>
<div class="clearfix"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
function lineCountWrite() {
$("aside").html("");
var lineCount = $("main").height() / 25;
for (var i = 1; i <= lineCount; i++) {
$("aside").append("<span>" + i + "</span>")
}
}
lineCountWrite();
$(".code").append('<span class="arrow"></span>');
$(".code .arrow").click(function() {
$(this).parent().toggleClass('close');
$(this).siblings('.code-selection').toggleClass('collapsed');
$(".code-content", $(this).parent()).toggle();
lineCountWrite();
});
});
</script>
</body>
</html>