diff --git a/assets/css/joe.global.css b/assets/css/joe.global.css
index b92b418..c23e977 100644
--- a/assets/css/joe.global.css
+++ b/assets/css/joe.global.css
@@ -1 +1 @@
-.joe_dropdown{position:relative}.joe_dropdown__link{display:flex;align-items:center}.joe_dropdown__link-icon{transition:-webkit-transform 0.35s;transition:transform 0.35s;transition:transform 0.35s, -webkit-transform 0.35s}.joe_dropdown__menu{position:absolute;left:50%;visibility:hidden;z-index:999;border-top:3px solid var(--theme);-webkit-transform-origin:top;transform-origin:top;background:var(--background);box-shadow:0 0 10px rgba(0,0,0,0.15);border-radius:0 0 4px 4px;padding:10px 0;opacity:0;-webkit-transform:translateX(-50%) perspective(600px) rotateX(-45deg);transform:translateX(-50%) perspective(600px) rotateX(-45deg);transition:opacity 0.35s, visibility 0.35s, -webkit-transform 0.35s;transition:opacity 0.35s, visibility 0.35s, transform 0.35s;transition:opacity 0.35s, visibility 0.35s, transform 0.35s, -webkit-transform 0.35s}.joe_dropdown__menu::before{content:'';position:absolute;top:-10px;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid var(--theme)}.joe_dropdown.active .joe_dropdown__link-icon{-webkit-transform:rotate(-180deg);transform:rotate(-180deg)}.joe_dropdown.active .joe_dropdown__menu{visibility:visible;opacity:1;-webkit-transform:translateX(-50%) perspective(600px) rotateX(0);transform:translateX(-50%) perspective(600px) rotateX(0)}.joe_header{position:-webkit-sticky;position:sticky;top:0;z-index:1000;background:var(--background);box-shadow:0 2px 10px 0 rgba(0,0,0,0.1)}.joe_header__above-logo{position:relative;display:flex;align-items:center;height:60px;padding-right:15px;margin-right:15px}.joe_header__above-logo img{max-width:150px;max-height:50px;-o-object-fit:cover;object-fit:cover}.joe_header__above-logo::after{content:'';position:absolute;top:50%;right:0;width:1px;height:20px;background:var(--classC);-webkit-transform:translateY(-50%);transform:translateY(-50%)}.joe_header__above-nav{display:flex;align-items:center}.joe_header__above-nav .item{position:relative;height:60px;line-height:60px;font-size:15px;padding:0 8px;margin-right:15px;transition:color 0.35s;white-space:nowrap;color:var(--main)}.joe_header__above-nav .item:last-child{margin-right:0}.joe_header__above-nav .item::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;transition:opacity 0.5s, -webkit-transform 0.5s;transition:opacity 0.5s, transform 0.5s;transition:opacity 0.5s, transform 0.5s, -webkit-transform 0.5s;border-radius:6px 6px 0 0;opacity:0;-webkit-transform:scaleX(0.25);transform:scaleX(0.25);background:var(--theme)}.joe_header__above-nav .item.active,.joe_header__above-nav .item:hover{color:var(--theme)}.joe_header__above-nav .item.active::after,.joe_header__above-nav .item:hover::after{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}.joe_header__above-nav .joe_dropdown__link a{height:60px;line-height:60px;font-size:15px;padding-left:8px;padding-right:3px;transition:color 0.35s;white-space:nowrap;color:var(--main)}.joe_header__above-nav .joe_dropdown__menu{width:110px;text-align:center}.joe_header__above-nav .joe_dropdown__menu a{display:block;line-height:34px;height:34px;transition:color 0.35s, background 0.35s;color:var(--minor);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 15px}.joe_header__above-nav .joe_dropdown__menu a:hover,.joe_header__above-nav .joe_dropdown__menu a.active{color:var(--theme);background:var(--classD)}.joe_header__above-search{position:relative;margin-left:auto;display:flex;align-items:center}.joe_header__above-search .input{background:var(--classC);width:170px;height:34px;border:1px solid transparent;padding:0 18px;color:var(--routine);transition:background 0.35s, border-color 0.35s, padding-right 0.35s;border-radius:17px 0 0 17px}.joe_header__above-search .input:focus{background:var(--background);border-color:var(--theme);padding-right:28px}.joe_header__above-search .input:focus ~ .icon{-webkit-transform:translate3d(0, -50%, 0) rotateY(180deg);transform:translate3d(0, -50%, 0) rotateY(180deg)}.joe_header__above-search .submit{position:relative;z-index:1;height:34px;border:none;background:var(--theme);color:#fff;border-radius:0 17px 17px 0;padding:0 10px}.joe_header__above-search .icon{position:absolute;top:50%;left:142px;width:28px;height:38px;background:url(../img/search.png);background-size:100% 100%;transition:-webkit-transform 0.35s;transition:transform 0.35s;transition:transform 0.35s, -webkit-transform 0.35s;-webkit-transform:translate3d(100%, -50%, 0) rotateY(180deg);transform:translate3d(100%, -50%, 0) rotateY(180deg)}.joe_header__below{border-top:1px solid var(--classC);height:45px}.joe_header__below-class{display:flex}.joe_header__below-class .item{margin-right:15px;color:var(--minor);height:45px;line-height:45px;transition:color 0.35s;white-space:nowrap}.joe_header__below-class .item:hover,.joe_header__below-class .item.active{color:var(--theme)}.joe_header__below-class .joe_dropdown{margin-right:15px}.joe_header__below-class .joe_dropdown__link .item{margin-right:3px}.joe_header__below-class .joe_dropdown__menu{width:110px;text-align:center}.joe_header__below-class .joe_dropdown__menu a{display:block;height:34px;line-height:34px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--minor);transition:color 0.35s, background 0.35s}.joe_header__below-class .joe_dropdown__menu a:hover,.joe_header__below-class .joe_dropdown__menu a.active{color:var(--theme);background:var(--classD)}.joe_aside{padding:15px 0;margin-left:15px}.joe_aside__item{position:relative;width:250px;margin-bottom:15px;border-radius:8px;box-shadow:var(--box-shadow);overflow:hidden}.joe_aside__item:last-child{position:-webkit-sticky;position:sticky;margin-bottom:0}.joe_aside__item-title{display:flex;align-items:center;border-bottom:1px solid var(--classC);font-size:16px;font-weight:500;height:45px;line-height:45px;padding:0 15px;color:var(--main)}.joe_aside__item-title .icon{width:18px;height:18px;margin-right:8px;fill:var(--main)}.joe_aside__item-title .line{width:10px;height:1px;background:#54b5db;margin-left:12px}.joe_aside__item-contain{position:relative;padding:15px}.joe_aside__item.author{background:var(--background);padding:45px 15px 15px}.joe_aside__item.author::before{content:'';position:absolute;top:90px;left:0;width:100%;height:30px;z-index:2;background:linear-gradient(to bottom, rgba(255,255,255,0), var(--background))}.joe_aside__item.author::after{display:none;content:'';position:absolute;top:0;left:0;width:100%;height:273px;background:url("https://cdn.jsdelivr.net/gh/HaoOuBa/Joe@master/assets/img/snow.gif") no-repeat;background-size:cover;z-index:3;pointer-events:none}.joe_aside__item.author:hover::after{display:block}.joe_aside__item.author .image{position:absolute;top:0;left:0;width:100%;height:120px;-o-object-fit:cover;object-fit:cover;z-index:1}.joe_aside__item.author .user{position:relative;z-index:4;display:flex;flex-direction:column;align-items:center;padding-bottom:15px}.joe_aside__item.author .user .avatar{width:75px;height:75px;border-radius:50%;overflow:hidden;margin-bottom:10px;-o-object-fit:cover;object-fit:cover;transition:-webkit-transform 0.75s;transition:transform 0.75s;transition:transform 0.75s, -webkit-transform 0.75s;background:var(--background);padding:5px}.joe_aside__item.author .user .avatar:hover{-webkit-transform:rotate(360deg);transform:rotate(360deg)}.joe_aside__item.author .user .link{color:var(--theme);margin-bottom:10px;font-size:16px;font-weight:500}.joe_aside__item.author .user .link:hover{text-decoration:underline}.joe_aside__item.author .user .motto{color:var(--main);text-align:center}.joe_aside__item.author .count{width:100%;padding-bottom:15px;display:flex;align-items:center;border-bottom:1px solid var(--classC)}.joe_aside__item.author .count .item{min-width:0;flex:1;display:flex;flex-direction:column;align-items:center;color:var(--routine);font-size:12px}.joe_aside__item.author .count .item:first-child{border-right:1px solid var(--classC)}.joe_aside__item.author .count .item .num{max-width:70px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500;font-size:22px;color:var(--main);margin-bottom:3px;text-shadow:var(--text_shadow)}.joe_aside__item.author .list{padding-top:15px}.joe_aside__item.author .list .item{display:flex;align-items:center;justify-content:space-between;line-height:30px}.joe_aside__item.author .list .item .link{position:relative;color:var(--routine);max-width:85%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.joe_aside__item.author .list .item .link::after{content:'';position:absolute;bottom:0;left:0;width:0;height:1px;background:var(--theme);transition:all 0.35s}.joe_aside__item.author .list .item .link:hover{color:var(--theme)}.joe_aside__item.author .list .item .link:hover::after{width:100%}.joe_aside__item.author .list .item .icon{fill:var(--routine)}.joe_aside__item.timelife{background:var(--background)}.joe_aside__item.timelife .item{margin-bottom:15px}.joe_aside__item.timelife .item:last-child{margin-bottom:0}.joe_aside__item.timelife .item .title{font-size:12px;color:var(--minor);margin-bottom:5px;display:flex;align-items:center}.joe_aside__item.timelife .item .title .text{color:var(--theme);font-weight:500;font-size:14px;margin:0 5px}.joe_aside__item.timelife .item .progress{display:flex;align-items:center}.joe_aside__item.timelife .item .progress-bar{height:10px;border-radius:5px;overflow:hidden;background:var(--classC);width:0;min-width:0;flex:1;margin-right:5px}.joe_aside__item.timelife .item .progress-bar-inner{width:0;height:100%;border-radius:5px;transition:width 0.35s;-webkit-animation:progress 750ms linear infinite;animation:progress 750ms linear infinite}.joe_aside__item.timelife .item .progress-bar-inner-0{background:#bde6ff;background-image:linear-gradient(135deg, #50bfff 25%, transparent 25%, transparent 50%, #50bfff 50%, #50bfff 75%, transparent 75%, transparent 100%);background-size:30px 30px}.joe_aside__item.timelife .item .progress-bar-inner-1{background:#ffd980;background-image:linear-gradient(135deg, #f7ba2a 25%, transparent 25%, transparent 50%, #f7ba2a 50%, #f7ba2a 75%, transparent 75%, transparent 100%);background-size:30px 30px}.joe_aside__item.timelife .item .progress-bar-inner-2{background:#ffa9a9;background-image:linear-gradient(135deg, #ff4949 25%, transparent 25%, transparent 50%, #ff4949 50%, #ff4949 75%, transparent 75%, transparent 100%);background-size:30px 30px}.joe_aside__item.timelife .item .progress-bar-inner-3{background:#67c23a;background-image:linear-gradient(135deg, #4f9e28 25%, transparent 25%, transparent 50%, #4f9e28 50%, #4f9e28 75%, transparent 75%, transparent 100%);background-size:30px 30px}.joe_aside__item.timelife .item .progress-percentage{color:var(--minor)}.joe_aside__item.weather{background:var(--background)}.joe_aside__item.weather .joe_aside__item-contain{min-height:300px}.joe_aside__item.hot{background:var(--background)}.joe_aside__item.hot .empty{text-align:center;color:var(--routine)}.joe_aside__item.hot .item{margin-bottom:15px}.joe_aside__item.hot .item:last-child{margin-bottom:0}.joe_aside__item.hot .item:nth-child(1) .link .sort{background:#ff183e}.joe_aside__item.hot .item:nth-child(2) .link .sort{background:#ff5c38}.joe_aside__item.hot .item:nth-child(3) .link .sort{background:#ffb821}.joe_aside__item.hot .item .link{position:relative;display:block;border-radius:4px;overflow:hidden}.joe_aside__item.hot .item .link:hover .image{-webkit-transform:scale(1.2);transform:scale(1.2)}.joe_aside__item.hot .item .link .sort{position:absolute;top:5px;right:-20px;background:#7f7f8c;color:#fff;width:65px;text-align:center;font-size:12px;-webkit-transform:rotate(45deg);transform:rotate(45deg);font-weight:500;z-index:1;font-style:normal}.joe_aside__item.hot .item .link .image{width:100%;height:130px;-o-object-fit:cover;object-fit:cover;transition:-webkit-transform 0.35s;transition:transform 0.35s;transition:transform 0.35s, -webkit-transform 0.35s}.joe_aside__item.hot .item .link .describe{position:absolute;z-index:1;left:0;right:0;bottom:0;padding:10px;background:linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.75));font-size:12px;color:var(--seat)}.joe_aside__item.hot .item .link .describe h6{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff;line-height:24px;font-size:14px}.joe_aside__item.ranking{background:var(--background)}.joe_aside__item.ranking .item{display:flex;align-items:center;line-height:32px;overflow:hidden}.joe_aside__item.ranking .item:nth-child(1) .sort{color:#fe2d46}.joe_aside__item.ranking .item:nth-child(2) .sort{color:#f60}.joe_aside__item.ranking .item:nth-child(3) .sort{color:#faa90e}.joe_aside__item.ranking .item .sort{color:var(--minor);font-weight:700;font-size:18px;width:18px;min-width:18px;max-width:18px}.joe_aside__item.ranking .item .link{position:relative;color:var(--routine);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.joe_aside__item.ranking .item .link::after{position:absolute;content:'';bottom:0;left:0;width:0;height:1px;background:var(--theme);transition:width 0.5s}.joe_aside__item.ranking .item .link:hover{color:var(--theme)}.joe_aside__item.ranking .item .link:hover::after{width:100%}.joe_aside__item.ranking .error{text-align:center;color:var(--routine)}.joe_aside__item.newreply{background:var(--background)}.joe_aside__item.newreply .empty{text-align:center;color:var(--routine)}.joe_aside__item.newreply .item{margin-bottom:15px;border-bottom:1px dashed var(--classC);padding-bottom:15px}.joe_aside__item.newreply .item:last-child{margin-bottom:0;border-bottom-color:transparent;padding-bottom:0}.joe_aside__item.newreply .item .user{display:flex;margin-bottom:12px}.joe_aside__item.newreply .item .user .avatar{width:40px;height:40px;min-width:40px;min-height:40px;margin-right:12px;border-radius:50%;border:1px solid var(--classA);padding:3px}.joe_aside__item.newreply .item .user .info{display:flex;flex-direction:column;justify-content:space-between}.joe_aside__item.newreply .item .user .info .author{color:var(--main);font-weight:600;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.joe_aside__item.newreply .item .user .info .date{font-size:12px;color:var(--minor)}.joe_aside__item.newreply .item .reply{position:relative;background:var(--classD);border-radius:6px;padding:5px 10px}.joe_aside__item.newreply .item .reply::before{content:'';width:0;height:0;border-bottom:6px solid var(--classD);border-left:6px solid transparent;border-right:6px solid transparent;position:absolute;left:15px;bottom:100%}.joe_aside__item.newreply .item .reply .link{display:-webkit-box;-webkit-line-clamp:2;/*! autoprefixer: off */-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;color:var(--minor);font-size:13px;font-weight:500;line-height:24px;transition:all 0.35s}.joe_aside__item.newreply .item .reply .link:hover{color:var(--theme)}.joe_aside__item.newreply .item .reply .link .owo_image{height:18px;vertical-align:-5px}.joe_list__list{display:flex;position:relative;width:100%;padding:15px 0;border-bottom:1px solid var(--classC)}.joe_list__list:last-child{border-bottom:none}.joe_list__list:hover .line{-webkit-transform:scaleY(1);transform:scaleY(1)}.joe_list__list:hover .thumbnail time{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}.joe_list__list .line{position:absolute;z-index:1;top:15px;left:-15px;width:4px;height:25px;border-radius:2px;background:var(--theme);-webkit-transform:scaleY(0);transform:scaleY(0);transition:-webkit-transform 0.35s;transition:transform 0.35s;transition:transform 0.35s, -webkit-transform 0.35s}.joe_list__list .thumbnail{position:relative;width:210px;height:140px;min-width:210px;min-height:140px;margin-right:15px;overflow:hidden}.joe_list__list .thumbnail img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:5px;transition:opacity 0.35s}.joe_list__list .thumbnail img:hover{opacity:0.85}.joe_list__list .thumbnail time{position:absolute;z-index:1;top:5px;right:5px;background:var(--theme);height:20px;line-height:20px;padding:0 8px;color:#fff;font-size:12px;border-radius:10px;transition:-webkit-transform 0.35s;transition:transform 0.35s;transition:transform 0.35s, -webkit-transform 0.35s;-webkit-transform:translate3d(120%, 0, 0);transform:translate3d(120%, 0, 0)}.joe_list__list .thumbnail svg{position:absolute;z-index:1;top:5px;left:5px;width:20px;height:20px;fill:#fff}@-webkit-keyframes progress{0%{background-position:0 0}100%{background-position:30px 0}}@keyframes progress{0%{background-position:0 0}100%{background-position:30px 0}}
+.joe_dropdown{position:relative}.joe_dropdown__link{display:flex;align-items:center}.joe_dropdown__link-icon{transition:-webkit-transform 0.35s;transition:transform 0.35s;transition:transform 0.35s, -webkit-transform 0.35s}.joe_dropdown__menu{position:absolute;left:50%;visibility:hidden;z-index:999;border-top:3px solid var(--theme);-webkit-transform-origin:top;transform-origin:top;background:var(--background);box-shadow:0 0 10px rgba(0,0,0,0.15);border-radius:0 0 4px 4px;padding:10px 0;opacity:0;-webkit-transform:translateX(-50%) perspective(600px) rotateX(-45deg);transform:translateX(-50%) perspective(600px) rotateX(-45deg);transition:opacity 0.35s, visibility 0.35s, -webkit-transform 0.35s;transition:opacity 0.35s, visibility 0.35s, transform 0.35s;transition:opacity 0.35s, visibility 0.35s, transform 0.35s, -webkit-transform 0.35s}.joe_dropdown__menu::before{content:'';position:absolute;top:-10px;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid var(--theme)}.joe_dropdown.active .joe_dropdown__link-icon{-webkit-transform:rotate(-180deg);transform:rotate(-180deg)}.joe_dropdown.active .joe_dropdown__menu{visibility:visible;opacity:1;-webkit-transform:translateX(-50%) perspective(600px) rotateX(0);transform:translateX(-50%) perspective(600px) rotateX(0)}.joe_header{position:-webkit-sticky;position:sticky;top:0;z-index:1000;background:var(--background);box-shadow:0 2px 10px 0 rgba(0,0,0,0.1)}.joe_header__above-logo{position:relative;display:flex;align-items:center;height:60px;padding-right:15px;margin-right:15px}.joe_header__above-logo img{max-width:150px;max-height:50px;-o-object-fit:cover;object-fit:cover}.joe_header__above-logo::after{content:'';position:absolute;top:50%;right:0;width:1px;height:20px;background:var(--classC);-webkit-transform:translateY(-50%);transform:translateY(-50%)}.joe_header__above-nav{display:flex;align-items:center}.joe_header__above-nav .item{position:relative;height:60px;line-height:60px;font-size:15px;padding:0 8px;margin-right:15px;transition:color 0.35s;white-space:nowrap;color:var(--main)}.joe_header__above-nav .item:last-child{margin-right:0}.joe_header__above-nav .item::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;transition:opacity 0.5s, -webkit-transform 0.5s;transition:opacity 0.5s, transform 0.5s;transition:opacity 0.5s, transform 0.5s, -webkit-transform 0.5s;border-radius:6px 6px 0 0;opacity:0;-webkit-transform:scaleX(0.25);transform:scaleX(0.25);background:var(--theme)}.joe_header__above-nav .item.active,.joe_header__above-nav .item:hover{color:var(--theme)}.joe_header__above-nav .item.active::after,.joe_header__above-nav .item:hover::after{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}.joe_header__above-nav .joe_dropdown__link a{height:60px;line-height:60px;font-size:15px;padding-left:8px;padding-right:3px;transition:color 0.35s;white-space:nowrap;color:var(--main)}.joe_header__above-nav .joe_dropdown__menu{width:110px;text-align:center}.joe_header__above-nav .joe_dropdown__menu a{display:block;line-height:34px;height:34px;transition:color 0.35s, background 0.35s;color:var(--minor);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 15px}.joe_header__above-nav .joe_dropdown__menu a:hover,.joe_header__above-nav .joe_dropdown__menu a.active{color:var(--theme);background:var(--classD)}.joe_header__above-search{position:relative;margin-left:auto;display:flex;align-items:center}.joe_header__above-search .input{background:var(--classC);width:170px;height:34px;border:1px solid transparent;padding:0 18px;color:var(--routine);transition:background 0.35s, border-color 0.35s, padding-right 0.35s;border-radius:17px 0 0 17px}.joe_header__above-search .input:focus{background:var(--background);border-color:var(--theme);padding-right:28px}.joe_header__above-search .input:focus ~ .icon{-webkit-transform:translate3d(0, -50%, 0) rotateY(180deg);transform:translate3d(0, -50%, 0) rotateY(180deg)}.joe_header__above-search .submit{position:relative;z-index:1;height:34px;border:none;background:var(--theme);color:#fff;border-radius:0 17px 17px 0;padding:0 10px}.joe_header__above-search .icon{position:absolute;top:50%;left:142px;width:28px;height:38px;background:url(../img/search.png);background-size:100% 100%;transition:-webkit-transform 0.35s;transition:transform 0.35s;transition:transform 0.35s, -webkit-transform 0.35s;-webkit-transform:translate3d(100%, -50%, 0) rotateY(180deg);transform:translate3d(100%, -50%, 0) rotateY(180deg)}.joe_header__below{border-top:1px solid var(--classC);height:45px}.joe_header__below-class{display:flex}.joe_header__below-class .item{margin-right:15px;color:var(--minor);height:45px;line-height:45px;transition:color 0.35s;white-space:nowrap}.joe_header__below-class .item:hover,.joe_header__below-class .item.active{color:var(--theme)}.joe_header__below-class .joe_dropdown{margin-right:15px}.joe_header__below-class .joe_dropdown__link .item{margin-right:3px}.joe_header__below-class .joe_dropdown__menu{width:110px;text-align:center}.joe_header__below-class .joe_dropdown__menu a{display:block;height:34px;line-height:34px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--minor);transition:color 0.35s, background 0.35s}.joe_header__below-class .joe_dropdown__menu a:hover,.joe_header__below-class .joe_dropdown__menu a.active{color:var(--theme);background:var(--classD)}.joe_aside{padding:15px 0;margin-left:15px}.joe_aside__item{position:relative;width:250px;margin-bottom:15px;border-radius:8px;box-shadow:var(--box-shadow);overflow:hidden}.joe_aside__item:last-child{position:-webkit-sticky;position:sticky;margin-bottom:0}.joe_aside__item-title{display:flex;align-items:center;border-bottom:1px solid var(--classC);font-size:16px;font-weight:500;height:45px;line-height:45px;padding:0 15px;color:var(--main)}.joe_aside__item-title .icon{width:18px;height:18px;margin-right:8px;fill:var(--main)}.joe_aside__item-title .line{width:10px;height:1px;background:#54b5db;margin-left:12px}.joe_aside__item-contain{position:relative;padding:15px}.joe_aside__item.author{background:var(--background);padding:45px 15px 15px}.joe_aside__item.author::before{content:'';position:absolute;top:90px;left:0;width:100%;height:30px;z-index:2;background:linear-gradient(to bottom, rgba(255,255,255,0), var(--background))}.joe_aside__item.author::after{display:none;content:'';position:absolute;top:0;left:0;width:100%;height:273px;background:url("https://cdn.jsdelivr.net/gh/HaoOuBa/Joe@master/assets/img/snow.gif") no-repeat;background-size:cover;z-index:3;pointer-events:none}.joe_aside__item.author:hover::after{display:block}.joe_aside__item.author .image{position:absolute;top:0;left:0;width:100%;height:120px;-o-object-fit:cover;object-fit:cover;z-index:1}.joe_aside__item.author .user{position:relative;z-index:4;display:flex;flex-direction:column;align-items:center;padding-bottom:15px}.joe_aside__item.author .user .avatar{width:75px;height:75px;border-radius:50%;overflow:hidden;margin-bottom:10px;-o-object-fit:cover;object-fit:cover;transition:-webkit-transform 0.75s;transition:transform 0.75s;transition:transform 0.75s, -webkit-transform 0.75s;background:var(--background);padding:5px}.joe_aside__item.author .user .avatar:hover{-webkit-transform:rotate(360deg);transform:rotate(360deg)}.joe_aside__item.author .user .link{color:var(--theme);margin-bottom:10px;font-size:16px;font-weight:500}.joe_aside__item.author .user .link:hover{text-decoration:underline}.joe_aside__item.author .user .motto{color:var(--main);text-align:center}.joe_aside__item.author .count{width:100%;padding-bottom:15px;display:flex;align-items:center;border-bottom:1px solid var(--classC)}.joe_aside__item.author .count .item{min-width:0;flex:1;display:flex;flex-direction:column;align-items:center;color:var(--routine);font-size:12px}.joe_aside__item.author .count .item:first-child{border-right:1px solid var(--classC)}.joe_aside__item.author .count .item .num{max-width:70px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500;font-size:22px;color:var(--main);margin-bottom:3px;text-shadow:var(--text_shadow)}.joe_aside__item.author .list{padding-top:15px}.joe_aside__item.author .list .item{display:flex;align-items:center;justify-content:space-between;line-height:30px}.joe_aside__item.author .list .item .link{position:relative;color:var(--routine);max-width:85%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.joe_aside__item.author .list .item .link::after{content:'';position:absolute;bottom:0;left:0;width:0;height:1px;background:var(--theme);transition:all 0.35s}.joe_aside__item.author .list .item .link:hover{color:var(--theme)}.joe_aside__item.author .list .item .link:hover::after{width:100%}.joe_aside__item.author .list .item .icon{fill:var(--routine)}.joe_aside__item.timelife{background:var(--background)}.joe_aside__item.timelife .item{margin-bottom:15px}.joe_aside__item.timelife .item:last-child{margin-bottom:0}.joe_aside__item.timelife .item .title{font-size:12px;color:var(--minor);margin-bottom:5px;display:flex;align-items:center}.joe_aside__item.timelife .item .title .text{color:var(--theme);font-weight:500;font-size:14px;margin:0 5px}.joe_aside__item.timelife .item .progress{display:flex;align-items:center}.joe_aside__item.timelife .item .progress-bar{height:10px;border-radius:5px;overflow:hidden;background:var(--classC);width:0;min-width:0;flex:1;margin-right:5px}.joe_aside__item.timelife .item .progress-bar-inner{width:0;height:100%;border-radius:5px;transition:width 0.35s;-webkit-animation:progress 750ms linear infinite;animation:progress 750ms linear infinite}.joe_aside__item.timelife .item .progress-bar-inner-0{background:#bde6ff;background-image:linear-gradient(135deg, #50bfff 25%, transparent 25%, transparent 50%, #50bfff 50%, #50bfff 75%, transparent 75%, transparent 100%);background-size:30px 30px}.joe_aside__item.timelife .item .progress-bar-inner-1{background:#ffd980;background-image:linear-gradient(135deg, #f7ba2a 25%, transparent 25%, transparent 50%, #f7ba2a 50%, #f7ba2a 75%, transparent 75%, transparent 100%);background-size:30px 30px}.joe_aside__item.timelife .item .progress-bar-inner-2{background:#ffa9a9;background-image:linear-gradient(135deg, #ff4949 25%, transparent 25%, transparent 50%, #ff4949 50%, #ff4949 75%, transparent 75%, transparent 100%);background-size:30px 30px}.joe_aside__item.timelife .item .progress-bar-inner-3{background:#67c23a;background-image:linear-gradient(135deg, #4f9e28 25%, transparent 25%, transparent 50%, #4f9e28 50%, #4f9e28 75%, transparent 75%, transparent 100%);background-size:30px 30px}.joe_aside__item.timelife .item .progress-percentage{color:var(--minor)}.joe_aside__item.weather{background:var(--background)}.joe_aside__item.weather .joe_aside__item-contain{min-height:300px}.joe_aside__item.hot{background:var(--background)}.joe_aside__item.hot .empty{text-align:center;color:var(--routine)}.joe_aside__item.hot .item{margin-bottom:15px}.joe_aside__item.hot .item:last-child{margin-bottom:0}.joe_aside__item.hot .item:nth-child(1) .link .sort{background:#ff183e}.joe_aside__item.hot .item:nth-child(2) .link .sort{background:#ff5c38}.joe_aside__item.hot .item:nth-child(3) .link .sort{background:#ffb821}.joe_aside__item.hot .item .link{position:relative;display:block;border-radius:4px;overflow:hidden}.joe_aside__item.hot .item .link:hover .image{-webkit-transform:scale(1.2);transform:scale(1.2)}.joe_aside__item.hot .item .link .sort{position:absolute;top:5px;right:-20px;background:#7f7f8c;color:#fff;width:65px;text-align:center;font-size:12px;-webkit-transform:rotate(45deg);transform:rotate(45deg);font-weight:500;z-index:1;font-style:normal}.joe_aside__item.hot .item .link .image{width:100%;height:130px;-o-object-fit:cover;object-fit:cover;transition:-webkit-transform 0.35s;transition:transform 0.35s;transition:transform 0.35s, -webkit-transform 0.35s}.joe_aside__item.hot .item .link .describe{position:absolute;z-index:1;left:0;right:0;bottom:0;padding:10px;background:linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.75));font-size:12px;color:var(--seat)}.joe_aside__item.hot .item .link .describe h6{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff;line-height:24px;font-size:14px}.joe_aside__item.ranking{background:var(--background)}.joe_aside__item.ranking .item{display:flex;align-items:center;line-height:32px;overflow:hidden}.joe_aside__item.ranking .item:nth-child(1) .sort{color:#fe2d46}.joe_aside__item.ranking .item:nth-child(2) .sort{color:#f60}.joe_aside__item.ranking .item:nth-child(3) .sort{color:#faa90e}.joe_aside__item.ranking .item .sort{color:var(--minor);font-weight:700;font-size:18px;width:18px;min-width:18px;max-width:18px}.joe_aside__item.ranking .item .link{position:relative;color:var(--routine);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.joe_aside__item.ranking .item .link::after{position:absolute;content:'';bottom:0;left:0;width:0;height:1px;background:var(--theme);transition:width 0.5s}.joe_aside__item.ranking .item .link:hover{color:var(--theme)}.joe_aside__item.ranking .item .link:hover::after{width:100%}.joe_aside__item.ranking .error{text-align:center;color:var(--routine)}.joe_aside__item.newreply{background:var(--background)}.joe_aside__item.newreply .empty{text-align:center;color:var(--routine)}.joe_aside__item.newreply .item{margin-bottom:15px;border-bottom:1px dashed var(--classC);padding-bottom:15px}.joe_aside__item.newreply .item:last-child{margin-bottom:0;border-bottom-color:transparent;padding-bottom:0}.joe_aside__item.newreply .item .user{display:flex;margin-bottom:12px}.joe_aside__item.newreply .item .user .avatar{width:40px;height:40px;min-width:40px;min-height:40px;margin-right:12px;border-radius:50%;border:1px solid var(--classA);padding:3px}.joe_aside__item.newreply .item .user .info{display:flex;flex-direction:column;justify-content:space-between}.joe_aside__item.newreply .item .user .info .author{color:var(--main);font-weight:600;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.joe_aside__item.newreply .item .user .info .date{font-size:12px;color:var(--minor)}.joe_aside__item.newreply .item .reply{position:relative;background:var(--classD);border-radius:6px;padding:5px 10px}.joe_aside__item.newreply .item .reply::before{content:'';width:0;height:0;border-bottom:6px solid var(--classD);border-left:6px solid transparent;border-right:6px solid transparent;position:absolute;left:15px;bottom:100%}.joe_aside__item.newreply .item .reply .link{display:-webkit-box;-webkit-line-clamp:2;/*! autoprefixer: off */-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;color:var(--minor);font-size:13px;font-weight:500;line-height:24px;transition:all 0.35s}.joe_aside__item.newreply .item .reply .link:hover{color:var(--theme)}.joe_aside__item.newreply .item .reply .link .owo_image{height:18px;vertical-align:-5px}.joe_list__item{display:flex;position:relative;width:100%;padding:15px 0;border-bottom:1px solid var(--classC)}.joe_list__item:last-child{border-bottom:none}.joe_list__item:hover .line{-webkit-transform:scaleY(1);transform:scaleY(1)}.joe_list__item:hover .thumbnail time{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}.joe_list__item .line{position:absolute;z-index:1;top:15px;left:-15px;width:4px;height:25px;border-radius:2px;background:var(--theme);-webkit-transform:scaleY(0);transform:scaleY(0);transition:-webkit-transform 0.35s;transition:transform 0.35s;transition:transform 0.35s, -webkit-transform 0.35s}.joe_list__item .thumbnail{position:relative;width:210px;height:140px;min-width:210px;min-height:140px;margin-right:15px;overflow:hidden}.joe_list__item .thumbnail img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:4px;transition:opacity 0.35s}.joe_list__item .thumbnail img:hover{opacity:0.85}.joe_list__item .thumbnail time{position:absolute;z-index:1;top:5px;right:5px;background:var(--theme);height:20px;line-height:20px;padding:0 8px;color:#fff;font-size:12px;border-radius:10px;transition:-webkit-transform 0.35s;transition:transform 0.35s;transition:transform 0.35s, -webkit-transform 0.35s;-webkit-transform:translate3d(120%, 0, 0);transform:translate3d(120%, 0, 0)}.joe_list__item .thumbnail svg{position:absolute;z-index:1;top:5px;left:5px;width:20px;height:20px;fill:#fff}.joe_list__item .information{display:flex;flex-direction:column;flex:1;min-width:0}.joe_list__item .information .title{display:flex;align-items:center;margin-bottom:10px}.joe_list__item .information .title .badge{height:20px;line-height:20px;background-image:-webkit-linear-gradient(0deg, #3ca5f6 0%, #a86af9 100%);color:#fff;font-size:12px;margin-right:5px;border-radius:2px;padding:0 8px;white-space:nowrap}.joe_list__item .information .title h6{color:var(--main);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:18px;line-height:24px;transition:color 0.35s}.joe_list__item .information .title h6:hover{color:var(--theme)}.joe_list__item .information .abstract{display:-webkit-box;-webkit-line-clamp:2;/*! autoprefixer: off */-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;color:var(--minor);transition:opacity 0.35s;word-break:break-all;line-height:24px}.joe_list__item .information .abstract:hover{opacity:0.8}.joe_list__item .information .meta{display:flex;align-items:center;margin-top:auto;color:var(--minor);font-size:13px}.joe_list__item .information .meta .items{display:flex;align-items:center}.joe_list__item .information .meta .items li::after{content:'/';color:#e1e1e1;padding:0 5px}.joe_list__item .information .meta .items li:last-child::after{display:none}.joe_list__item .information .meta .last{margin-left:auto;display:flex;align-items:center}.joe_list__item .information .meta .last .icon{margin-right:3px}.joe_list__item .information .meta .last .link{color:var(--minor)}.joe_list__item .information .meta .last .link:hover{color:var(--theme)}.joe_list__loading .item{display:flex;position:relative;width:100%;padding:15px 0;border-bottom:1px solid var(--classC)}.joe_list__loading .item:last-child{border-bottom:none}.joe_list__loading .item .thumbnail{position:relative;width:210px;height:140px;min-width:210px;min-height:140px;margin-right:15px;background:var(--classD);-webkit-animation:list_thumbnail_loading 0.5s infinite alternate;animation:list_thumbnail_loading 0.5s infinite alternate;border-radius:4px}.joe_list__loading .item .information{flex:1;min-width:0}.joe_list__loading .item .information .title{height:24px;border-radius:4px;background:var(--classD);-webkit-animation:list_title_loading 0.75s infinite alternate;animation:list_title_loading 0.75s infinite alternate;margin-bottom:15px}.joe_list__loading .item .information .abstract p{height:18px;border-radius:4px;background:var(--classD);margin-bottom:5px;-webkit-animation:list_abstract_loading 0.8s infinite alternate;animation:list_abstract_loading 0.8s infinite alternate}.joe_load{margin:15px auto 0;width:120px;height:32px;line-height:32px;text-align:center;border-radius:16px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background:var(--background);color:var(--routine);transition:-webkit-transform 0.25s;transition:transform 0.25s;transition:transform 0.25s, -webkit-transform 0.25s;box-shadow:var(--box-shadow)}.joe_load:active{-webkit-transform:scale(0.75);transform:scale(0.75)}@-webkit-keyframes progress{0%{background-position:0 0}100%{background-position:30px 0}}@keyframes progress{0%{background-position:0 0}100%{background-position:30px 0}}@-webkit-keyframes list_thumbnail_loading{0%{-webkit-transform:scale(0.85);transform:scale(0.85)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes list_thumbnail_loading{0%{-webkit-transform:scale(0.85);transform:scale(0.85)}100%{-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes list_title_loading{0%{width:80%}100%{width:95%}}@keyframes list_title_loading{0%{width:80%}100%{width:95%}}@-webkit-keyframes list_abstract_loading{0%{width:60%}100%{width:80%}}@keyframes list_abstract_loading{0%{width:60%}100%{width:80%}}
diff --git a/assets/css/joe.global.scss b/assets/css/joe.global.scss
index cc6b984..562a027 100644
--- a/assets/css/joe.global.scss
+++ b/assets/css/joe.global.scss
@@ -1,797 +1,968 @@
.joe_dropdown {
- position: relative;
- &__link {
- display: flex;
- align-items: center;
- &-icon {
- transition: transform 0.35s;
- }
- }
- &__menu {
- position: absolute;
- left: 50%;
- visibility: hidden;
- z-index: 999;
- border-top: 3px solid var(--theme);
- transform-origin: top;
- background: var(--background);
- box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
- border-radius: 0 0 4px 4px;
- padding: 10px 0;
- opacity: 0;
- transform: translateX(-50%) perspective(600px) rotateX(-45deg);
- transition: opacity 0.35s, visibility 0.35s, transform 0.35s;
- &::before {
- content: '';
- position: absolute;
- top: -10px;
- left: 50%;
- transform: translateX(-50%);
- width: 0;
- height: 0;
- border-left: 7px solid transparent;
- border-right: 7px solid transparent;
- border-bottom: 7px solid var(--theme);
- }
- }
- &.active {
- .joe_dropdown__link-icon {
- transform: rotate(-180deg);
- }
- .joe_dropdown__menu {
- visibility: visible;
- opacity: 1;
- transform: translateX(-50%) perspective(600px) rotateX(0);
- }
- }
+ position: relative;
+ &__link {
+ display: flex;
+ align-items: center;
+ &-icon {
+ transition: transform 0.35s;
+ }
+ }
+ &__menu {
+ position: absolute;
+ left: 50%;
+ visibility: hidden;
+ z-index: 999;
+ border-top: 3px solid var(--theme);
+ transform-origin: top;
+ background: var(--background);
+ box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
+ border-radius: 0 0 4px 4px;
+ padding: 10px 0;
+ opacity: 0;
+ transform: translateX(-50%) perspective(600px) rotateX(-45deg);
+ transition: opacity 0.35s, visibility 0.35s, transform 0.35s;
+ &::before {
+ content: '';
+ position: absolute;
+ top: -10px;
+ left: 50%;
+ transform: translateX(-50%);
+ width: 0;
+ height: 0;
+ border-left: 7px solid transparent;
+ border-right: 7px solid transparent;
+ border-bottom: 7px solid var(--theme);
+ }
+ }
+ &.active {
+ .joe_dropdown__link-icon {
+ transform: rotate(-180deg);
+ }
+ .joe_dropdown__menu {
+ visibility: visible;
+ opacity: 1;
+ transform: translateX(-50%) perspective(600px) rotateX(0);
+ }
+ }
}
.joe_header {
- position: sticky;
- top: 0;
- z-index: 1000;
- background: var(--background);
- box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1);
- &__above {
- &-logo {
- position: relative;
- display: flex;
- align-items: center;
- height: 60px;
- padding-right: 15px;
- margin-right: 15px;
- img {
- max-width: 150px;
- max-height: 50px;
- object-fit: cover;
- }
- &::after {
- content: '';
- position: absolute;
- top: 50%;
- right: 0;
- width: 1px;
- height: 20px;
- background: var(--classC);
- transform: translateY(-50%);
- }
- }
- &-nav {
- display: flex;
- align-items: center;
- .item {
- position: relative;
- height: 60px;
- line-height: 60px;
- font-size: 15px;
- padding: 0 8px;
- margin-right: 15px;
- transition: color 0.35s;
- white-space: nowrap;
- color: var(--main);
- &:last-child {
- margin-right: 0;
- }
- &::after {
- content: '';
- position: absolute;
- bottom: 0;
- left: 0;
- right: 0;
- height: 3px;
- transition: opacity 0.5s, transform 0.5s;
- border-radius: 6px 6px 0 0;
- opacity: 0;
- transform: scaleX(0.25);
- background: var(--theme);
- }
- &.active,
- &:hover {
- color: var(--theme);
- &::after {
- opacity: 1;
- transform: scaleX(1);
- }
- }
- }
- .joe_dropdown {
- &__link {
- a {
- height: 60px;
- line-height: 60px;
- font-size: 15px;
- padding-left: 8px;
- padding-right: 3px;
- transition: color 0.35s;
- white-space: nowrap;
- color: var(--main);
- }
- }
- &__menu {
- width: 110px;
- text-align: center;
- a {
- display: block;
- line-height: 34px;
- height: 34px;
- transition: color 0.35s, background 0.35s;
- color: var(--minor);
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
- padding: 0 15px;
- &:hover,
- &.active {
- color: var(--theme);
- background: var(--classD);
- }
- }
- }
- }
- }
- &-search {
- position: relative;
- margin-left: auto;
- display: flex;
- align-items: center;
- .input {
- background: var(--classC);
- width: 170px;
- height: 34px;
- border: 1px solid transparent;
- padding: 0 18px;
- color: var(--routine);
- transition: background 0.35s, border-color 0.35s, padding-right 0.35s;
- border-radius: 17px 0 0 17px;
- &:focus {
- background: var(--background);
- border-color: var(--theme);
- padding-right: 28px;
- ~ .icon {
- transform: translate3d(0, -50%, 0) rotateY(180deg);
- }
- }
- }
- .submit {
- position: relative;
- z-index: 1;
- height: 34px;
- border: none;
- background: var(--theme);
- color: #fff;
- border-radius: 0 17px 17px 0;
- padding: 0 10px;
- }
- .icon {
- position: absolute;
- top: 50%;
- left: 142px;
- width: 28px;
- height: 38px;
- background: url(../img/search.png);
- background-size: 100% 100%;
- transition: transform 0.35s;
- transform: translate3d(100%, -50%, 0) rotateY(180deg);
- }
- }
- }
- &__below {
- border-top: 1px solid var(--classC);
- height: 45px;
- &-class {
- display: flex;
- .item {
- margin-right: 15px;
- color: var(--minor);
- height: 45px;
- line-height: 45px;
- transition: color 0.35s;
- white-space: nowrap;
- &:hover,
- &.active {
- color: var(--theme);
- }
- }
- .joe_dropdown {
- margin-right: 15px;
- &__link {
- .item {
- margin-right: 3px;
- }
- }
- &__menu {
- width: 110px;
- text-align: center;
- a {
- display: block;
- height: 34px;
- line-height: 34px;
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
- color: var(--minor);
- transition: color 0.35s, background 0.35s;
- &:hover,
- &.active {
- color: var(--theme);
- background: var(--classD);
- }
- }
- }
- }
- }
- }
+ position: sticky;
+ top: 0;
+ z-index: 1000;
+ background: var(--background);
+ box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1);
+ &__above {
+ &-logo {
+ position: relative;
+ display: flex;
+ align-items: center;
+ height: 60px;
+ padding-right: 15px;
+ margin-right: 15px;
+ img {
+ max-width: 150px;
+ max-height: 50px;
+ object-fit: cover;
+ }
+ &::after {
+ content: '';
+ position: absolute;
+ top: 50%;
+ right: 0;
+ width: 1px;
+ height: 20px;
+ background: var(--classC);
+ transform: translateY(-50%);
+ }
+ }
+ &-nav {
+ display: flex;
+ align-items: center;
+ .item {
+ position: relative;
+ height: 60px;
+ line-height: 60px;
+ font-size: 15px;
+ padding: 0 8px;
+ margin-right: 15px;
+ transition: color 0.35s;
+ white-space: nowrap;
+ color: var(--main);
+ &:last-child {
+ margin-right: 0;
+ }
+ &::after {
+ content: '';
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ height: 3px;
+ transition: opacity 0.5s, transform 0.5s;
+ border-radius: 6px 6px 0 0;
+ opacity: 0;
+ transform: scaleX(0.25);
+ background: var(--theme);
+ }
+ &.active,
+ &:hover {
+ color: var(--theme);
+ &::after {
+ opacity: 1;
+ transform: scaleX(1);
+ }
+ }
+ }
+ .joe_dropdown {
+ &__link {
+ a {
+ height: 60px;
+ line-height: 60px;
+ font-size: 15px;
+ padding-left: 8px;
+ padding-right: 3px;
+ transition: color 0.35s;
+ white-space: nowrap;
+ color: var(--main);
+ }
+ }
+ &__menu {
+ width: 110px;
+ text-align: center;
+ a {
+ display: block;
+ line-height: 34px;
+ height: 34px;
+ transition: color 0.35s, background 0.35s;
+ color: var(--minor);
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ padding: 0 15px;
+ &:hover,
+ &.active {
+ color: var(--theme);
+ background: var(--classD);
+ }
+ }
+ }
+ }
+ }
+ &-search {
+ position: relative;
+ margin-left: auto;
+ display: flex;
+ align-items: center;
+ .input {
+ background: var(--classC);
+ width: 170px;
+ height: 34px;
+ border: 1px solid transparent;
+ padding: 0 18px;
+ color: var(--routine);
+ transition: background 0.35s, border-color 0.35s, padding-right 0.35s;
+ border-radius: 17px 0 0 17px;
+ &:focus {
+ background: var(--background);
+ border-color: var(--theme);
+ padding-right: 28px;
+ ~ .icon {
+ transform: translate3d(0, -50%, 0) rotateY(180deg);
+ }
+ }
+ }
+ .submit {
+ position: relative;
+ z-index: 1;
+ height: 34px;
+ border: none;
+ background: var(--theme);
+ color: #fff;
+ border-radius: 0 17px 17px 0;
+ padding: 0 10px;
+ }
+ .icon {
+ position: absolute;
+ top: 50%;
+ left: 142px;
+ width: 28px;
+ height: 38px;
+ background: url(../img/search.png);
+ background-size: 100% 100%;
+ transition: transform 0.35s;
+ transform: translate3d(100%, -50%, 0) rotateY(180deg);
+ }
+ }
+ }
+ &__below {
+ border-top: 1px solid var(--classC);
+ height: 45px;
+ &-class {
+ display: flex;
+ .item {
+ margin-right: 15px;
+ color: var(--minor);
+ height: 45px;
+ line-height: 45px;
+ transition: color 0.35s;
+ white-space: nowrap;
+ &:hover,
+ &.active {
+ color: var(--theme);
+ }
+ }
+ .joe_dropdown {
+ margin-right: 15px;
+ &__link {
+ .item {
+ margin-right: 3px;
+ }
+ }
+ &__menu {
+ width: 110px;
+ text-align: center;
+ a {
+ display: block;
+ height: 34px;
+ line-height: 34px;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ color: var(--minor);
+ transition: color 0.35s, background 0.35s;
+ &:hover,
+ &.active {
+ color: var(--theme);
+ background: var(--classD);
+ }
+ }
+ }
+ }
+ }
+ }
}
.joe_aside {
- padding: 15px 0;
- margin-left: 15px;
- &__item {
- position: relative;
- width: 250px;
- margin-bottom: 15px;
- border-radius: 8px;
- box-shadow: var(--box-shadow);
- overflow: hidden;
- &:last-child {
- position: sticky;
- margin-bottom: 0;
- }
- &-title {
- display: flex;
- align-items: center;
- border-bottom: 1px solid var(--classC);
- font-size: 16px;
- font-weight: 500;
- height: 45px;
- line-height: 45px;
- padding: 0 15px;
- color: var(--main);
- .icon {
- width: 18px;
- height: 18px;
- margin-right: 8px;
- fill: var(--main);
- }
- .line {
- width: 10px;
- height: 1px;
- background: #54b5db;
- margin-left: 12px;
- }
- }
- &-contain {
- position: relative;
- padding: 15px;
- }
- &.author {
- background: var(--background);
- padding: 45px 15px 15px;
- &::before {
- content: '';
- position: absolute;
- top: 90px;
- left: 0;
- width: 100%;
- height: 30px;
- z-index: 2;
- background: linear-gradient(to bottom, rgba(255, 255, 255, 0), var(--background));
- }
- &::after {
- display: none;
- content: '';
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 273px;
- background: url('https://cdn.jsdelivr.net/gh/HaoOuBa/Joe@master/assets/img/snow.gif') no-repeat;
- background-size: cover;
- z-index: 3;
- pointer-events: none;
- }
- &:hover::after {
- display: block;
- }
- .image {
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 120px;
- object-fit: cover;
- z-index: 1;
- }
- .user {
- position: relative;
- z-index: 4;
- display: flex;
- flex-direction: column;
- align-items: center;
- padding-bottom: 15px;
- .avatar {
- width: 75px;
- height: 75px;
- border-radius: 50%;
- overflow: hidden;
- margin-bottom: 10px;
- object-fit: cover;
- transition: transform 0.75s;
- background: var(--background);
- padding: 5px;
- &:hover {
- transform: rotate(360deg);
- }
- }
- .link {
- color: var(--theme);
- margin-bottom: 10px;
- font-size: 16px;
- font-weight: 500;
- &:hover {
- text-decoration: underline;
- }
- }
- .motto {
- color: var(--main);
- text-align: center;
- }
- }
- .count {
- width: 100%;
- padding-bottom: 15px;
- display: flex;
- align-items: center;
- border-bottom: 1px solid var(--classC);
- .item {
- min-width: 0;
- flex: 1;
- display: flex;
- flex-direction: column;
- align-items: center;
- color: var(--routine);
- font-size: 12px;
- &:first-child {
- border-right: 1px solid var(--classC);
- }
- .num {
- max-width: 70px;
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
- font-weight: 500;
- font-size: 22px;
- color: var(--main);
- margin-bottom: 3px;
- text-shadow: var(--text_shadow);
- }
- }
- }
- .list {
- padding-top: 15px;
- .item {
- display: flex;
- align-items: center;
- justify-content: space-between;
- line-height: 30px;
- .link {
- position: relative;
- color: var(--routine);
- max-width: 85%;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- &::after {
- content: '';
- position: absolute;
- bottom: 0;
- left: 0;
- width: 0;
- height: 1px;
- background: var(--theme);
- transition: all 0.35s;
- }
- &:hover {
- color: var(--theme);
- &::after {
- width: 100%;
- }
- }
- }
- .icon {
- fill: var(--routine);
- }
- }
- }
- }
- &.timelife {
- background: var(--background);
- .item {
- margin-bottom: 15px;
- &:last-child {
- margin-bottom: 0;
- }
- .title {
- font-size: 12px;
- color: var(--minor);
- margin-bottom: 5px;
- display: flex;
- align-items: center;
- .text {
- color: var(--theme);
- font-weight: 500;
- font-size: 14px;
- margin: 0 5px;
- }
- }
- .progress {
- display: flex;
- align-items: center;
- &-bar {
- height: 10px;
- border-radius: 5px;
- overflow: hidden;
- background: var(--classC);
- width: 0;
- min-width: 0;
- flex: 1;
- margin-right: 5px;
- &-inner {
- width: 0;
- height: 100%;
- border-radius: 5px;
- transition: width 0.35s;
- animation: progress 750ms linear infinite;
- &-0 {
- background: #bde6ff;
- background-image: linear-gradient(135deg, #50bfff 25%, transparent 25%, transparent 50%, #50bfff 50%, #50bfff 75%, transparent 75%, transparent 100%);
- background-size: 30px 30px;
- }
- &-1 {
- background: #ffd980;
- background-image: linear-gradient(135deg, #f7ba2a 25%, transparent 25%, transparent 50%, #f7ba2a 50%, #f7ba2a 75%, transparent 75%, transparent 100%);
- background-size: 30px 30px;
- }
- &-2 {
- background: #ffa9a9;
- background-image: linear-gradient(135deg, #ff4949 25%, transparent 25%, transparent 50%, #ff4949 50%, #ff4949 75%, transparent 75%, transparent 100%);
- background-size: 30px 30px;
- }
- &-3 {
- background: #67c23a;
- background-image: linear-gradient(135deg, #4f9e28 25%, transparent 25%, transparent 50%, #4f9e28 50%, #4f9e28 75%, transparent 75%, transparent 100%);
- background-size: 30px 30px;
- }
- }
- }
- &-percentage {
- color: var(--minor);
- }
- }
- }
- }
- &.weather {
- background: var(--background);
- .joe_aside__item-contain {
- min-height: 300px;
- }
- }
- &.hot {
- background: var(--background);
- .empty {
- text-align: center;
- color: var(--routine);
- }
- .item {
- margin-bottom: 15px;
- &:last-child {
- margin-bottom: 0;
- }
- &:nth-child(1) .link .sort {
- background: #ff183e;
- }
- &:nth-child(2) .link .sort {
- background: #ff5c38;
- }
- &:nth-child(3) .link .sort {
- background: #ffb821;
- }
- .link {
- position: relative;
- display: block;
- border-radius: 4px;
- overflow: hidden;
- &:hover .image {
- transform: scale(1.2);
- }
- .sort {
- position: absolute;
- top: 5px;
- right: -20px;
- background: #7f7f8c;
- color: #fff;
- width: 65px;
- text-align: center;
- font-size: 12px;
- transform: rotate(45deg);
- font-weight: 500;
- z-index: 1;
- font-style: normal;
- }
- .image {
- width: 100%;
- height: 130px;
- object-fit: cover;
- transition: transform 0.35s;
- }
- .describe {
- position: absolute;
- z-index: 1;
- left: 0;
- right: 0;
- bottom: 0;
- padding: 10px;
- background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75));
- font-size: 12px;
- color: var(--seat);
- h6 {
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
- color: #fff;
- line-height: 24px;
- font-size: 14px;
- }
- }
- }
- }
- }
- &.ranking {
- background: var(--background);
- .item {
- display: flex;
- align-items: center;
- line-height: 32px;
- overflow: hidden;
- &:nth-child(1) .sort {
- color: #fe2d46;
- }
- &:nth-child(2) .sort {
- color: #f60;
- }
- &:nth-child(3) .sort {
- color: #faa90e;
- }
- .sort {
- color: var(--minor);
- font-weight: 700;
- font-size: 18px;
- width: 18px;
- min-width: 18px;
- max-width: 18px;
- }
- .link {
- position: relative;
- color: var(--routine);
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
- &::after {
- position: absolute;
- content: '';
- bottom: 0;
- left: 0;
- width: 0;
- height: 1px;
- background: var(--theme);
- transition: width 0.5s;
- }
- &:hover {
- color: var(--theme);
- &::after {
- width: 100%;
- }
- }
- }
- }
- .error {
- text-align: center;
- color: var(--routine);
- }
- }
- &.newreply {
- background: var(--background);
- .empty {
- text-align: center;
- color: var(--routine);
- }
- .item {
- margin-bottom: 15px;
- border-bottom: 1px dashed var(--classC);
- padding-bottom: 15px;
- &:last-child {
- margin-bottom: 0;
- border-bottom-color: transparent;
- padding-bottom: 0;
- }
- .user {
- display: flex;
- margin-bottom: 12px;
- .avatar {
- width: 40px;
- height: 40px;
- min-width: 40px;
- min-height: 40px;
- margin-right: 12px;
- border-radius: 50%;
- border: 1px solid var(--classA);
- padding: 3px;
- }
- .info {
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- .author {
- color: var(--main);
- font-weight: 600;
- max-width: 150px;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- }
- .date {
- font-size: 12px;
- color: var(--minor);
- }
- }
- }
- .reply {
- position: relative;
- background: var(--classD);
- border-radius: 6px;
- padding: 5px 10px;
- &::before {
- content: '';
- width: 0;
- height: 0;
- border-bottom: 6px solid var(--classD);
- border-left: 6px solid transparent;
- border-right: 6px solid transparent;
- position: absolute;
- left: 15px;
- bottom: 100%;
- }
- .link {
- display: -webkit-box;
- -webkit-line-clamp: 2;
- /*! autoprefixer: off */
- -webkit-box-orient: vertical;
- /* autoprefixer: on */
- overflow: hidden;
- text-overflow: ellipsis;
+ padding: 15px 0;
+ margin-left: 15px;
+ &__item {
+ position: relative;
+ width: 250px;
+ margin-bottom: 15px;
+ border-radius: 8px;
+ box-shadow: var(--box-shadow);
+ overflow: hidden;
+ &:last-child {
+ position: sticky;
+ margin-bottom: 0;
+ }
+ &-title {
+ display: flex;
+ align-items: center;
+ border-bottom: 1px solid var(--classC);
+ font-size: 16px;
+ font-weight: 500;
+ height: 45px;
+ line-height: 45px;
+ padding: 0 15px;
+ color: var(--main);
+ .icon {
+ width: 18px;
+ height: 18px;
+ margin-right: 8px;
+ fill: var(--main);
+ }
+ .line {
+ width: 10px;
+ height: 1px;
+ background: #54b5db;
+ margin-left: 12px;
+ }
+ }
+ &-contain {
+ position: relative;
+ padding: 15px;
+ }
+ &.author {
+ background: var(--background);
+ padding: 45px 15px 15px;
+ &::before {
+ content: '';
+ position: absolute;
+ top: 90px;
+ left: 0;
+ width: 100%;
+ height: 30px;
+ z-index: 2;
+ background: linear-gradient(to bottom, rgba(255, 255, 255, 0), var(--background));
+ }
+ &::after {
+ display: none;
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 273px;
+ background: url('https://cdn.jsdelivr.net/gh/HaoOuBa/Joe@master/assets/img/snow.gif') no-repeat;
+ background-size: cover;
+ z-index: 3;
+ pointer-events: none;
+ }
+ &:hover::after {
+ display: block;
+ }
+ .image {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 120px;
+ object-fit: cover;
+ z-index: 1;
+ }
+ .user {
+ position: relative;
+ z-index: 4;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ padding-bottom: 15px;
+ .avatar {
+ width: 75px;
+ height: 75px;
+ border-radius: 50%;
+ overflow: hidden;
+ margin-bottom: 10px;
+ object-fit: cover;
+ transition: transform 0.75s;
+ background: var(--background);
+ padding: 5px;
+ &:hover {
+ transform: rotate(360deg);
+ }
+ }
+ .link {
+ color: var(--theme);
+ margin-bottom: 10px;
+ font-size: 16px;
+ font-weight: 500;
+ &:hover {
+ text-decoration: underline;
+ }
+ }
+ .motto {
+ color: var(--main);
+ text-align: center;
+ }
+ }
+ .count {
+ width: 100%;
+ padding-bottom: 15px;
+ display: flex;
+ align-items: center;
+ border-bottom: 1px solid var(--classC);
+ .item {
+ min-width: 0;
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ color: var(--routine);
+ font-size: 12px;
+ &:first-child {
+ border-right: 1px solid var(--classC);
+ }
+ .num {
+ max-width: 70px;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ font-weight: 500;
+ font-size: 22px;
+ color: var(--main);
+ margin-bottom: 3px;
+ text-shadow: var(--text_shadow);
+ }
+ }
+ }
+ .list {
+ padding-top: 15px;
+ .item {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ line-height: 30px;
+ .link {
+ position: relative;
+ color: var(--routine);
+ max-width: 85%;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ &::after {
+ content: '';
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ width: 0;
+ height: 1px;
+ background: var(--theme);
+ transition: all 0.35s;
+ }
+ &:hover {
+ color: var(--theme);
+ &::after {
+ width: 100%;
+ }
+ }
+ }
+ .icon {
+ fill: var(--routine);
+ }
+ }
+ }
+ }
+ &.timelife {
+ background: var(--background);
+ .item {
+ margin-bottom: 15px;
+ &:last-child {
+ margin-bottom: 0;
+ }
+ .title {
+ font-size: 12px;
+ color: var(--minor);
+ margin-bottom: 5px;
+ display: flex;
+ align-items: center;
+ .text {
+ color: var(--theme);
+ font-weight: 500;
+ font-size: 14px;
+ margin: 0 5px;
+ }
+ }
+ .progress {
+ display: flex;
+ align-items: center;
+ &-bar {
+ height: 10px;
+ border-radius: 5px;
+ overflow: hidden;
+ background: var(--classC);
+ width: 0;
+ min-width: 0;
+ flex: 1;
+ margin-right: 5px;
+ &-inner {
+ width: 0;
+ height: 100%;
+ border-radius: 5px;
+ transition: width 0.35s;
+ animation: progress 750ms linear infinite;
+ &-0 {
+ background: #bde6ff;
+ background-image: linear-gradient(135deg, #50bfff 25%, transparent 25%, transparent 50%, #50bfff 50%, #50bfff 75%, transparent 75%, transparent 100%);
+ background-size: 30px 30px;
+ }
+ &-1 {
+ background: #ffd980;
+ background-image: linear-gradient(135deg, #f7ba2a 25%, transparent 25%, transparent 50%, #f7ba2a 50%, #f7ba2a 75%, transparent 75%, transparent 100%);
+ background-size: 30px 30px;
+ }
+ &-2 {
+ background: #ffa9a9;
+ background-image: linear-gradient(135deg, #ff4949 25%, transparent 25%, transparent 50%, #ff4949 50%, #ff4949 75%, transparent 75%, transparent 100%);
+ background-size: 30px 30px;
+ }
+ &-3 {
+ background: #67c23a;
+ background-image: linear-gradient(135deg, #4f9e28 25%, transparent 25%, transparent 50%, #4f9e28 50%, #4f9e28 75%, transparent 75%, transparent 100%);
+ background-size: 30px 30px;
+ }
+ }
+ }
+ &-percentage {
+ color: var(--minor);
+ }
+ }
+ }
+ }
+ &.weather {
+ background: var(--background);
+ .joe_aside__item-contain {
+ min-height: 300px;
+ }
+ }
+ &.hot {
+ background: var(--background);
+ .empty {
+ text-align: center;
+ color: var(--routine);
+ }
+ .item {
+ margin-bottom: 15px;
+ &:last-child {
+ margin-bottom: 0;
+ }
+ &:nth-child(1) .link .sort {
+ background: #ff183e;
+ }
+ &:nth-child(2) .link .sort {
+ background: #ff5c38;
+ }
+ &:nth-child(3) .link .sort {
+ background: #ffb821;
+ }
+ .link {
+ position: relative;
+ display: block;
+ border-radius: 4px;
+ overflow: hidden;
+ &:hover .image {
+ transform: scale(1.2);
+ }
+ .sort {
+ position: absolute;
+ top: 5px;
+ right: -20px;
+ background: #7f7f8c;
+ color: #fff;
+ width: 65px;
+ text-align: center;
+ font-size: 12px;
+ transform: rotate(45deg);
+ font-weight: 500;
+ z-index: 1;
+ font-style: normal;
+ }
+ .image {
+ width: 100%;
+ height: 130px;
+ object-fit: cover;
+ transition: transform 0.35s;
+ }
+ .describe {
+ position: absolute;
+ z-index: 1;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ padding: 10px;
+ background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75));
+ font-size: 12px;
+ color: var(--seat);
+ h6 {
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ color: #fff;
+ line-height: 24px;
+ font-size: 14px;
+ }
+ }
+ }
+ }
+ }
+ &.ranking {
+ background: var(--background);
+ .item {
+ display: flex;
+ align-items: center;
+ line-height: 32px;
+ overflow: hidden;
+ &:nth-child(1) .sort {
+ color: #fe2d46;
+ }
+ &:nth-child(2) .sort {
+ color: #f60;
+ }
+ &:nth-child(3) .sort {
+ color: #faa90e;
+ }
+ .sort {
+ color: var(--minor);
+ font-weight: 700;
+ font-size: 18px;
+ width: 18px;
+ min-width: 18px;
+ max-width: 18px;
+ }
+ .link {
+ position: relative;
+ color: var(--routine);
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ &::after {
+ position: absolute;
+ content: '';
+ bottom: 0;
+ left: 0;
+ width: 0;
+ height: 1px;
+ background: var(--theme);
+ transition: width 0.5s;
+ }
+ &:hover {
+ color: var(--theme);
+ &::after {
+ width: 100%;
+ }
+ }
+ }
+ }
+ .error {
+ text-align: center;
+ color: var(--routine);
+ }
+ }
+ &.newreply {
+ background: var(--background);
+ .empty {
+ text-align: center;
+ color: var(--routine);
+ }
+ .item {
+ margin-bottom: 15px;
+ border-bottom: 1px dashed var(--classC);
+ padding-bottom: 15px;
+ &:last-child {
+ margin-bottom: 0;
+ border-bottom-color: transparent;
+ padding-bottom: 0;
+ }
+ .user {
+ display: flex;
+ margin-bottom: 12px;
+ .avatar {
+ width: 40px;
+ height: 40px;
+ min-width: 40px;
+ min-height: 40px;
+ margin-right: 12px;
+ border-radius: 50%;
+ border: 1px solid var(--classA);
+ padding: 3px;
+ }
+ .info {
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+ .author {
+ color: var(--main);
+ font-weight: 600;
+ max-width: 150px;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+ .date {
+ font-size: 12px;
+ color: var(--minor);
+ }
+ }
+ }
+ .reply {
+ position: relative;
+ background: var(--classD);
+ border-radius: 6px;
+ padding: 5px 10px;
+ &::before {
+ content: '';
+ width: 0;
+ height: 0;
+ border-bottom: 6px solid var(--classD);
+ border-left: 6px solid transparent;
+ border-right: 6px solid transparent;
+ position: absolute;
+ left: 15px;
+ bottom: 100%;
+ }
+ .link {
+ display: -webkit-box;
+ -webkit-line-clamp: 2;
+ /*! autoprefixer: off */
+ -webkit-box-orient: vertical;
+ /* autoprefixer: on */
+ overflow: hidden;
+ text-overflow: ellipsis;
- color: var(--minor);
- font-size: 13px;
- font-weight: 500;
- line-height: 24px;
- transition: all 0.35s;
- &:hover {
- color: var(--theme);
- }
- .owo_image {
- height: 18px;
- vertical-align: -5px;
- }
- }
- }
- }
- }
- }
+ color: var(--minor);
+ font-size: 13px;
+ font-weight: 500;
+ line-height: 24px;
+ transition: all 0.35s;
+ &:hover {
+ color: var(--theme);
+ }
+ .owo_image {
+ height: 18px;
+ vertical-align: -5px;
+ }
+ }
+ }
+ }
+ }
+ }
}
.joe_list {
- &__list {
- display: flex;
- position: relative;
- width: 100%;
- padding: 15px 0;
- border-bottom: 1px solid var(--classC);
- &:last-child {
- border-bottom: none;
- }
- &:hover {
- .line {
- transform: scaleY(1);
- }
- .thumbnail {
- time {
- transform: translate3d(0, 0, 0);
- }
- }
- }
- .line {
- position: absolute;
- z-index: 1;
- top: 15px;
- left: -15px;
- width: 4px;
- height: 25px;
- border-radius: 2px;
- background: var(--theme);
- transform: scaleY(0);
- transition: transform 0.35s;
- }
- .thumbnail {
- position: relative;
- width: 210px;
- height: 140px;
- min-width: 210px;
- min-height: 140px;
- margin-right: 15px;
- overflow: hidden;
- img {
- width: 100%;
- height: 100%;
- object-fit: cover;
- border-radius: 5px;
- transition: opacity 0.35s;
- &:hover {
- opacity: 0.85;
- }
- }
- time {
- position: absolute;
- z-index: 1;
- top: 5px;
- right: 5px;
- background: var(--theme);
- height: 20px;
- line-height: 20px;
- padding: 0 8px;
- color: #fff;
- font-size: 12px;
- border-radius: 10px;
- transition: transform 0.35s;
- transform: translate3d(120%, 0, 0);
- }
- svg {
- position: absolute;
- z-index: 1;
- top: 5px;
- left: 5px;
- width: 20px;
- height: 20px;
- fill: #fff;
- }
- }
- }
+ &__item {
+ display: flex;
+ position: relative;
+ width: 100%;
+ padding: 15px 0;
+ border-bottom: 1px solid var(--classC);
+ &:last-child {
+ border-bottom: none;
+ }
+ &:hover {
+ .line {
+ transform: scaleY(1);
+ }
+ .thumbnail {
+ time {
+ transform: translate3d(0, 0, 0);
+ }
+ }
+ }
+ .line {
+ position: absolute;
+ z-index: 1;
+ top: 15px;
+ left: -15px;
+ width: 4px;
+ height: 25px;
+ border-radius: 2px;
+ background: var(--theme);
+ transform: scaleY(0);
+ transition: transform 0.35s;
+ }
+ .thumbnail {
+ position: relative;
+ width: 210px;
+ height: 140px;
+ min-width: 210px;
+ min-height: 140px;
+ margin-right: 15px;
+ overflow: hidden;
+ img {
+ width: 100%;
+ height: 100%;
+ object-fit: cover;
+ border-radius: 4px;
+ transition: opacity 0.35s;
+ &:hover {
+ opacity: 0.85;
+ }
+ }
+ time {
+ position: absolute;
+ z-index: 1;
+ top: 5px;
+ right: 5px;
+ background: var(--theme);
+ height: 20px;
+ line-height: 20px;
+ padding: 0 8px;
+ color: #fff;
+ font-size: 12px;
+ border-radius: 10px;
+ transition: transform 0.35s;
+ transform: translate3d(120%, 0, 0);
+ }
+ svg {
+ position: absolute;
+ z-index: 1;
+ top: 5px;
+ left: 5px;
+ width: 20px;
+ height: 20px;
+ fill: #fff;
+ }
+ }
+ .information {
+ display: flex;
+ flex-direction: column;
+ flex: 1;
+ min-width: 0;
+ .title {
+ display: flex;
+ align-items: center;
+ margin-bottom: 10px;
+ .badge {
+ height: 20px;
+ line-height: 20px;
+ background-image: -webkit-linear-gradient(0deg, #3ca5f6 0%, #a86af9 100%);
+ color: #fff;
+ font-size: 12px;
+ margin-right: 5px;
+ border-radius: 2px;
+ padding: 0 8px;
+ white-space: nowrap;
+ }
+ h6 {
+ color: var(--main);
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ font-size: 18px;
+ line-height: 24px;
+ transition: color 0.35s;
+ &:hover {
+ color: var(--theme);
+ }
+ }
+ }
+ .abstract {
+ display: -webkit-box;
+ -webkit-line-clamp: 2;
+ /*! autoprefixer: off */
+ -webkit-box-orient: vertical;
+ /* autoprefixer: on */
+ overflow: hidden;
+ text-overflow: ellipsis;
+ color: var(--minor);
+ transition: opacity 0.35s;
+ word-break: break-all;
+ line-height: 24px;
+ &:hover {
+ opacity: 0.8;
+ }
+ }
+ .meta {
+ display: flex;
+ align-items: center;
+ margin-top: auto;
+ color: var(--minor);
+ font-size: 13px;
+ .items {
+ display: flex;
+ align-items: center;
+ li {
+ &::after {
+ content: '/';
+ color: #e1e1e1;
+ padding: 0 5px;
+ }
+ &:last-child::after {
+ display: none;
+ }
+ }
+ }
+ .last {
+ margin-left: auto;
+ display: flex;
+ align-items: center;
+ .icon {
+ margin-right: 3px;
+ }
+ .link {
+ color: var(--minor);
+ &:hover {
+ color: var(--theme);
+ }
+ }
+ }
+ }
+ }
+ }
+ &__loading {
+ .item {
+ display: flex;
+ position: relative;
+ width: 100%;
+ padding: 15px 0;
+ border-bottom: 1px solid var(--classC);
+ &:last-child {
+ border-bottom: none;
+ }
+ .thumbnail {
+ position: relative;
+ width: 210px;
+ height: 140px;
+ min-width: 210px;
+ min-height: 140px;
+ margin-right: 15px;
+ background: var(--classD);
+ animation: list_thumbnail_loading 0.5s infinite alternate;
+ border-radius: 4px;
+ }
+ .information {
+ flex: 1;
+ min-width: 0;
+ .title {
+ height: 24px;
+ border-radius: 4px;
+ background: var(--classD);
+ animation: list_title_loading 0.75s infinite alternate;
+ margin-bottom: 15px;
+ }
+ .abstract {
+ p {
+ height: 18px;
+ border-radius: 4px;
+ background: var(--classD);
+ margin-bottom: 5px;
+ animation: list_abstract_loading 0.8s infinite alternate;
+ }
+ }
+ }
+ }
+ }
+}
+
+.joe_load {
+ margin: 15px auto 0;
+ width: 120px;
+ height: 32px;
+ line-height: 32px;
+ text-align: center;
+ border-radius: 16px;
+ cursor: pointer;
+ user-select: none;
+ background: var(--background);
+ color: var(--routine);
+ transition: transform 0.25s;
+ box-shadow: var(--box-shadow);
+ &:active {
+ transform: scale(0.75);
+ }
}
@keyframes progress {
- 0% {
- background-position: 0 0;
- }
- 100% {
- background-position: 30px 0;
- }
+ 0% {
+ background-position: 0 0;
+ }
+ 100% {
+ background-position: 30px 0;
+ }
+}
+
+@keyframes list_thumbnail_loading {
+ 0% {
+ transform: scale(0.85);
+ }
+ 100% {
+ transform: scale(1);
+ }
+}
+@keyframes list_title_loading {
+ 0% {
+ width: 80%;
+ }
+ 100% {
+ width: 95%;
+ }
+}
+@keyframes list_abstract_loading {
+ 0% {
+ width: 60%;
+ }
+ 100% {
+ width: 80%;
+ }
}
diff --git a/assets/css/joe.index.css b/assets/css/joe.index.css
index 2960ad4..c93acfd 100644
--- a/assets/css/joe.index.css
+++ b/assets/css/joe.index.css
@@ -1 +1 @@
-.joe_index{border-radius:8px;padding:0 15px;background:var(--background);box-shadow:var(--box-shadow);margin-bottom:15px}.joe_index__banner{padding-top:15px;display:flex}.joe_index__banner-recommend{width:270px;margin-left:15px;display:flex;flex-direction:column}.joe_index__banner-recommend.noswiper{width:100%;flex-direction:row;margin-left:0}.joe_index__banner-recommend.noswiper .item:first-child{margin-bottom:0;margin-right:7.5px}.joe_index__banner-recommend.noswiper .item:last-child{margin-left:7.5px}.joe_index__banner-recommend .item{position:relative;width:100%;height:160px;margin-bottom:15px;border-radius:5px;overflow:hidden}.joe_index__banner-recommend .item:last-child{margin-bottom:0}.joe_index__banner-recommend .item .thumbnail{display:block;width:100%;height:100%;transition:opacity 0.35s}.joe_index__banner-recommend .item .thumbnail img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.joe_index__banner-recommend .item .thumbnail:hover{opacity:0.85}.joe_index__banner-recommend .item .information{display:flex;align-items:center;position:absolute;z-index:1;bottom:0;left:0;right:0;padding:8px;background:linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.5));color:#fff;line-height:20px}.joe_index__banner-recommend .item .information_type{background-image:linear-gradient(to right, #fc712a, #f84c39);background-color:#f84c39;padding:0 5px;height:20px;border-radius:2px;margin-right:5px;font-size:12px}.joe_index__banner-recommend .item .information_title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;font-size:14px}.joe_index__hot{padding-top:15px}.joe_index__hot-list{display:flex;margin:0 -5px}.joe_index__hot-list .item{width:25%;padding:0 5px}.joe_index__hot-list .item .link{display:block}.joe_index__hot-list .item .link .inner{position:relative;cursor:pointer}.joe_index__hot-list .item .link .inner:hover .image{opacity:0.85}.joe_index__hot-list .item .link .inner:hover .title{background:var(--classC)}.joe_index__hot-list .item .link .inner .image{width:100%;height:125px;-o-object-fit:cover;object-fit:cover;border-radius:5px 5px 0 0;transition:opacity 0.35s}.joe_index__hot-list .item .link .inner .title{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;padding:0 8px;line-height:32px;color:var(--minor);background:var(--classD);border-radius:0 0 5px 5px;transition:background 0.35s}.joe_index__hot-list .item .link .inner .views{display:flex;align-items:center;position:absolute;z-index:1;top:5px;right:5px;background-image:linear-gradient(270deg, #986fee, #8695e6, #68b7dd, #18d7d3);color:#fff;font-size:12px;height:18px;padding:0 8px;border-radius:2px;white-space:nowrap}.joe_index__title{display:flex;align-items:center;border-bottom:1px solid var(--classC)}.joe_index__title-title{position:relative;display:flex;align-items:center;color:var(--routine);font-weight:500;height:40px;line-height:40px}.joe_index__title-title .item{cursor:pointer;margin-right:20px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;transition:color 0.35s}.joe_index__title-title .item.active{color:var(--theme)}.joe_index__title-title .line{position:absolute;bottom:-1px;left:0;height:2px;border-radius:1px;background:var(--theme);transition:left 0.35s, width 0.35s}.swiper-container{min-width:0;flex:1;height:335px;--swiper-theme-color: #fff;border-radius:5px}.swiper-container .item{display:block;height:335px;border-radius:5px}.swiper-container .item .thumbnail{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;transition:opacity 0.35s}.swiper-container .item .thumbnail:hover{opacity:0.85}.swiper-container .item .title{position:absolute;z-index:1;left:0;right:0;bottom:0;text-align:center;background:linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.45));white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff;font-size:15px;padding:10px;font-weight:normal}.swiper-container .item .icon{position:absolute;z-index:1;top:10px;left:10px;width:18px;height:18px;fill:#fff;opacity:0.5}.swiper-container.swiper-container-horizontal .swiper-pagination-bullets{bottom:unset;left:unset;width:auto;right:10px;top:10px}
+.joe_index{border-radius:8px;padding:0 15px;background:var(--background);box-shadow:var(--box-shadow)}.joe_index__banner{padding-top:15px;display:flex}.joe_index__banner-recommend{width:270px;margin-left:15px;display:flex;flex-direction:column}.joe_index__banner-recommend.noswiper{width:100%;flex-direction:row;margin-left:0}.joe_index__banner-recommend.noswiper .item:first-child{margin-bottom:0;margin-right:7.5px}.joe_index__banner-recommend.noswiper .item:last-child{margin-left:7.5px}.joe_index__banner-recommend .item{position:relative;width:100%;height:160px;margin-bottom:15px;border-radius:5px;overflow:hidden}.joe_index__banner-recommend .item:last-child{margin-bottom:0}.joe_index__banner-recommend .item .thumbnail{display:block;width:100%;height:100%;transition:opacity 0.35s}.joe_index__banner-recommend .item .thumbnail img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.joe_index__banner-recommend .item .thumbnail:hover{opacity:0.85}.joe_index__banner-recommend .item .information{display:flex;align-items:center;position:absolute;z-index:1;bottom:0;left:0;right:0;padding:8px;background:linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.5));color:#fff;line-height:20px}.joe_index__banner-recommend .item .information_type{background-image:linear-gradient(to right, #fc712a, #f84c39);background-color:#f84c39;padding:0 5px;height:20px;border-radius:2px;margin-right:5px;font-size:12px}.joe_index__banner-recommend .item .information_title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;font-size:14px}.joe_index__hot{padding-top:15px}.joe_index__hot-list{display:flex;margin:0 -5px}.joe_index__hot-list .item{width:25%;padding:0 5px}.joe_index__hot-list .item .link{display:block}.joe_index__hot-list .item .link .inner{position:relative;cursor:pointer}.joe_index__hot-list .item .link .inner:hover .image{opacity:0.85}.joe_index__hot-list .item .link .inner:hover .title{background:var(--classC)}.joe_index__hot-list .item .link .inner .image{width:100%;height:125px;-o-object-fit:cover;object-fit:cover;border-radius:5px 5px 0 0;transition:opacity 0.35s}.joe_index__hot-list .item .link .inner .title{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;padding:0 8px;line-height:32px;color:var(--minor);background:var(--classD);border-radius:0 0 5px 5px;transition:background 0.35s}.joe_index__hot-list .item .link .inner .views{display:flex;align-items:center;position:absolute;z-index:1;top:5px;right:5px;background-image:linear-gradient(270deg, #986fee, #8695e6, #68b7dd, #18d7d3);color:#fff;font-size:12px;height:18px;padding:0 8px;border-radius:2px;white-space:nowrap}.joe_index__title{display:flex;align-items:center;border-bottom:1px solid var(--classC)}.joe_index__title-title{position:relative;display:flex;align-items:center;color:var(--routine);font-weight:500;height:40px;line-height:40px}.joe_index__title-title .item{cursor:pointer;margin-right:20px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;transition:color 0.35s}.joe_index__title-title .item.active{color:var(--theme)}.joe_index__title-title .line{position:absolute;bottom:-1px;left:0;height:2px;border-radius:1px;background:var(--theme);transition:left 0.35s, width 0.35s}.swiper-container{min-width:0;flex:1;height:335px;--swiper-theme-color: #fff;border-radius:5px}.swiper-container .item{display:block;height:335px;border-radius:5px}.swiper-container .item .thumbnail{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;transition:opacity 0.35s}.swiper-container .item .thumbnail:hover{opacity:0.85}.swiper-container .item .title{position:absolute;z-index:1;left:0;right:0;bottom:0;text-align:center;background:linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.45));white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff;font-size:15px;padding:10px;font-weight:normal}.swiper-container .item .icon{position:absolute;z-index:1;top:10px;left:10px;width:18px;height:18px;fill:#fff;opacity:0.5}.swiper-container.swiper-container-horizontal .swiper-pagination-bullets{bottom:unset;left:unset;width:auto;right:10px;top:10px}
diff --git a/assets/css/joe.index.scss b/assets/css/joe.index.scss
index 3a85939..1056b5a 100644
--- a/assets/css/joe.index.scss
+++ b/assets/css/joe.index.scss
@@ -3,7 +3,6 @@
padding: 0 15px;
background: var(--background);
box-shadow: var(--box-shadow);
- margin-bottom: 15px;
&__banner {
padding-top: 15px;
display: flex;
@@ -175,6 +174,8 @@
}
}
+
+
.swiper-container {
min-width: 0;
flex: 1;
diff --git a/assets/js/joe.global.js b/assets/js/joe.global.js
index e748e55..554548a 100644
--- a/assets/js/joe.global.js
+++ b/assets/js/joe.global.js
@@ -1,40 +1,45 @@
window.Joe = function () {
+ /* 请求基准URL */
const BASE_API = '/index.php/joe/api';
- let IsMobile = false;
- if (/windows phone|iphone|android/gi.test(window.navigator.userAgent)) {
- IsMobile = true;
- } else {
- IsMobile = false;
- }
+ /* 头部高度 */
+ const Header_Height = $('.joe_header').height();
+
+ /* 解决移动端Hover问题 */
+ document.addEventListener('touchstart', () => {});
+
+ /* 判断是否是手机 */
+ const IsMobile = /windows phone|iphone|android/gi.test(window.navigator.userAgent);
+
+ /* 设置侧边栏最后一个元素的高度 */
+ $('.joe_aside .joe_aside__item:last-child').css('top', Header_Height + 15);
/* Dropdown */
- {
- $('.joe_dropdown').each(function (index, item) {
- const menu = $(this).find('.joe_dropdown__menu');
- /* 弹出方式 */
- const trigger = $(item).attr('trigger') || 'click';
- /* 弹出高度 */
- const placement = $(item).attr('placement') || $(this).height() || 0;
- /* 设置弹出高度 */
- menu.css('top', placement);
- /* 如果是hover，则绑定hover事件 */
- if (trigger === 'hover') {
- $(this).hover(
- () => $(this).addClass('active'),
- () => $(this).removeClass('active')
- );
- } else {
- /* 否则绑定点击事件 */
- $(this).on('click', function (e) {
- $(this).toggleClass('active');
- $(document).one('click', () => $(this).removeClass('active'));
- e.stopPropagation();
- });
- menu.on('click', e => e.stopPropagation());
- }
- });
- }
+ $('.joe_dropdown').each(function (index, item) {
+ const menu = $(this).find('.joe_dropdown__menu');
+ /* 弹出方式 */
+ const trigger = $(item).attr('trigger') || 'click';
+ /* 弹出高度 */
+ const placement = $(item).attr('placement') || $(this).height() || 0;
+ /* 设置弹出高度 */
+ menu.css('top', placement);
+ /* 如果是hover，则绑定hover事件 */
+ if (trigger === 'hover') {
+ $(this).hover(
+ () => $(this).addClass('active'),
+ () => $(this).removeClass('active')
+ );
+ } else {
+ /* 否则绑定点击事件 */
+ $(this).on('click', function (e) {
+ $(this).toggleClass('active');
+ $(document).one('click', () => $(this).removeClass('active'));
+ e.stopPropagation();
+ });
+ menu.on('click', e => e.stopPropagation());
+ }
+ });
+
/* Timelife */
if ($('.joe_aside__item.timelife').length !== 0) {
let timelife = [
@@ -107,9 +112,7 @@ window.Joe = function () {
$.ajax({
url: BASE_API,
type: 'POST',
- data: {
- routeType: 'ranking'
- },
+ data: { routeType: 'ranking' },
success(res) {
$('.joe_aside__item.ranking .joe_aside__item-title .text').html(res.title);
let htmlStr = '';
@@ -137,59 +140,92 @@ window.Joe = function () {
new Swiper('.swiper-container', { direction, loop: true, autoplay: true, mousewheel: true, pagination: { el: '.swiper-pagination' } });
}
- /* Index Title */
+ /* Index List */
if ($('.joe_index__list').length > 0) {
let queryData = { page: 1, pageSize: 10, type: 'created' };
const initDom = () => {
- $('.joe_index__list').html('');
+ $('.joe_index__list .joe_list').html('');
const activeItem = $(`.joe_index__title-title .item[data-type="${queryData.type}"]`);
const activeLine = $('.joe_index__title-title .line');
activeItem.addClass('active').siblings().removeClass('active');
activeLine.css({ left: activeItem.position().left, width: activeItem.width() });
};
const pushDom = () => {
- $.ajax({
- url: BASE_API,
- type: 'POST',
- data: {
- routeType: 'list',
- page: queryData.page,
- pageSize: queryData.pageSize,
- type: queryData.type
- },
- success(res) {
- res.data.forEach(_ => {
- $('.joe_index__list').append(`
-
-
-
- 
-
-
-
-
-
- `);
- });
- new LazyLoad('.list_lazyload');
- }
+
+
+ `);
+ });
+ $('.joe_load').removeAttr('loading');
+ $('.joe_load').html('查看更多');
+ $('.joe_index__list .joe_list__loading').hide();
+ new LazyLoad('.list_lazyload');
+ reslove(res.data.length > 0 ? res.data.length - 1 : 0);
+ }
+ });
});
};
initDom();
pushDom();
- $('.joe_index__title-title .item').on('click', function () {
+ $('.joe_index__title-title .item').on('click', async function () {
+ if ($(this).attr('data-type') === queryData.type) return;
queryData = { page: 1, pageSize: 10, type: $(this).attr('data-type') };
initDom();
pushDom();
});
+ $('.joe_load').on('click', async function () {
+ if ($(this).attr('loading')) return;
+ queryData.page++;
+ let length = await pushDom();
+ length = $('.joe_index__list .joe_list .joe_list__item').length - length;
+ const queryElement = `.joe_index__list .joe_list .joe_list__item:nth-child(${length})`;
+ const offset = $(queryElement).offset().top - Header_Height;
+ window.scroll({ top: offset - 15, behavior: 'smooth' });
+ });
}
new LazyLoad('.lazyload');
diff --git a/assets/js/joe.smooth.js b/assets/js/joe.smooth.js
new file mode 100644
index 0000000..fbc6c41
--- /dev/null
+++ b/assets/js/joe.smooth.js
@@ -0,0 +1,15 @@
+(function(){function C(){if(!D&&document.body){D=!0;var a=document.body,b=document.documentElement,d=window.innerHeight,c=a.scrollHeight;l=0<=document.compatMode.indexOf("CSS")?b:a;m=a;f.keyboardSupport&&window.addEventListener("keydown",M,!1);if(top!=self)v=!0;else if(ca&&c>d&&(a.offsetHeight<=d||b.offsetHeight<=d)){var e=document.createElement("div");e.style.cssText="position:absolute; z-index:-10000; top:0; left:0; right:0; height:"+l.scrollHeight+"px";document.body.appendChild(e);var g;w=function(){g||
+ (g=setTimeout(function(){e.style.height="0";e.style.height=l.scrollHeight+"px";g=null},500))};setTimeout(w,10);window.addEventListener("resize",w,!1);z=new da(w);z.observe(a,{attributes:!0,childList:!0,characterData:!1});l.offsetHeight<=d&&(d=document.createElement("div"),d.style.clear="both",a.appendChild(d))}f.fixedBackground||(a.style.backgroundAttachment="scroll",b.style.backgroundAttachment="scroll")}}function N(a,b,d){ea(b,d);if(1!=f.accelerationMax){var c=Date.now()-E;cb?.99:-.99,lastY:0>d?.99:-.99,start:Date.now()});if(!F){c=O();var e=a===c||a===document.body;null==a.$scrollBehavior&&fa(a)&&(a.$scrollBehavior=a.style.scrollBehavior,a.style.scrollBehavior="auto");var g=function(c){c=Date.now();for(var k=0,l=0,h=0;h=f.animationTime,q=m?1:p/f.animationTime;f.pulseAlgorithm&&(p=q,1<=p?q=1:0>=p?q=0:(1==f.pulseNormalize&&(f.pulseNormalize/=
+ P(1)),q=P(p)));p=n.x*q-n.lastX>>0;q=n.y*q-n.lastY>>0;k+=p;l+=q;n.lastX+=p;n.lastY+=q;m&&(t.splice(h,1),h--)}e?window.scrollBy(k,l):(k&&(a.scrollLeft+=k),l&&(a.scrollTop+=l));b||d||(t=[]);t.length?Q(g,a,1E3/f.frameRate+1):(F=!1,null!=a.$scrollBehavior&&(a.style.scrollBehavior=a.$scrollBehavior,a.$scrollBehavior=null))};Q(g,a,0);F=!0}}function R(a){D||C();var b=a.target;if(a.defaultPrevented||a.ctrlKey||r(m,"embed")||r(b,"embed")&&/\.pdf/i.test(b.src)||r(m,"object")||b.shadowRoot)return!0;var d=-a.wheelDeltaX||
+ a.deltaX||0,c=-a.wheelDeltaY||a.deltaY||0;ha&&(a.wheelDeltaX&&x(a.wheelDeltaX,120)&&(d=a.wheelDeltaX/Math.abs(a.wheelDeltaX)*-120),a.wheelDeltaY&&x(a.wheelDeltaY,120)&&(c=a.wheelDeltaY/Math.abs(a.wheelDeltaY)*-120));d||c||(c=-a.wheelDelta||0);1===a.deltaMode&&(d*=40,c*=40);b=S(b);if(!b)return v&&G?(Object.defineProperty(a,"target",{value:window.frameElement}),parent.wheel(a)):!0;if(ia(c))return!0;1.2a)var b=a-(1-Math.exp(-a));
+ else b=Math.exp(-1),a=1-Math.exp(-(a-1)),b+=a*(1-b);return b*f.pulseNormalize}function y(a){for(var b in a)aa.hasOwnProperty(b)&&(f[b]=a[b])}var aa={frameRate:150,animationTime:400,stepSize:100,pulseAlgorithm:!0,pulseScale:4,pulseNormalize:1,accelerationDelta:50,accelerationMax:3,keyboardSupport:!0,arrowScroll:50,fixedBackground:!0,excluded:""},f=aa,v=!1,B={x:0,y:0},D=!1,l=document.documentElement,m,z,w,h=[],Z,ha=/^Mac/.test(navigator.platform),g={left:37,up:38,right:39,down:40,spacebar:32,pageup:33,
+ pagedown:34,end:35,home:36},ja={37:1,38:1,39:1,40:1},t=[],F=!1,E=Date.now(),J=function(){var a=0;return function(b){return b.uniqueID||(b.uniqueID=a++)}}(),W={},H={},V,A={};if(window.localStorage&&localStorage.SS_deltaBuffer)try{h=localStorage.SS_deltaBuffer.split(",")}catch(a){}var Q=function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||function(a,b,d){window.setTimeout(a,d||1E3/60)}}(),da=window.MutationObserver||window.WebKitMutationObserver||
+ window.MozMutationObserver,O=function(){var a=document.scrollingElement;return function(){if(!a){var b=document.createElement("div");b.style.cssText="height:10000px;width:1px;";document.body.appendChild(b);var d=document.body.scrollTop;window.scrollBy(0,3);a=document.body.scrollTop!=d?document.body:document.documentElement;window.scrollBy(0,-3);document.body.removeChild(b)}return a}}(),k=window.navigator.userAgent,u=/Edge/.test(k),G=/chrome/i.test(k)&&!u;u=/safari/i.test(k)&&!u;var ka=/mobile/i.test(k),
+ la=/Windows NT 6.1/i.test(k)&&/rv:11/i.test(k),ca=u&&(/Version\/8/i.test(k)||/Version\/9/i.test(k));k=(G||u||la)&&!ka;var ba=!1;try{window.addEventListener("test",null,Object.defineProperty({},"passive",{get:function(){ba=!0}}))}catch(a){}u=ba?{passive:!1}:!1;var L="onwheel"in document.createElement("div")?"wheel":"mousewheel";L&&k&&(window.addEventListener(L,R,u||!1),window.addEventListener("mousedown",U,!1),window.addEventListener("load",C,!1));y.destroy=function(){z&&z.disconnect();window.removeEventListener(L,
+ R,!1);window.removeEventListener("mousedown",U,!1);window.removeEventListener("keydown",M,!1);window.removeEventListener("resize",w,!1);window.removeEventListener("load",C,!1)};window.SmoothScrollOptions&&y(window.SmoothScrollOptions);"function"===typeof define&&define.amd?define(function(){return y}):"object"==typeof exports?module.exports=y:window.SmoothScroll=y})();
\ No newline at end of file
diff --git a/core/core.php b/core/core.php
index 60f4e5c..9e5f807 100644
--- a/core/core.php
+++ b/core/core.php
@@ -63,10 +63,14 @@ function _getAsideAuthorMotto()
function _getAbstract($item, $type = true)
{
$abstract = "";
- if ($item->fields->abstract) {
- $abstract = $item->fields->abstract;
+ if ($item->password) {
+ $abstract = "本篇文章为加密文章，请前往内页查看详情";
} else {
- $abstract = $item->excerpt;
+ if ($item->fields->abstract) {
+ $abstract = $item->fields->abstract;
+ } else {
+ $abstract = strip_tags($item->excerpt);
+ }
}
if ($type) {
echo $abstract;
diff --git a/index.php b/index.php
index 6e72616..67d62db 100644
--- a/index.php
+++ b/index.php
@@ -112,8 +112,33 @@
-
+
+ 查看更多
need('public/aside.php'); ?>
diff --git a/public/include.php b/public/include.php
index 05ae424..47d5e65 100644
--- a/public/include.php
+++ b/public/include.php
@@ -11,6 +11,7 @@
+