-
Notifications
You must be signed in to change notification settings - Fork 0
/
dream.html
104 lines (103 loc) · 5.07 KB
/
dream.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
104
<!DOCTYPE html>
<html>
<head>
<title>梦中奇思</title>
<link
type="text/css"
rel="stylesheet"
href="https://at.alicdn.com/t/font_1755564_z4mhxbw13mq.css"
/>
<link
href="https://fonts.loli.net/css?family=Noto+Serif+SC:200,300,900&display=swap&subset=chinese-simplified"
rel="stylesheet"
/>
<link rel="shortcut icon" href="favicon.ico" />
<link rel="apple-touch-icon" href="favicon.ico" />
<link rel="stylesheet" href="main.css" />
<meta
name="viewport"
content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"
/>
<meta name="description" content=" 「Real Dream？Fake World！」「真实的梦境？虚假的现实！」" />
<meta name="keywords" content="" />
<meta name="author" content="chiperman" />
<meta charset="utf-8" />
<meta name="robots" content="index,follow" />
<meta name="google" content="index,follow" />
<meta name="googlebot" content="index,follow" />
<meta name="verify" content="index,follow" />
<meta name="apple-mobile-web-app-title" content="梦中奇思" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
</head>
<body>
<header id="header">
<div class="title">
<h1>梦中奇思</h1>
</div>
</header>
<main id="app">
<p class="describe">
「Real Dream？Fake World！」<br />
「真实的梦境？虚假的现实！」
</p>
<div>
<a class="tip" style="width: fit-content">现在总共梦了 {{count}} 条</a>
<a class="x-link" href="index.html" style="float: right">X 言 X 语</a>
</div>
<section
class="item"
v-bind:class="'type-'+item.attributes.type"
v-for="item in contents"
v-cloak
>
<span class="item-number">No.{{item.attributes.ID }}</span>
<p class="item-content" v-if="item.showContent" v-html="item.attributes.content"></p>
<p
class="item-translated-content"
v-if="item.showTranslatedContent"
v-html="item.translatedContent"
></p>
<span class="item-translate-btn" v-on:click="translateContent(item)">
<svg
t="1715963943996"
viewBox="0 0 1024 1024"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
p-id="2636"
width="20"
height="20"
>
<path
d="M938.666667 981.333333c-17.066667 0-29.866667-8.533333-38.4-25.6l-59.733334-119.466666h-277.333333l-59.733333 119.466666c-8.533333 21.333333-34.133333 29.866667-55.466667 17.066667-25.6-8.533333-34.133333-34.133333-21.333333-51.2l72.533333-140.8 145.066667-290.133333c12.8-21.333333 34.133333-38.4 59.733333-38.4s46.933333 12.8 59.733333 38.4l145.066667 290.133333 72.533333 140.8c8.533333 21.333333 0 46.933333-17.066666 55.466667-12.8 4.266667-17.066667 4.266667-25.6 4.266666z m-332.8-226.133333h192l-98.133334-192-93.866666 192zM85.333333 844.8c-17.066667 0-29.866667-8.533333-38.4-25.6-8.533333-21.333333 0-46.933333 21.333334-55.466667 93.866667-46.933333 179.2-110.933333 247.466666-187.733333-46.933333-64-85.333333-128-110.933333-192-8.533333-21.333333 4.266667-46.933333 25.6-55.466667 21.333333-8.533333 46.933333 4.266667 55.466667 25.6 21.333333 51.2 46.933333 102.4 81.066666 149.333334 59.733333-85.333333 102.4-179.2 128-281.6H85.333333c-25.6 0-42.666667-17.066667-42.666666-42.666667s17.066667-42.666667 42.666666-42.666667h243.2V85.333333c0-25.6 17.066667-42.666667 42.666667-42.666666s42.666667 17.066667 42.666667 42.666666v51.2h238.933333c25.6 0 42.666667 17.066667 42.666667 42.666667s-17.066667 42.666667-42.666667 42.666667h-68.266667c-25.6 128-85.333333 247.466667-162.133333 349.866666l25.6 25.6c17.066667 17.066667 17.066667 42.666667 0 59.733334-17.066667 17.066667-42.666667 17.066667-59.733333 0l-17.066667-17.066667c-72.533333 81.066667-162.133333 149.333333-264.533333 200.533333-8.533333 0-17.066667 4.266667-21.333334 4.266667z"
fill="#d4237a"
p-id="2637"
></path>
</svg>
</span>
<div class="item-tag">{{item.attributes.tag}}</div>
<div class="item-info">
<div class="item-time" v-bind:datetime="item.attributes.time">
{{ item.attributes.time }}
</div>
<div class="equipment"></div>
</div>
</section>
<div class="load-ctn">
<button class="load-btn" v-on:click="loadMore" v-if="contents" v-cloak>梦下去</button>
<p class="tip" v-else>Loading...</p>
</div>
</main>
<footer>
<p class="center-text">
<b
>Modified with 💔 by
<a href="https://chiperman.github.io/about/" target="_blank">chiperman</a></b
>
</p>
</footer>
</body>
<script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.11/vue.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/leancloud-storage@4.5.3/dist/av-min.js"></script>
<script src="./scripts/dream.js"></script>
</html>