初始版本
This commit is contained in:
104
docs/css/slinky.min.css
vendored
Normal file
104
docs/css/slinky.min.css
vendored
Normal file
@@ -0,0 +1,104 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
.slinky-menu {
|
||||
overflow: hidden;
|
||||
transform: translateZ(0);
|
||||
}
|
||||
|
||||
.slinky-menu > ul {
|
||||
left: 0;
|
||||
position: relative;
|
||||
transform: translateZ(0);
|
||||
}
|
||||
|
||||
.slinky-menu ul, .slinky-menu li {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.slinky-menu ul {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.slinky-menu a {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.slinky-menu a span {
|
||||
flex: 1;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.slinky-menu li ul {
|
||||
display: none;
|
||||
left: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.slinky-menu .header {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.slinky-menu .header .title {
|
||||
flex: 1;
|
||||
line-height: 1.4;
|
||||
margin: 0;
|
||||
order: 1;
|
||||
}
|
||||
|
||||
.slinky-theme-default {
|
||||
width: 100%;
|
||||
background: #fff;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.slinky-theme-default .title {
|
||||
color: #333;
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
.slinky-theme-default li {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.slinky-theme-default a:not(.back) {
|
||||
color: #333;
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
.slinky-theme-default a:not(.back):hover {
|
||||
background: rgba(90, 200, 250, 0.25);
|
||||
}
|
||||
|
||||
.slinky-theme-default a:not(.back):active {
|
||||
background: rgba(90, 200, 250, 0.5);
|
||||
}
|
||||
|
||||
.slinky-theme-default .next::after, .slinky-theme-default .back::before {
|
||||
background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+ICAgIDxwYXRoIGQ9Ik0xMi4yMTkgMi4yODFMMTAuNzggMy43MiAxOC4wNjIgMTFIMnYyaDE2LjA2M2wtNy4yODIgNy4yODEgMS40MzggMS40MzggOS05IC42ODctLjcxOS0uNjg3LS43MTl6IiAvPjwvc3ZnPg==) center no-repeat;
|
||||
background-size: 1em;
|
||||
content: '';
|
||||
height: 1em;
|
||||
opacity: 0.25;
|
||||
transition: 200ms;
|
||||
width: 1em;
|
||||
}
|
||||
|
||||
.slinky-theme-default .next::after {
|
||||
margin-left: 1em;
|
||||
}
|
||||
|
||||
.slinky-theme-default .back::before {
|
||||
padding: 1em;
|
||||
transform: scaleX(-1);
|
||||
}
|
||||
|
||||
.slinky-theme-default .next:hover::after, .slinky-theme-default .back:hover::before {
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
.slinky-theme-default .next:active::after, .slinky-theme-default .back:active::before {
|
||||
opacity: 1;
|
||||
}
|
||||
252
docs/css/styles.css
Normal file
252
docs/css/styles.css
Normal file
@@ -0,0 +1,252 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
/*
|
||||
* 默认配色
|
||||
* primary #4cd964
|
||||
* accent #5ac8fa
|
||||
* accent #ff2d55
|
||||
* background #fff
|
||||
* text #222
|
||||
*/
|
||||
|
||||
/* reset */
|
||||
|
||||
* {
|
||||
border-radius: 0;
|
||||
box-sizing: border-box;
|
||||
font-weight: normal;
|
||||
margin: 0;
|
||||
outline: none;
|
||||
padding: 0;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
/* global */
|
||||
|
||||
body {
|
||||
background: #F9F9F9;
|
||||
color: #222;
|
||||
cursor: default;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font: normal 14px/1 -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
|
||||
justify-content: center;
|
||||
margin: 4em auto;
|
||||
max-width: calc(100% - 2em);
|
||||
min-height: calc(100vh - 8em);
|
||||
/* text-transform: lowercase; */
|
||||
width: 30em;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #222;
|
||||
text-decoration: none;
|
||||
transition: 200ms;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #03A9F4;
|
||||
}
|
||||
|
||||
a:active {
|
||||
color: #00BCD4;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: 'Consolas', monospace;
|
||||
}
|
||||
|
||||
h1, h2, h3 {
|
||||
font-weight: 500;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h2 {
|
||||
color: #222;
|
||||
font-size: 1.5em;
|
||||
margin-bottom: 2em;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
h2::before {
|
||||
content: '';
|
||||
height: 1px;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
h3 {
|
||||
color: #03A9F4;
|
||||
font-size: 1.25em;
|
||||
margin: 2em 0;
|
||||
}
|
||||
|
||||
img {
|
||||
border: none;
|
||||
max-width: 100%;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 2em 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
pre {
|
||||
background: #f6f7f8;
|
||||
display: block;
|
||||
line-height: 1.4;
|
||||
padding: 1em;
|
||||
user-select: text;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
table {
|
||||
background: #f6f7f8;
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
margin: 2em 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
thead tr {
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.025);
|
||||
}
|
||||
|
||||
thead th {
|
||||
color: #ff2d55;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
tbody tr:not(:first-child) {
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.025);
|
||||
}
|
||||
|
||||
tbody td {
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
th, td {
|
||||
padding: 1em;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
/* layout */
|
||||
|
||||
header, h1 {
|
||||
align-items: center;
|
||||
align-self: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
header h1::before {
|
||||
content: '';
|
||||
background: url('../favicon.ico') center no-repeat;
|
||||
background-size: 2em;
|
||||
height: 2em;
|
||||
margin-bottom: 1em;
|
||||
width: 2em;
|
||||
}
|
||||
|
||||
header p {
|
||||
color: gray;
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
main {
|
||||
margin: 4em 0;
|
||||
opacity: 0;
|
||||
/* background: #fff; */
|
||||
transition: opacity 1s;
|
||||
}
|
||||
|
||||
main section:not(:first-child) {
|
||||
margin-top: 4em;
|
||||
}
|
||||
|
||||
footer {
|
||||
color: #555;
|
||||
font-size: 0.9em;
|
||||
line-height: 1.5em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
footer img {
|
||||
height: 1.5em;
|
||||
}
|
||||
|
||||
/* components */
|
||||
|
||||
.loading {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin: 2em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.loading::before {
|
||||
animation: spinner 1s infinite linear;
|
||||
content: '';
|
||||
border: 2px solid transparent;
|
||||
border-top-color: #5ac8fa;
|
||||
border-right-color: #5ac8fa;
|
||||
border-radius: 1em;
|
||||
height: 1.5em;
|
||||
margin-right: 1em;
|
||||
width: 1.5em;
|
||||
}
|
||||
|
||||
/* 全屏文字 */
|
||||
|
||||
.fullscreen-text {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
font-size: 10vw;
|
||||
transform: translate(-50%, -50%);
|
||||
transition: opacity 1s;
|
||||
}
|
||||
|
||||
/* 链接的图标 */
|
||||
|
||||
/*
|
||||
main section li img {
|
||||
height: 28px;
|
||||
position: absolute;
|
||||
transform: translate(10px, 10px);
|
||||
}
|
||||
|
||||
main section li a:not(.back) {
|
||||
padding-left: 45px !important;
|
||||
}
|
||||
*/
|
||||
|
||||
/* 选中 */
|
||||
|
||||
::selection {
|
||||
background:#03A9F4;
|
||||
color:#FFF;
|
||||
}
|
||||
::-moz-selection {
|
||||
background:#03A9F4;
|
||||
color:#FFF;
|
||||
}
|
||||
::-webkit-selection {
|
||||
background:#03A9F4;
|
||||
color:#FFF;
|
||||
}
|
||||
|
||||
/* 动画 */
|
||||
|
||||
@keyframes spinner {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
BIN
docs/favicon.ico
Normal file
BIN
docs/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 264 KiB |
3
docs/files/heart.svg
Normal file
3
docs/files/heart.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#ff2d55">
|
||||
<path d="M16.398 4C14.602 4 13 4.898 12 6.3 11 4.899 9.398 4 7.602 4A5.591 5.591 0 0 0 2 9.602C2 14 12 22 12 22s10-8 10-12.398C22 6.5 19.5 4 16.398 4z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 241 B |
8
docs/files/slinky.svg
Normal file
8
docs/files/slinky.svg
Normal file
@@ -0,0 +1,8 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100">
|
||||
<rect fill="#6BA73C" width="100" height="10"/>
|
||||
<rect fill="#ECAE3C" y="18" width="100" height="10"/>
|
||||
<rect fill="#DB752D" y="36" width="100" height="10"/>
|
||||
<rect fill="#C43935" y="54" width="100" height="10"/>
|
||||
<rect fill="#742F81" y="72" width="100" height="10"/>
|
||||
<rect fill="#3E82CC" y="90" width="100" height="10"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 418 B |
1131
docs/index.html
Normal file
1131
docs/index.html
Normal file
File diff suppressed because it is too large
Load Diff
4
docs/js/jquery-3.2.1.min.js
vendored
Normal file
4
docs/js/jquery-3.2.1.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
56
docs/js/script.js
Normal file
56
docs/js/script.js
Normal file
@@ -0,0 +1,56 @@
|
||||
// 查找字符 tChar 在 str 中第 num 次出现的位置
|
||||
function findChar(str, tChar, num) {
|
||||
var charPos = str.indexOf(tChar);
|
||||
num = num - 1;
|
||||
if (num > 0) {
|
||||
for (var i = 0; i < num; i++) {
|
||||
charPos = str.indexOf(tChar, charPos + 1);
|
||||
}
|
||||
}
|
||||
return charPos;
|
||||
}
|
||||
|
||||
/* 一个模块
|
||||
* #list_ID 对应 DIV 标签中的 id="list_ID"
|
||||
* window.slinky = $('#list_ID').slinky();
|
||||
*/
|
||||
function loadList() {
|
||||
window.slinky = $('#list_knowledge').slinky(); // 百科 / 科普
|
||||
window.slinky = $('#list_community').slinky(); // 博客 / 论坛 / 社区
|
||||
window.slinky = $('#list_create').slinky(); // 创作 / 制作
|
||||
window.slinky = $('#list_media').slinky(); // 多媒体
|
||||
window.slinky = $('#list_tool').slinky(); // 工具
|
||||
window.slinky = $('#list_shopping').slinky(); // 购物
|
||||
window.slinky = $('#list_design').slinky(); // 设计
|
||||
window.slinky = $('#list_life').slinky(); // 生活
|
||||
window.slinky = $('#list_debug').slinky(); // 调试
|
||||
window.slinky = $('#list_network').slinky(); // 网络
|
||||
window.slinky = $('#list_system').slinky(); // 系统
|
||||
window.slinky = $('#list_writing').slinky(); // 写作
|
||||
window.slinky = $('#list_study').slinky(); // 学习
|
||||
window.slinky = $('#list_bank').slinky(); // 银行
|
||||
window.slinky = $('#list_game').slinky(); // 游戏
|
||||
window.slinky = $('#list_news').slinky(); // 资讯
|
||||
window.slinky = $('#list_resource').slinky(); // 资源
|
||||
var aList = document.getElementsByTagName("a");
|
||||
for (var i = 0; i < aList.length; i++) {
|
||||
if (aList[i].href.endsWith("#") == false) {
|
||||
/* 自动加图标（失败）
|
||||
var slashPos = findChar(aList[i].href, '/', 3);
|
||||
getFavicon = aList[i].href.substring(0, slashPos) + "/favicon.ico";
|
||||
var imgTag = "<img src='" + getFavicon + "' />";
|
||||
aList[i].insertAdjacentHTML("beforeBegin", imgTag);
|
||||
*/
|
||||
aList[i].target = "_blank";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 显示列表
|
||||
function displayList() {
|
||||
document.getElementsByTagName("main")[0].style.opacity = "1";
|
||||
document.getElementsByClassName("fullscreen-text")[0].style.opacity = "0";
|
||||
setTimeout("document.getElementsByClassName('fullscreen-text')[0].style.display = 'none';", 1000);
|
||||
}
|
||||
|
||||
setTimeout("loadList();displayList()", 1000);
|
||||
8
docs/js/slinky.min.js
vendored
Normal file
8
docs/js/slinky.min.js
vendored
Normal file
@@ -0,0 +1,8 @@
|
||||
!function(e){var t={};function n(i){if(t[i])return t[i].exports;var r=t[i]={i:i,l:!1,exports:{}};return e[i].call(r.exports,r,r.exports,n),r.l=!0,r.exports}n.m=e,n.c=t,n.d=function(e,t,i){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:i})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var r in e)n.d(i,r,function(t){return e[t]}.bind(null,r));return i},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t,n){n(1),e.exports=n(2)},function(e,t){function n(e,t){var n=Object.keys(e);return Object.getOwnPropertySymbols&&n.push.apply(n,Object.getOwnPropertySymbols(e)),t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),n}function i(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function r(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function s(e,t,n){return t&&r(e.prototype,t),n&&r(e,n),e}
|
||||
/*
|
||||
* Slinky
|
||||
* Rather sweet menus
|
||||
* @author Ali Zahid <ali.zahid@live.com>
|
||||
* @license MIT
|
||||
*/
|
||||
var a=function(){function e(t){var r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.settings=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?n(r,!0).forEach(function(t){i(e,t,r[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):n(r).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})}return e}({},this.options,{},r),this._init(t)}return s(e,[{key:"options",get:function(){return{resize:!0,speed:300,theme:"slinky-theme-default",title:!1}}}]),s(e,[{key:"_init",value:function(e){this.menu=jQuery(e),this.base=this.menu.children().first();var t=this.menu,n=this.settings;t.addClass("slinky-menu").addClass(n.theme),this._transition(n.speed),jQuery("a + ul",t).prev().addClass("next"),jQuery("li > a",t).wrapInner("<span>");var i=jQuery("<li>").addClass("header");jQuery("li > ul",t).prepend(i);var r=jQuery("<a>").prop("href","#").addClass("back");jQuery(".header",t).prepend(r),n.title&&jQuery("li > ul",t).each(function(e,t){var n=jQuery(t).parent().find("a").first().text();if(n){var i=jQuery("<header>").addClass("title").text(n);jQuery("> .header",t).append(i)}}),this._addListeners(),this._jumpToInitial()}},{key:"_addListeners",value:function(){var e=this,t=this.menu,n=this.settings;jQuery("a",t).on("click",function(i){if(e._clicked+n.speed>Date.now())return!1;e._clicked=Date.now();var r=jQuery(i.currentTarget);(0===r.attr("href").indexOf("#")||r.hasClass("next")||r.hasClass("back"))&&i.preventDefault(),r.hasClass("next")?(t.find(".active").removeClass("active"),r.next().show().addClass("active"),e._move(1),n.resize&&e._resize(r.next())):r.hasClass("back")&&(e._move(-1,function(){t.find(".active").removeClass("active"),r.parent().parent().hide().parentsUntil(t,"ul").first().addClass("active")}),n.resize&&e._resize(r.parent().parent().parentsUntil(t,"ul")))})}},{key:"_jumpToInitial",value:function(){var e=this.menu,t=this.settings,n=e.find(".active");n.length>0&&(n.removeClass("active"),this.jump(n,!1)),setTimeout(function(){return e.height(e.outerHeight())},t.speed)}},{key:"_move",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:function(){};if(0!==e){var n=this.settings,i=this.base,r=Math.round(parseInt(i.get(0).style.left))||0;i.css("left","".concat(r-100*e,"%")),"function"==typeof t&&setTimeout(t,n.speed)}}},{key:"_resize",value:function(e){this.menu.height(e.outerHeight())}},{key:"_transition",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:300,t=this.menu,n=this.base;t.css("transition-duration","".concat(e,"ms")),n.css("transition-duration","".concat(e,"ms"))}},{key:"jump",value:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1];if(e){var n=this.menu,i=this.settings,r=jQuery(e),s=n.find(".active"),a=0;s.length>0&&(a=s.parentsUntil(n,"ul").length),n.find("ul").removeClass("active").hide();var o=r.parentsUntil(n,"ul");o.show(),r.show().addClass("active"),t||this._transition(0),this._move(o.length-a),i.resize&&this._resize(r),t||this._transition(i.speed)}}},{key:"home",value:function(){var e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],t=this.base,n=this.menu,i=this.settings;e||this._transition(0);var r=n.find(".active"),s=r.parentsUntil(n,"ul");this._move(-s.length,function(){r.removeClass("active").hide(),s.not(t).hide()}),i.resize&&this._resize(t),!1===e&&this._transition(i.speed)}},{key:"destroy",value:function(){var e=this,t=this.base,n=this.menu;jQuery(".header",n).remove(),jQuery("a",n).removeClass("next").off("click"),n.css({height:"","transition-duration":""}),t.css({left:"","transition-duration":""}),jQuery("li > a > span",n).contents().unwrap(),n.find(".active").removeClass("active"),n.attr("class").split(" ").forEach(function(e){0===e.indexOf("slinky")&&n.removeClass(e)});["settings","menu","base"].forEach(function(t){return delete e[t]})}}]),e}();jQuery.fn.slinky=function(e){return new a(this,e)}},function(e,t,n){}]);
|
||||
Reference in New Issue
Block a user