From 42e0fe9139261d1af929d3ce82816143a95738eb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=98=94=E8=90=BD?=
<45323514+BigCoke233@users.noreply.github.com>
Date: Sat, 6 Apr 2019 15:01:25 +0800
Subject: =?UTF-8?q?=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
assets/css/mark.min.css | 188 +++++++------------
assets/css/nprogress.css | 74 ++++++++
assets/js/nprogress.js | 480 +++++++++++++++++++++++++++++++++++++++++++++++
3 files changed, 624 insertions(+), 118 deletions(-)
create mode 100644 assets/css/nprogress.css
create mode 100644 assets/js/nprogress.js
diff --git a/assets/css/mark.min.css b/assets/css/mark.min.css
index e1e7195..af46a7f 100644
--- a/assets/css/mark.min.css
+++ b/assets/css/mark.min.css
@@ -12,14 +12,26 @@ body{
p{
font-size:1.1em;
}
+.post-content a{
+ color:#4D90FE;
+ border-bottom:1px solid #4D90FE;
+ display:inline-block;
+ padding-bottom:0!important;
+}
a{
color:black;
+}
+a,.post-content a{
transition:all 0.3s;
}
a:hover,a:active{
opacity:0.9;
text-decoration:none;
- color:#808080;
+ color:#4D90FE;
+}
+.gallery-link{
+ border:none!important;
+ padding:0!important;
}
/* 各种css */
.item{
@@ -28,6 +40,12 @@ a:hover,a:active{
-webkit-box-shadow:0 0 8px #ccc;
padding:15px;
}
+.item-hr{
+ margin-left:-15px;
+ margin-right:-15px;
+ margin-bottom:5px;
+ margin-top:5px;
+}
/* 文章及文章列表 */
.post-item{
transition:all 0.5s;
@@ -35,7 +53,7 @@ a:hover,a:active{
}
.post-item:hover{
box-shadow:0 2px 12px #ccc;
- -webkit-box-shadow:0 2px 12px #ccc;
+ -webkit-box-shadow:0 2px 16px #ccc;
}
.post-header{
margin-top:20px;
@@ -61,7 +79,7 @@ a:hover,a:active{
margin-bottom:-15px;
}
.post-banner{
- margin-bottom:10px;
+ margin-bottom:20px!important;
margin:-15px;
padding:0;
}
@@ -100,7 +118,7 @@ a:hover,a:active{
padding:10px;
}
.item{
- font-family:华文细黑,微软雅黑;
+ font-family:微软雅黑;
}
.post-content,.page-content{
margin-top:30px;
@@ -129,7 +147,7 @@ a:hover,a:active{
margin-top:26px;
margin-bottom:26px;
padding:12px;
- font-weight:bold;
+ font-weight:normal;
}
.post-content blockquote{
background:#F8F8FF;
@@ -179,14 +197,22 @@ a:hover,a:active{
.read-more{
margin-top:-36px;
}
+/* 社会图标及打赏 */
+.social-share{
+ display:inline-block;
+ font-size:28px;
+ color:#bababa;
+ letter-spacing:20px;
+}
+
/* Nb首页大图 */
.jumbotron{
- height:50vh;
+ height:60vh;
box-shadow:0 0 10px #808080;
color:white;
text-align:Center;
- padding-top:20vh;
+ padding-top:25vh;
text-shadow:0 0 10px #bababa;
}
/* 评论 */
@@ -203,11 +229,9 @@ a:hover,a:active{
resize:none;
padding:10px;
}
-.comment-body{
- background-color:#fff;
- box-shadow:0 0 8px #ccc;
- -webkit-box-shadow:0 0 8px #ccc;
- padding:15px;
+.comment-list-wrap{
+ margin-left:-40px;
+ padding:20px;
}
.comment-list-wrap ol{
list-style-type:none;
@@ -222,6 +246,18 @@ a:hover,a:active{
}
.comment-reply{
text-align:right;
+ visibility:hidden;
+ margin-top:-20px;
+}
+.comment-body:hover .comment-reply{
+ visibility:visible!important;
+}
+.comment-parent{
+ border-bottom:1px solid #F5F5F5;
+ margin-top:20px;
+}
+.comment-child .comment-child{
+ margin-left:-40px;
}
.comment-reply a{
font-size:1em;
@@ -241,24 +277,10 @@ a:hover,a:active{
-webkit-box-shadow:0 0 0.55em #bababa;
margin-right:0.3em;
}
-.comment-body{
- padding:1em;
- -webkit-box-shadow:0 0 0.5em #bababa;
- background:white;
- margin-left:-40px;
- margin-top:0.5em;
- transition:box-shadow 0.4s;
-}
-.comment-body:hover{
- -webkit-box-shadow:0 0 1em #bababa;
- opacity:1
-}
.comment-meta a{
color:#bababa;
font-size:10px;
}
-
-
/* owo */
.OwO-logo{
display:inline-block;
@@ -334,6 +356,12 @@ a:hover,a:active{
.sidebar li,.sidebar li>a{
color:gray;
}
+.sidebar .list-group>li{
+ transition:background 0.4s;
+}
+.sidebar .list-group>li:hover{
+ background:#F6F6EF;
+}
.avatar-bg{
background-repeat:no-repeat;
background-size:cover;
@@ -439,6 +467,7 @@ a:hover,a:active{
/* 友链 */
.links-box{
margin:10px;
+ margin-top:30px;
}
.links-box h2{
text-align:Center;
@@ -451,15 +480,20 @@ a:hover,a:active{
}
.links-item{
background:#fff;
- border:1px solid #dcdcdc;
- box-shadow:0 0 26px #bababa;
- -webkit-box-shadow:0 0 26px #bababa;
+ box-shadow:0 2px 1px #ddd;
+ -webkit-box-shadow:0 1px 2px #ddd;
overflow:hidden;
transition:all 0.2s!important;
- margin-bottom:15px;
+ margin-bottom:20px;
}
.links-item:hover{
- transform:scale(0.95)
+ transform:scale(1.05);
+ box-shadow:0 6px 22px #ddd;
+ -webkit-box-shadow:0 6px 22px #ddd;
+ transform:translateY(-6px);
+}
+.link-box a{
+ color:black;
}
.links-title{
text-align:Center;
@@ -468,7 +502,6 @@ a:hover,a:active{
font-weight:bold;
letter-spacing:2px;
white-space: nowrap;
- text-shadow:0 0 1px #808080;
}
/* 归档 */
.archive-list ul{
@@ -490,7 +523,7 @@ a:hover,a:active{
/* pjax */
.pjax-loading{
- opacity:0.8;
+ opacity:0.4;
}
.pjax-loadend{
opacity:1;
@@ -499,87 +532,6 @@ a:hover,a:active{
transition:opacity 0.5s;
}
-.unvisible{
- display:none;!important;
-}
-
-.spinner {
- margin: 100px auto;
- width: 50px;
- height: 60px;
- text-align: center;
- font-size: 10px;
- z-index:9999;
- position: fixed;
- margin: 100px auto;
- top:30vh;
- bottom:30vh;
- left:30vw;
- right:30vw;
-}
-
-.spinner > div {
- background-color: #00BFFF;
- height: 100%;
- width: 6px;
- display: inline-block;
-
- -webkit-animation: stretchdelay 1.2s infinite ease-in-out;
- animation: stretchdelay 1.2s infinite ease-in-out;
-}
-
-.spinner .rect2 {
- -webkit-animation-delay: -1.1s;
- animation-delay: -1.1s;
-}
-
-.spinner .rect3 {
- -webkit-animation-delay: -1.0s;
- animation-delay: -1.0s;
-}
-
-.spinner .rect4 {
- -webkit-animation-delay: -0.9s;
- animation-delay: -0.9s;
-}
-
-.spinner .rect5 {
- -webkit-animation-delay: -0.8s;
- animation-delay: -0.8s;
-}
-
-@-webkit-keyframes stretchdelay {
- 0%, 40%, 100% { -webkit-transform: scaleY(0.4) }
- 20% { -webkit-transform: scaleY(1.0) }
-}
-
-@keyframes stretchdelay {
- 0%, 40%, 100% {
- transform: scaleY(0.4);
- -webkit-transform: scaleY(0.4);
- } 20% {
- transform: scaleY(1.0);
- -webkit-transform: scaleY(1.0);
- }
-}
-.unvisible-cover{
- opacity:0;
- display:none;
- transition:opacity 0.5s;
-}
-.viewport-cover{
- height:100vh;
- width:100vw;
- background:#fff;
- opacity:0.5;
- z-index:100;
- position:fixed;
- top:0;
- bottom:0;
- right:0;
- left:0;
- transition:opacity 0.5s;
-}
/* 文章内短代码 */
.tip{
display:block;
@@ -587,7 +539,7 @@ a:hover,a:active{
background-color:rgb(250,250,250);
border-left:5px solid #ddd;
border-radius:2px;
- color:#A9A9A9;
+ color:#332244;
}
.tip.lblue{
border-color:#4D90FE!important;
@@ -614,9 +566,9 @@ a:hover,a:active{
border-radius:4px;
box-shadow:0 0 1px #bababa inset;
}
-.post-content .list-group{
- width:100%;
- margin-left:-20px;
+.post-content a.btn{
+ padding-bottom:6px!important;
+ color:white;
}
diff --git a/assets/css/nprogress.css b/assets/css/nprogress.css
new file mode 100644
index 0000000..6752d7f
--- /dev/null
+++ b/assets/css/nprogress.css
@@ -0,0 +1,74 @@
+/* Make clicks pass-through */
+#nprogress {
+ pointer-events: none;
+}
+
+#nprogress .bar {
+ background: #29d;
+
+ position: fixed;
+ z-index: 1031;
+ top: 0;
+ left: 0;
+
+ width: 100%;
+ height: 2px;
+}
+
+/* Fancy blur effect */
+#nprogress .peg {
+ display: block;
+ position: absolute;
+ right: 0px;
+ width: 100px;
+ height: 100%;
+ box-shadow: 0 0 10px #29d, 0 0 5px #29d;
+ opacity: 1.0;
+
+ -webkit-transform: rotate(3deg) translate(0px, -4px);
+ -ms-transform: rotate(3deg) translate(0px, -4px);
+ transform: rotate(3deg) translate(0px, -4px);
+}
+
+/* Remove these to get rid of the spinner */
+#nprogress .spinner {
+ display: block;
+ position: fixed;
+ z-index: 1031;
+ top: 15px;
+ right: 15px;
+}
+
+#nprogress .spinner-icon {
+ width: 18px;
+ height: 18px;
+ box-sizing: border-box;
+
+ border: solid 2px transparent;
+ border-top-color: #29d;
+ border-left-color: #29d;
+ border-radius: 50%;
+
+ -webkit-animation: nprogress-spinner 400ms linear infinite;
+ animation: nprogress-spinner 400ms linear infinite;
+}
+
+.nprogress-custom-parent {
+ overflow: hidden;
+ position: relative;
+}
+
+.nprogress-custom-parent #nprogress .spinner,
+.nprogress-custom-parent #nprogress .bar {
+ position: absolute;
+}
+
+@-webkit-keyframes nprogress-spinner {
+ 0% { -webkit-transform: rotate(0deg); }
+ 100% { -webkit-transform: rotate(360deg); }
+}
+@keyframes nprogress-spinner {
+ 0% { transform: rotate(0deg); }
+ 100% { transform: rotate(360deg); }
+}
+
diff --git a/assets/js/nprogress.js b/assets/js/nprogress.js
new file mode 100644
index 0000000..beb9d2c
--- /dev/null
+++ b/assets/js/nprogress.js
@@ -0,0 +1,480 @@
+/* NProgress, (c) 2013, 2014 Rico Sta. Cruz - http://ricostacruz.com/nprogress
+ * @license MIT */
+
+;(function(root, factory) {
+
+ if (typeof define === 'function' && define.amd) {
+ define(factory);
+ } else if (typeof exports === 'object') {
+ module.exports = factory();
+ } else {
+ root.NProgress = factory();
+ }
+
+})(this, function() {
+ var NProgress = {};
+
+ NProgress.version = '0.2.0';
+
+ var Settings = NProgress.settings = {
+ minimum: 0.08,
+ easing: 'linear',
+ positionUsing: '',
+ speed: 200,
+ trickle: true,
+ trickleSpeed: 200,
+ showSpinner: true,
+ barSelector: '[role="bar"]',
+ spinnerSelector: '[role="spinner"]',
+ parent: 'body',
+ template: ''
+ };
+
+ /**
+ * Updates configuration.
+ *
+ * NProgress.configure({
+ * minimum: 0.1
+ * });
+ */
+ NProgress.configure = function(options) {
+ var key, value;
+ for (key in options) {
+ value = options[key];
+ if (value !== undefined && options.hasOwnProperty(key)) Settings[key] = value;
+ }
+
+ return this;
+ };
+
+ /**
+ * Last number.
+ */
+
+ NProgress.status = null;
+
+ /**
+ * Sets the progress bar status, where `n` is a number from `0.0` to `1.0`.
+ *
+ * NProgress.set(0.4);
+ * NProgress.set(1.0);
+ */
+
+ NProgress.set = function(n) {
+ var started = NProgress.isStarted();
+
+ n = clamp(n, Settings.minimum, 1);
+ NProgress.status = (n === 1 ? null : n);
+
+ var progress = NProgress.render(!started),
+ bar = progress.querySelector(Settings.barSelector),
+ speed = Settings.speed,
+ ease = Settings.easing;
+
+ progress.offsetWidth; /* Repaint */
+
+ queue(function(next) {
+ // Set positionUsing if it hasn't already been set
+ if (Settings.positionUsing === '') Settings.positionUsing = NProgress.getPositioningCSS();
+
+ // Add transition
+ css(bar, barPositionCSS(n, speed, ease));
+
+ if (n === 1) {
+ // Fade out
+ css(progress, {
+ transition: 'none',
+ opacity: 1
+ });
+ progress.offsetWidth; /* Repaint */
+
+ setTimeout(function() {
+ css(progress, {
+ transition: 'all ' + speed + 'ms linear',
+ opacity: 0
+ });
+ setTimeout(function() {
+ NProgress.remove();
+ next();
+ }, speed);
+ }, speed);
+ } else {
+ setTimeout(next, speed);
+ }
+ });
+
+ return this;
+ };
+
+ NProgress.isStarted = function() {
+ return typeof NProgress.status === 'number';
+ };
+
+ /**
+ * Shows the progress bar.
+ * This is the same as setting the status to 0%, except that it doesn't go backwards.
+ *
+ * NProgress.start();
+ *
+ */
+ NProgress.start = function() {
+ if (!NProgress.status) NProgress.set(0);
+
+ var work = function() {
+ setTimeout(function() {
+ if (!NProgress.status) return;
+ NProgress.trickle();
+ work();
+ }, Settings.trickleSpeed);
+ };
+
+ if (Settings.trickle) work();
+
+ return this;
+ };
+
+ /**
+ * Hides the progress bar.
+ * This is the *sort of* the same as setting the status to 100%, with the
+ * difference being `done()` makes some placebo effect of some realistic motion.
+ *
+ * NProgress.done();
+ *
+ * If `true` is passed, it will show the progress bar even if its hidden.
+ *
+ * NProgress.done(true);
+ */
+
+ NProgress.done = function(force) {
+ if (!force && !NProgress.status) return this;
+
+ return NProgress.inc(0.3 + 0.5 * Math.random()).set(1);
+ };
+
+ /**
+ * Increments by a random amount.
+ */
+
+ NProgress.inc = function(amount) {
+ var n = NProgress.status;
+
+ if (!n) {
+ return NProgress.start();
+ } else if(n > 1) {
+ return;
+ } else {
+ if (typeof amount !== 'number') {
+ if (n >= 0 && n < 0.2) { amount = 0.1; }
+ else if (n >= 0.2 && n < 0.5) { amount = 0.04; }
+ else if (n >= 0.5 && n < 0.8) { amount = 0.02; }
+ else if (n >= 0.8 && n < 0.99) { amount = 0.005; }
+ else { amount = 0; }
+ }
+
+ n = clamp(n + amount, 0, 0.994);
+ return NProgress.set(n);
+ }
+ };
+
+ NProgress.trickle = function() {
+ return NProgress.inc();
+ };
+
+ /**
+ * Waits for all supplied jQuery promises and
+ * increases the progress as the promises resolve.
+ *
+ * @param $promise jQUery Promise
+ */
+ (function() {
+ var initial = 0, current = 0;
+
+ NProgress.promise = function($promise) {
+ if (!$promise || $promise.state() === "resolved") {
+ return this;
+ }
+
+ if (current === 0) {
+ NProgress.start();
+ }
+
+ initial++;
+ current++;
+
+ $promise.always(function() {
+ current--;
+ if (current === 0) {
+ initial = 0;
+ NProgress.done();
+ } else {
+ NProgress.set((initial - current) / initial);
+ }
+ });
+
+ return this;
+ };
+
+ })();
+
+ /**
+ * (Internal) renders the progress bar markup based on the `template`
+ * setting.
+ */
+
+ NProgress.render = function(fromStart) {
+ if (NProgress.isRendered()) return document.getElementById('nprogress');
+
+ addClass(document.documentElement, 'nprogress-busy');
+
+ var progress = document.createElement('div');
+ progress.id = 'nprogress';
+ progress.innerHTML = Settings.template;
+
+ var bar = progress.querySelector(Settings.barSelector),
+ perc = fromStart ? '-100' : toBarPerc(NProgress.status || 0),
+ parent = document.querySelector(Settings.parent),
+ spinner;
+
+ css(bar, {
+ transition: 'all 0 linear',
+ transform: 'translate3d(' + perc + '%,0,0)'
+ });
+
+ if (!Settings.showSpinner) {
+ spinner = progress.querySelector(Settings.spinnerSelector);
+ spinner && removeElement(spinner);
+ }
+
+ if (parent != document.body) {
+ addClass(parent, 'nprogress-custom-parent');
+ }
+
+ parent.appendChild(progress);
+ return progress;
+ };
+
+ /**
+ * Removes the element. Opposite of render().
+ */
+
+ NProgress.remove = function() {
+ removeClass(document.documentElement, 'nprogress-busy');
+ removeClass(document.querySelector(Settings.parent), 'nprogress-custom-parent');
+ var progress = document.getElementById('nprogress');
+ progress && removeElement(progress);
+ };
+
+ /**
+ * Checks if the progress bar is rendered.
+ */
+
+ NProgress.isRendered = function() {
+ return !!document.getElementById('nprogress');
+ };
+
+ /**
+ * Determine which positioning CSS rule to use.
+ */
+
+ NProgress.getPositioningCSS = function() {
+ // Sniff on document.body.style
+ var bodyStyle = document.body.style;
+
+ // Sniff prefixes
+ var vendorPrefix = ('WebkitTransform' in bodyStyle) ? 'Webkit' :
+ ('MozTransform' in bodyStyle) ? 'Moz' :
+ ('msTransform' in bodyStyle) ? 'ms' :
+ ('OTransform' in bodyStyle) ? 'O' : '';
+
+ if (vendorPrefix + 'Perspective' in bodyStyle) {
+ // Modern browsers with 3D support, e.g. Webkit, IE10
+ return 'translate3d';
+ } else if (vendorPrefix + 'Transform' in bodyStyle) {
+ // Browsers without 3D support, e.g. IE9
+ return 'translate';
+ } else {
+ // Browsers without translate() support, e.g. IE7-8
+ return 'margin';
+ }
+ };
+
+ /**
+ * Helpers
+ */
+
+ function clamp(n, min, max) {
+ if (n < min) return min;
+ if (n > max) return max;
+ return n;
+ }
+
+ /**
+ * (Internal) converts a percentage (`0..1`) to a bar translateX
+ * percentage (`-100%..0%`).
+ */
+
+ function toBarPerc(n) {
+ return (-1 + n) * 100;
+ }
+
+
+ /**
+ * (Internal) returns the correct CSS for changing the bar's
+ * position given an n percentage, and speed and ease from Settings
+ */
+
+ function barPositionCSS(n, speed, ease) {
+ var barCSS;
+
+ if (Settings.positionUsing === 'translate3d') {
+ barCSS = { transform: 'translate3d('+toBarPerc(n)+'%,0,0)' };
+ } else if (Settings.positionUsing === 'translate') {
+ barCSS = { transform: 'translate('+toBarPerc(n)+'%,0)' };
+ } else {
+ barCSS = { 'margin-left': toBarPerc(n)+'%' };
+ }
+
+ barCSS.transition = 'all '+speed+'ms '+ease;
+
+ return barCSS;
+ }
+
+ /**
+ * (Internal) Queues a function to be executed.
+ */
+
+ var queue = (function() {
+ var pending = [];
+
+ function next() {
+ var fn = pending.shift();
+ if (fn) {
+ fn(next);
+ }
+ }
+
+ return function(fn) {
+ pending.push(fn);
+ if (pending.length == 1) next();
+ };
+ })();
+
+ /**
+ * (Internal) Applies css properties to an element, similar to the jQuery
+ * css method.
+ *
+ * While this helper does assist with vendor prefixed property names, it
+ * does not perform any manipulation of values prior to setting styles.
+ */
+
+ var css = (function() {
+ var cssPrefixes = [ 'Webkit', 'O', 'Moz', 'ms' ],
+ cssProps = {};
+
+ function camelCase(string) {
+ return string.replace(/^-ms-/, 'ms-').replace(/-([\da-z])/gi, function(match, letter) {
+ return letter.toUpperCase();
+ });
+ }
+
+ function getVendorProp(name) {
+ var style = document.body.style;
+ if (name in style) return name;
+
+ var i = cssPrefixes.length,
+ capName = name.charAt(0).toUpperCase() + name.slice(1),
+ vendorName;
+ while (i--) {
+ vendorName = cssPrefixes[i] + capName;
+ if (vendorName in style) return vendorName;
+ }
+
+ return name;
+ }
+
+ function getStyleProp(name) {
+ name = camelCase(name);
+ return cssProps[name] || (cssProps[name] = getVendorProp(name));
+ }
+
+ function applyCss(element, prop, value) {
+ prop = getStyleProp(prop);
+ element.style[prop] = value;
+ }
+
+ return function(element, properties) {
+ var args = arguments,
+ prop,
+ value;
+
+ if (args.length == 2) {
+ for (prop in properties) {
+ value = properties[prop];
+ if (value !== undefined && properties.hasOwnProperty(prop)) applyCss(element, prop, value);
+ }
+ } else {
+ applyCss(element, args[1], args[2]);
+ }
+ }
+ })();
+
+ /**
+ * (Internal) Determines if an element or space separated list of class names contains a class name.
+ */
+
+ function hasClass(element, name) {
+ var list = typeof element == 'string' ? element : classList(element);
+ return list.indexOf(' ' + name + ' ') >= 0;
+ }
+
+ /**
+ * (Internal) Adds a class to an element.
+ */
+
+ function addClass(element, name) {
+ var oldList = classList(element),
+ newList = oldList + name;
+
+ if (hasClass(oldList, name)) return;
+
+ // Trim the opening space.
+ element.className = newList.substring(1);
+ }
+
+ /**
+ * (Internal) Removes a class from an element.
+ */
+
+ function removeClass(element, name) {
+ var oldList = classList(element),
+ newList;
+
+ if (!hasClass(element, name)) return;
+
+ // Replace the class name.
+ newList = oldList.replace(' ' + name + ' ', ' ');
+
+ // Trim the opening and closing spaces.
+ element.className = newList.substring(1, newList.length - 1);
+ }
+
+ /**
+ * (Internal) Gets a space separated list of the class names on the element.
+ * The list is wrapped with a single space on each end to facilitate finding
+ * matches within the list.
+ */
+
+ function classList(element) {
+ return (' ' + (element && element.className || '') + ' ').replace(/\s+/gi, ' ');
+ }
+
+ /**
+ * (Internal) Removes an element from the DOM.
+ */
+
+ function removeElement(element) {
+ element && element.parentNode && element.parentNode.removeChild(element);
+ }
+
+ return NProgress;
+});
--
cgit v1.2.3