-
Notifications
You must be signed in to change notification settings - Fork 30
/
index.html
188 lines (185 loc) · 10.9 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
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
<!DOCTYPE html>
<html lang="zh-cmn-hans" class="font-auto">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="keywords" content="奇趣起始页, 起始页, 奇趣新标签页, 新标签页, KStart, 开源起始页">
<meta name="description" content="一个简洁轻巧的公共起始页服务，基于原生 JavaScript 构建">
<meta property="og:title" content="奇趣起始页">
<meta property="og:description" content="一个简洁轻巧的公共起始页服务，基于原生 JavaScript 构建">
<title>奇趣起始页</title>
<link rel="icon" href="static/icon.png" sizes="192x192" />
<link rel="stylesheet" href="https://fastly.jsdelivr.net/gh/Dreamer-Paul/Kico-Style@master/kico.css" />
<link rel="stylesheet" href="https://at.alicdn.com/t/c/font_1809713_0i9n7b43jm6t.css" />
<link href="https://fastly.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="static/main.css" />
<link rel="canonical" href="https://s.paul.ren" />
<script src="https://fastly.jsdelivr.net/gh/Dreamer-Paul/Kico-Style/kico.js" defer></script>
<script src="static/main.js" defer></script>
</head>
<body>
<header>
<div class="action-btn edit" ks-tag="bottom" ks-text="管理导航项">
<i class="fa fa-edit"></i>
</div>
<div class="action-btn updated" ks-tag="bottom" ks-text="更新日志">
<i class="fa fa-bullhorn"></i>
</div>
<div class="action-btn about" ks-tag="bottom" ks-text="关于">
<i class="fa fa-info-circle"></i>
</div>
<div class="action-btn setting" ks-tag="bottom" ks-text="设置">
<i class="fa fa-cog"></i>
</div>
</header>
<main>
<section class="navi-search">
<form class="input-box">
<div class="search-select" title="切换搜索引擎">
<div class="iconfont icon-baidu"></div>
</div>
<div class="search-selector"></div>
<input type="text" placeholder="搜索..."/>
<button class="btn transparent" title="搜索"><i class="fa fa-search"></i></button>
</form>
</section>
<section class="navi-items"></section>
<section class="navi-background"></section>
</main>
<footer>
<p>© <script>document.write(new Date().getFullYear())</script> <a href="https://paul.ren" target="_blank">奇趣保罗</a> | <a href="https://github.com/Dreamer-Paul/KStart" target="_blank">参与维护</a></p>
</footer>
<window>
<section class="the-window updated">
<div class="window-head">
<button data-type="close">×</button>
<h3>更新日志</h3>
</div>
<div class="window-body">
<article>
<blockquote>时隔两年，这个老项目又给我成功拿出来挖坟了，还是因为群里有人在用，顿时有了想法，哈哈！</blockquote>
<h3>本次更新：</h3>
<ul>
<li>增加个人设置导入导出功能，数据丢失是不存在的啦！</li>
<li>增加夜间模式风格，只要你的电脑开启了就自动应用啦！</li>
<li>自定义背景设置项，增加 Unsplash 随机图片源</li>
<li>增加导航项拖拽排序功能</li>
<li>增加导航项管理抽屉，可自由添加和删除你想要的导航项</li>
<li>增加运行模式判断，用户模式下（地址栏输入 <code>?u=paul</code>）仅可读，无法使用任意编辑功能</li>
<li>CSS 样式和细节优化，JS 代码逻辑优化</li>
<li>优化关闭弹窗和抽屉的动画和速度</li>
<li>解决使用抽屉添加导航项导致无法拖拽的问题</li>
<li>打开起始页时，可自动聚焦到搜索框</li>
<li>修复了搜索下拉框不会收回去的问题</li>
</ul>
<details>
<summary>上次更新：</summary>
<ul>
<li>优化代码命名和逻辑，增加可读性，更新为现代 JavaScript 写法，鼓励你和我一起参与本项目的 <a href="https://github.com/Dreamer-Paul/KStart" target="_blank">维护</a>！</li>
<li>窗口关闭按钮改为事件委托，修复用户模式下的 Bug（无法进行设置）</li>
<li>增加了搜狗搜索</li>
<li>替换了新的橙色 Logo</li>
<li>调整导航项 DOM 结构，修改版权展示时间</li>
<li>解决了在用户模式下（地址栏输入 <code>?u=paul</code>）配置会被本地覆盖的 Bug</li>
<li>在用户模式下，禁止使用设置功能</li>
<li>页脚版权的时间自动生成，过期（气）是不存在的啦！</li>
</ul>
</details>
<details>
<summary>更新预告：</summary>
<ul>
<li>更舒适的自定义站点列表体验</li>
<li>可供设定你自己的壁纸（本地或外链）</li>
<li>更易操作的设置面板（可能会在本项目的 2.0 版本实现）</li>
</ul>
</details>
</article>
</div>
</section>
<section class="the-window about">
<div class="window-head">
<button data-type="close">×</button>
<h3>关于本项目</h3>
</div>
<div class="window-body">
<article>
<p><img src="static/about.jpg" alt="关于奇趣起始页"></p>
<p>欢迎使用奇趣起始页！本项目建设于 2020/5/9，是一个主打社区形式维护的开源项目。几乎采用原生（JS/CSS）技术实现，性能扛扛的！</p>
<p>本站默认<b>不保存任何私人数据</b>，因此不必担心你的<b>个人隐私被他人所查阅</b>。当然，你也可以选择编辑并共享它们。</p>
<p>只需要在 <a href="https://github.com/Dreamer-Paul/KStart-Sites" target="_blank">本项目的仓库</a> 上提交 PR，即可创造一个属于自己的导航页面。访问它只需要一个 <a href="https://s.paul.ren/?u=paul" target="_blank">URL 后缀</a> 即可直达，无需注册和登录，非常方便易用。</p>
<p>现有的类似站点已经很多了，为什么我仍然选择编写了这个项目？这是因为它们都是「<b>闭源的私人项目</b>」，只有作者本人才可以进行维护。</p>
<p>与此同时，这些站点的导航项大多已经预设。想要修改它们，要么需要注册后修改，要么就干脆不给改，个人觉得略显鸡肋。如果你更换了电脑，不就需要重新登录了吗？</p>
<p>本项目与众不同的地方则是采用了 GitHub 托管的形式，属于“无后端”项目，于是一些看似可以提升用户体验的功能，我暂时没有考虑去实现它。如果你有些好的建议，不妨在项目的 <a href="https://github.com/Dreamer-Paul/KStart/issues" target="_blank">Issues</a> 区进行留言？</p>
<h3>类似项目：</h3>
<ul>
<li><a href="https://xiaoshu.app" target="_blank" rel="nofollow">小舒同学</a></li>
<li><a href="https://limestart.cn" target="_blank" rel="nofollow">青柠起始页</a></li>
</ul>
<h3>使用了开源项目：</h3>
<ul>
<li><a href="https://github.com/Dreamer-Paul/Kico-Style" target="_blank" rel="nofollow">Kico Style</a></li>
<li><a href="https://fontawesome.com" target="_blank" rel="nofollow">FontAwesome</a></li>
</ul>
<h3>使用了第三方服务：</h3>
<ul>
<li><a href="https://www.iconfont.cn" target="_blank" rel="nofollow">IconFont</a>（图标托管）</li>
<li><a href="https://api.paugram.com" target="_blank">保罗 API</a>（随机动漫壁纸、必应壁纸解析）
<ul>
<li>其中 <a href="https://github.com/Dreamer-Paul/Anime-Wallpaper" target="_blank">随机动漫壁纸</a> 部分是公开仓库，欢迎你的投稿</li>
</ul>
</li>
</ul>
</article>
</div>
</section>
<section class="the-window setting">
<div class="window-head">
<button data-type="close">×</button>
<h3>设置</h3>
</div>
<div class="window-body">
<fieldset>
<label>
<span>界面布局</span>
<select name="layout" data-key="layout"></select>
</label>
<label>
<span>默认搜索引擎：</span>
<select name="search" data-key="search_method"></select>
</label>
<label>
<span>自定义背景：</span>
<select name="background" data-key="background_type"></select>
<span class="custom-background-preview" aria-label="选择图片" hidden></span>
<input type="file" id="custom-background-input" hidden />
</label>
<label>
<span>减淡动画和视觉效果：</span>
<select name="low_animate" data-key="motion_reduced_enum"></select>
</label>
<label>
<span>自动聚焦到搜索框：</span>
<input name="auto_focus" type="checkbox" class="switch" />
</label>
<p class="btn-group">
<button class="btn small primary" id="set-reset" title="重置个人设置为默认值">重置为默认</button>
<button class="btn small transparent" id="set-input" title="导入个人设置">导入</button>
<button class="btn small transparent" id="set-output" title="导出个人设置">导出</button>
<input type="file" id="set-file" hidden />
</p>
</fieldset>
</div>
</section>
<section class="the-drawer sites">
<div class="drawer-head">
<button data-type="close">×</button>
<h3>管理导航项</h3>
</div>
<div class="drawer-body">
<div class="sites"></div>
<p class="add-sites">若想扩展添加更多导航项，欢迎在本项目 Issues 区 <a href="https://github.com/Dreamer-Paul/KStart/issues/1" target="_blank">公共导航列表添加建议区</a> 留言讨论！</p>
</div>
</section>
</window>
</body>
</html>