diff options
Diffstat (limited to 'assets')
| -rw-r--r-- | assets/css/dark.miracles.css | 277 | ||||
| -rw-r--r-- | assets/css/miracles.min.css | 131 | ||||
| -rw-r--r-- | assets/js/miracles.min.js | 15 |
3 files changed, 362 insertions, 61 deletions
diff --git a/assets/css/dark.miracles.css b/assets/css/dark.miracles.css index c325249..b96aeb7 100644 --- a/assets/css/dark.miracles.css +++ b/assets/css/dark.miracles.css @@ -1 +1,276 @@ -@charset 'utf-8';.body-dark{background:#4b4b4b;color:#fafafa}.body-dark .post-content code{background:#505050}.body-dark .post-content img:not(.OwO-img){box-shadow:0 2px 10px #323232;-moz-box-shadow:0 2px 10px #323232;-webkit-box-shadow:0 2px 10px #323232}.body-dark .post-content tr:nth-child(odd){background:#6e6e6e}.body-dark .post-content hr{background:#787878}.body-dark .post-meta a{color:gray!important}.body-dark .comment-reply a{background:0 0}.body-dark .options{box-shadow:0 0 0 #fff;-moz-box-shadow:0 0 0 #fff;-webkit-box-shadow:0 0 0 #fff}.body-dark .OwO .OwO-body .OwO-items .OwO-item:hover,.body-dark .OwO-body,.body-dark .OwO-open .OwO-logo,.body-dark .bubble.saying-body:hover,.body-dark .comment-pagenav a,.body-dark .dark-button,.body-dark .options,.body-dark .post-body,.body-dark .post-item,.body-dark .post-pagenav a{box-shadow:0 0 36px #323232!important;-moz-box-shadow:0 0 36px #323232!important;-webkit-box-shadow:0 0 36px #323232!important}.body-dark .gotop-button,.body-dark .links-item{box-shadow:0 1px 3px #323232!important}.body-dark .gotop-button:hover,.body-dark .links-item:hover{box-shadow:0 4px 22px #323232!important}.body-dark .archives-list a:hover,.body-dark .bubble.comment-content,.body-dark .bubble.saying-body,.body-dark .comment-author,.body-dark .comment-by-author .bubble.comment-content,.body-dark .comment-pagenav a,.body-dark .comment-submit button,.body-dark .drawer-content a:hover,.body-dark .drawer-footer,.body-dark .drawer-search,.body-dark .options-button-active,.body-dark .tags-item a{background:#646464!important}.body-dark .OwO-body,.body-dark .OwO-logo,.body-dark .OwO-package-active,.body-dark .OwO-packages li:hover,.body-dark .comment-form input,.body-dark .comment-form textarea,.body-dark .comment-reply a:hover,.body-dark .dark-button,.body-dark .dialog,.body-dark .drawer,.body-dark .drawer-icon,.body-dark .drawer-search-form button,.body-dark .drawer-search-form input,.body-dark .gotop-button,.body-dark .links-item,.body-dark .options,.body-dark .options-family-button,.body-dark .options-theme-label,.body-dark .post-body,.body-dark .post-content th,.body-dark .post-item,.body-dark .post-pagenav a,.body-dark .saying-textarea,.body-dark .search-form input{background:#5a5a5a!important}.body-dark .OwO-bar,.body-dark .OwO-item{background:#6e6e6e!important}.body-dark .OwO-bar,.body-dark .OwO-logo,.body-dark .comment,.body-dark .comment a,.body-dark .comment-content p,.body-dark .comment-form input,.body-dark .comment-form textarea,.body-dark .dark-button,.body-dark .drawer,.body-dark .drawer a,.body-dark .drawer-icon,.body-dark .drawer-open .drawer-button,.body-dark .drawer-search-form button,.body-dark .drawer-search-form input,.body-dark .footer-info,.body-dark .footer-info a,.body-dark .gotop-button,.body-dark .login,.body-dark .login-close,.body-dark .mobile-menu,.body-dark .mobile-menu a,.body-dark .mobile-menu-close,.body-dark .mobile-menu-footer,.body-dark .nav,.body-dark .nav a,.body-dark .options-contentsize-button,.body-dark .options-family-button,.body-dark .options-theme-item:hover .options-theme-label,.body-dark .post-body,.body-dark .post-body a,.body-dark .post-content blockquote,.body-dark .post-item,.body-dark .post-item a,.body-dark .search-close,.body-dark .search-form button,.body-darl .login a{color:#fafafa!important}.body-dark .options-theme-label{color:#5a5a5a!important}.body-dark .OwO-body,.body-dark .OwO-logo,.body-dark .comment-form input,.body-dark .comment-form textarea,.body-dark .drawer,.body-dark .drawer-search-form button,.body-dark .drawer-search-form input,.body-dark .mobile-menu-footer,.body-dark .mobile-menu-title,.body-dark .options hr,.body-dark .post-content blockquote,.body-dark .post-content table,.body-dark .post-content td,.body-dark .post-content th,.body-dark .post-content tr,.body-dark .saying-textarea{border-color:#6e6e6e!important}.body-dark .tip{border-top-color:#6e6e6e!important;border-bottom-color:#6e6e6e!important;border-right-color:#6e6e6e!important}.body-dark .bubble.comment-content:before,.body-dark .bubble.saying-body:before,.body-dark .comment-by-author .bubble.comment-content:before{border-right-color:#646464!important}.body-dark .dark-cover{background:rgba(10,10,10,.35)}.body-dark .footer-info{background:#3c3c3c!important}.body-dark .nav{background:rgba(50,50,50,.9)!important;box-shadow:0 0 20px #000;-webkit-box-shadow:0 0 20px #000;-moz-box-shadow:0 0 30px #000}.body-dark .mobile-menu-pagelist a:hover,.body-dark .nav a:hover,.body-dark .nav-mobile-title:hover{background:#646464}.body-dark .nav-icon-button{background:#5a5a5a}.body-dark .nav-icon-button{color:#fff}.body-dark .nav-icon-button:hover,.body-dark .search-close{background:#5a5a5a}.body-dark img{filter:brightness(90%)}.body-dark .aplayer-pic,.body-dark .post-banner,.body-dark iframe{filter:brightness(75%)}.body-dark .login,.body-dark .mobile-menu,.body-dark .search{background:rgba(90,90,90,.95)}.body-dark .pio-container .pio-dialog{color:#fff;box-shadow:1px 1px 15px #505050;-webkit-box-shadow:1px 1px 15px #505050;-moz-box-shadow:1px 1px 15px #505050;background:rgba(90,90,90,.9)}.body-dark .pio-action span{background-color:rgba(90,90,90,.9)}.body-dark .aplayer,.body-dark .aplayer .aplayer-author,.body-dark .aplayer .aplayer-controller,.body-dark .aplayer .aplayer-icon,.body-dark .aplayer .aplayer-info,.body-dark .aplayer .aplayer-lrc-contents p,.body-dark .aplayer-list-author,.body-dark .aplayer-list-index{color:#f0f0f0!important}.body-dark .aplayer{background:#646464}.body-dark .aplayer .aplayer-list ol li:hover,.body-dark .aplayer-list-light{background:#8c8c8c!important}.body-dark .aplayer .aplayer-lrc:after,.body-dark .aplayer .aplayer-lrc:before{background:0 0;background:0 0;filter:none}.body-dark .aplayer .aplayer-list ol li{border-color:#787878}.body-dark .aplayer-list::-webkit-scrollbar{background:#6e6e6e!important}.body-dark .aplayer-list::-webkit-scrollbar-thumb{background:#505050}.body-dark .aplayer-info{border:none}
\ No newline at end of file +@charset 'utf-8';
+
+/*
+ * Dark theme for Miracles
+ * Author: Eltrac
+ * License: MIT
+ */
+
+.body-dark {
+ background:#4b4b4b;
+ color:#fafafa
+}
+
+/**
+ * Special
+ */
+
+/* Post Content */
+.body-dark .post-content code {
+ background:#505050
+}
+.body-dark .post-content img:not(.OwO-img) {
+ box-shadow:0 2px 10px #323232;
+ -moz-box-shadow:0 2px 10px #323232;
+ -webkit-box-shadow:0 2px 10px #323232
+}
+.body-dark .post-content tr:nth-child(odd) {
+ background:#6e6e6e
+}
+.body-dark .post-content hr {
+ background:#787878
+}
+/* Pio Plugin */
+.body-dark .pio-container .pio-dialog {
+ color:#fff;
+ box-shadow:1px 1px 15px #505050;
+ -webkit-box-shadow:1px 1px 15px #505050;
+ -moz-box-shadow:1px 1px 15px #505050;
+ background:rgba(90,90,90,.9)
+}
+.body-dark .pio-action span {
+ background-color:rgba(90,90,90,.9)
+}
+/* Aplayer */
+.body-dark .aplayer,
+.body-dark .aplayer .aplayer-author,
+.body-dark .aplayer .aplayer-controller,
+.body-dark .aplayer .aplayer-icon,
+.body-dark .aplayer .aplayer-info,
+.body-dark .aplayer .aplayer-lrc-contents p,
+.body-dark .aplayer-list-author,
+.body-dark .aplayer-list-index {
+ color:#f0f0f0!important
+}
+.body-dark .aplayer {
+ background:#646464
+}
+.body-dark .aplayer .aplayer-list ol li:hover,
+.body-dark .aplayer-list-light {
+ background:#8c8c8c!important
+}
+.body-dark .aplayer .aplayer-lrc:after,
+.body-dark .aplayer .aplayer-lrc:before {
+ background:0 0;
+ background:0 0;
+ filter:none
+}
+.body-dark .aplayer .aplayer-list ol li {
+ border-color:#787878
+}
+.body-dark .aplayer-list::-webkit-scrollbar {
+ background:#6e6e6e!important
+}
+.body-dark .aplayer-list::-webkit-scrollbar-thumb {
+ background:#505050
+}
+.body-dark .aplayer-info {
+ border:none
+}
+/* Nav/Search/login */
+.body-dark .nav {
+ background:rgba(50,50,50,.9)!important;
+ box-shadow:0 0 20px #000;
+ -webkit-box-shadow:0 0 20px #000;
+ -moz-box-shadow:0 0 30px #000
+}
+.body-dark .mobile-menu-pagelist a:hover,
+.body-dark .nav a:hover,
+.body-dark .nav-mobile-title:hover {
+ background:#646464
+}
+.body-dark .nav-icon-button {
+ background:#5a5a5a
+}
+.body-dark .nav-icon-button {
+ color:#fff
+}
+.body-dark .nav-icon-button:hover,
+.body-dark .search-close {
+ background:#5a5a5a
+}
+.body-dark .login,
+.body-dark .mobile-menu,
+.body-dark .search {
+ background:rgba(90,90,90,.95)
+}
+/* Others */
+.body-dark .post-meta a {
+ color: gray!important
+}
+.body-dark .comment-reply a {
+ background: 0 0
+}
+.body-dark .footer-info {
+ background:#3c3c3c!important
+}
+
+/**
+ * Normal
+ */
+
+/* Need shadow */
+.body-dark .options {
+ box-shadow:0 0 0 #fff;
+ -moz-box-shadow:0 0 0 #fff;
+ -webkit-box-shadow:0 0 0 #fff
+}
+.body-dark .OwO .OwO-body .OwO-items .OwO-item:hover,
+.body-dark .OwO-body,.body-dark .OwO-open .OwO-logo,
+.body-dark .bubble.saying-body:hover,
+.body-dark .comment-pagenav a,
+.body-dark .dark-button,
+.body-dark .options,
+.body-dark .post-body,
+.body-dark .post-item,
+.body-dark .post-pagenav a {
+ box-shadow:0 0 36px #323232!important;
+ -moz-box-shadow:0 0 36px #323232!important;
+ -webkit-box-shadow:0 0 36px #323232!important
+}
+.body-dark .gotop-button,
+.body-dark .links-item {
+ box-shadow:0 1px 3px #323232!important
+}
+.body-dark .gotop-button:hover,
+.body-dark .links-item:hover {
+ box-shadow:0 4px 22px #323232!important
+}
+/* Need #646464 bg */
+.body-dark .archives-list a:hover,
+.body-dark .bubble.comment-content,
+.body-dark .bubble.saying-body,
+.body-dark .comment-author,
+.body-dark .comment-by-author .bubble.comment-content,
+.body-dark .comment-pagenav a,
+.body-dark .comment-submit button,
+.body-dark .drawer-content a:hover,
+.body-dark .drawer-footer,.body-dark .drawer-search,
+.body-dark .options-button-active,
+.body-dark .tags-item a {
+ background: #646464!important
+}
+/* Need #5a5a5a bg */
+.body-dark .OwO-body,
+.body-dark .OwO-logo,
+.body-dark .OwO-package-active,
+.body-dark .OwO-packages li:hover,
+.body-dark .comment-form input,
+.body-dark .comment-form textarea,
+.body-dark .comment-reply a:hover,
+.body-dark .dark-button,.body-dark .dialog,
+.body-dark .drawer,
+.body-dark .drawer-icon,
+.body-dark .drawer-search-form button,
+.body-dark .drawer-search-form input,
+.body-dark .gotop-button,.body-dark .links-item,
+.body-dark .options,
+.body-dark .options-family-button,
+.body-dark .options-theme-label,
+.body-dark .post-body,
+.body-dark .post-content th,
+.body-dark .post-item,
+.body-dark .post-pagenav a,
+.body-dark .saying-textarea,
+.body-dark .search-form input {
+ background:#5a5a5a!important
+}
+/* Need #6e6e6e bg */
+.body-dark .OwO-bar,
+.body-dark .OwO-item {
+ background:#6e6e6e!important
+}
+/* Need white fonts */
+.body-dark .OwO-bar,
+.body-dark .OwO-logo,
+.body-dark .comment,
+.body-dark .comment a,
+.body-dark .comment-content p,
+.body-dark .comment-form input,
+.body-dark .comment-form textarea,
+.body-dark .dark-button,
+.body-dark .drawer,
+.body-dark .drawer a,
+.body-dark .drawer-icon,
+.body-dark .drawer-open .drawer-button,
+.body-dark .drawer-search-form button,
+.body-dark .drawer-search-form input,
+.body-dark .footer-info,
+.body-dark .footer-info a,
+.body-dark .gotop-button,
+.body-dark .login,
+.body-dark .login-close,
+.body-dark .mobile-menu,
+.body-dark .mobile-menu a,
+.body-dark .mobile-menu-close,
+.body-dark .mobile-menu-footer,
+.body-dark .nav,
+.body-dark .nav a,
+.body-dark .options-contentsize-button,
+.body-dark .options-family-button,
+.body-dark .options-theme-item:hover .options-theme-label,
+.body-dark .post-body,
+.body-dark .post-body a,
+.body-dark .post-content blockquote,
+.body-dark .post-item,
+.body-dark .post-item a,
+.body-dark .search-close,
+.body-dark .search-form button,
+.body-darl .login a {
+ color:#fafafa!important
+}
+.body-dark .options-theme-label {
+ color:#5a5a5a!important
+}
+/* Need border color */
+.body-dark .OwO-body,
+.body-dark .OwO-logo,
+.body-dark .comment-form input,
+.body-dark .comment-form textarea,
+.body-dark .drawer,
+.body-dark .drawer-search-form button,
+.body-dark .drawer-search-form input,
+.body-dark .mobile-menu-footer,
+.body-dark .mobile-menu-title,
+.body-dark .options hr,
+.body-dark .post-content blockquote,
+.body-dark .post-content table,
+.body-dark .post-content td,
+.body-dark .post-content th,
+.body-dark .post-content tr,
+.body-dark .saying-textarea {
+ border-color:#6e6e6e!important
+}
+.body-dark .tip {
+ border-top-color:#6e6e6e!important;
+ border-bottom-color:#6e6e6e!important;
+ border-right-color:#6e6e6e!important
+}
+.body-dark .bubble.comment-content:before,
+.body-dark .bubble.saying-body:before,
+.body-dark .comment-by-author .bubble.comment-content:before {
+ border-right-color:#646464!important
+}
+/* Need darker mask */
+.body-dark .banner-mask {
+ background:rgba(10,10,10,.4)
+}
+/* Need filter */
+.body-dark img {
+ filter:brightness(90%)
+}
+.body-dark .aplayer-pic,
+.body-dark .post-banner,
+.body-dark iframe {
+ filter:brightness(75%)
+}
diff --git a/assets/css/miracles.min.css b/assets/css/miracles.min.css index 42243d6..b82085b 100644 --- a/assets/css/miracles.min.css +++ b/assets/css/miracles.min.css @@ -42,14 +42,18 @@ hr { }
/* 滚动条 */
::-webkit-scrollbar {
- width: 6px;
+ width: 9px;
height: 5px
}
::-webkit-scrollbar-button {
display: none
}
::-webkit-scrollbar-thumb {
- background: gray;
+ background: rgb(150,150,150);
+ border-radius: 3px
+}
+::-webkit-scrollbar-thumb:hover {
+ background: gray
}
/* 框选文本色彩 */
::-moz-selection,
@@ -254,24 +258,28 @@ button { top: 0;
bottom: 0;
z-index: 30;
- left: -150vh;
transition: all 0.8s;
box-shadow: 0 0 30px #646464;
-moz-box-shadow: 0 0 30px #646464;
-webkit-box-shadow: 0 0 30px #646464;
/* Mobile */
- width: 360px;
+ width: 100%;
+ left: -120%;
+}
+.drawer-relative {
+ position: relative;
+ height: 100vh;
}
.drawer-avatar {
- margin-top: 50px;
+ padding: 30px 0;
}
.drawer-avatar img {
display: block;
margin: 0 auto;
border-radius: 100%;
/* Mobile */
- width: 150px;
- height: 150px;
+ width: 120px;
+ height: 120px;
}
.drawer-button {
position: fixed;
@@ -306,62 +314,37 @@ button { color: rgb(80,80,80);
text-shadow: 0 0 0 #fff;
}
-#live2dcanvas {
- z-index: 0!important;
-}
-
-.drawer-search {
- background: rgb(240,240,240);
- padding: 10px 8px;
- margin-top: 20px;
-}
-.drawer-search-form input,
-.drawer-search-form button {
- color: gray;
- border-radius: 2px;
- border: 1px solid #ccc;
- margin: 0;
- padding: 7px 3px;
+.drawer-header {
+ height: 180px;
+ background: rgb(253,253,253)
}
-.drawer-search-form input {
- width: 70%;
- background: #fff;
- border-top-right-radius: 0;
- border-bottom-right-radius: 0;
- margin-right: -5px;
-}
-.drawer-search-form button {
- width: 28%;
- border-top-left-radius: 0;
- border-bottom-left-radius: 0;
- background: #ddd;
+.drawer-footer {
+ background: rgb(253,253,253);
+ padding: 8px 0;
+ text-align: center;
+ height: 64px;
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ right: 0;
}
.drawer-content {
margin-top: 10px;
overflow-y: auto;
- height: 60vh;
+ height: 50vh;
}
.drawer-content a {
display: block;
text-align: center;
- font-size: 21px;
+ font-size: 16px;
padding: 14px 0;
}
.drawer-content a:hover {
background: rgb(240,240,240);
}
-.drawer-main {
- height: 87vh;
-}
-.drawer-footer {
- background: rgb(253,253,253);
- padding: 8px 0;
- text-align: center;
- height: 13vh;
-}
.drawer-icon {
- height: 6vh;
- width: 6vh;
+ height: 45px;
+ width: 45px;
border-radius: 100%;
background: rgb(246,246,246);
transition: background: 0.2s;
@@ -634,6 +617,7 @@ button { .post-title-ss {
margin: 12px 0;
margin-top: 6px;
+ height: 32px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
@@ -1365,6 +1349,7 @@ iframe[src*="//player.bilibili.com/player.html"] { #live2dcanvas {
display: none;
transition: all 0.3s;
+ z-index: 0!important
}
/* 响应式相关 */
.large-screen {
@@ -1387,13 +1372,26 @@ iframe[src*="//player.bilibili.com/player.html"] { max-width: 700px
}
.drawer-avatar img {
- height: 220px;
- width: 220px;
+ height: 160px;
+ width: 160px;
}
.drawer {
width: 360px;
+ left: -400px;
+ }
+ .drawer-content a {
+ font-size: 19px;
+ padding: 11px 0;
+ }
+ .drawer-main {
+ height: 87vh;
+ }
+ .drawer-footer {
+ height: 68px;
+ }
+ .drawer-header {
+ height: 220px;
}
-
.fixed-button {
height: 60px;
width: 60px;
@@ -1495,6 +1493,18 @@ iframe[src*="//player.bilibili.com/player.html"] { }
/* Desktop and up */
@media (min-width:992px) {
+ .drawer-content a {
+ font-size: 21px;
+ padding: 14px 0;
+ }
+ .drawer-avatar img {
+ height: 180px;
+ width: 180px;
+ }
+ .drawer-header {
+ height: 240px;
+ }
+
.comment-content p {
font-size: 19px;
}
@@ -1578,12 +1588,27 @@ iframe[src*="//player.bilibili.com/player.html"] { padding: 12px;
}
#live2dcanvas {
- display: block;
- transform: scale(0.8);
+ display: block!important;
+ transform: scale(0.8)!important;
+ z-index: 0!important
}
}
/* Computer screen and up */
@media (min-width:1200px) {
+ .drawer-header {
+ height: 250px;
+ }
+ .drawer-footer {
+ height: 65px;
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ }
+ .drawer-avatar img {
+ height: 190px;
+ width: 190px;
+ }
.comment-content p {
font-size: 21px;
}
diff --git a/assets/js/miracles.min.js b/assets/js/miracles.min.js index a4e32d9..57d2d60 100644 --- a/assets/js/miracles.min.js +++ b/assets/js/miracles.min.js @@ -161,12 +161,10 @@ function bodyScroll(event){ event.preventDefault();
}
function banScroll() {
- document.body.addEventListener('touchmove',bodyScroll,false);
- $('body').css({'position':'fixed',"width":"100%"});
+ $('html').css({'overflow':'hidden'});
}
function allowScroll() {
- document.body.removeEventListener('touchmove',bodyScroll,false);
- $("body").css({"position":"initial","height":"auto"});
+ $('html').css({'overflow':'auto'});
}
/**
@@ -288,9 +286,12 @@ function toggleDrawer() { /**
* Alert
*/
-function alertSend(content) {
+function alertSend(content,auto) {
$(".alert-content").text(content);
$(".alert").removeClass("ready");
+ if (auto===true) {
+ window.setTimeout(function(){$(".alert").addClass("ready");},3500);
+ }
}
function alertClose() {
$(".alert").addClass("ready");
@@ -302,7 +303,7 @@ function alertClose() { $(document).ready(function() {
$("body").bind({
copy : function(){
- alertSend("复制成功！若使用请注明原作者及原地址！");
+ alertSend("复制成功！若使用请注明原作者及原地址！",true);
}
});
});
@@ -338,7 +339,7 @@ L2Dwidget.init(config); * Load Pjax
*/
if(loadPjax = true) {
- $(document).pjax('a[href^="'+siteurl+'"]:not(a[target="_blank"], a[no-pjax], .comment-reply a, .cancel-comment-reply a)', {
+ $(document).pjax('a[href^="' + siteurl + '"]:not(a[target="_blank"], a[no-pjax], .comment-reply a, .cancel-comment-reply a)', {
container: '#pjax-container',fragment: '#pjax-container',timeout: 8000
}).on('pjax:send', function () {
GoTop();
|