portal.css
14 KB
*{font-family:Arial,'Microsoft YaHei';-webkit-appearance:none;outline:0;-webkit-tap-highlight-color:transparent;-webkit-tap-highlight-color:transparent;margin:0;padding:0;color:#333;-moz-box-sizing:border-box;box-sizing:border-box}a{text-decoration:none;color:#0f8fea}.ellipsis{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.desc{color:#777;font-size:13px}.switch{font-family:"Helvetica Neue For Number",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;line-height:1.5;color:rgba(0,0,0,.65);margin:0;padding:0;list-style:none;position:relative;display:inline-block;height:22px;min-width:44px;line-height:20px;vertical-align:middle;border-radius:100px;border:1px solid transparent;background-color:rgba(0,0,0,.25);cursor:pointer;-webkit-transition:all .36s;transition:all .36s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.switch.switch-checked{background-color:#1890ff}.switch:focus{box-shadow:0 0 0 2px rgba(24,144,255,.2);outline:0}.switch:after,.switch:before{position:absolute;width:18px;height:18px;left:1px;top:1px;border-radius:18px;background-color:#fff;content:" ";cursor:pointer;-webkit-transition:all .36s cubic-bezier(.78,.14,.15,.86);transition:all .36s cubic-bezier(.78,.14,.15,.86)}.switch:after{box-shadow:0 2px 4px 0 rgba(0,35,11,.2)}.switch-inner{color:#fff;font-size:12px;margin-left:24px;margin-right:6px;display:block}.switch-checked .switch-inner{margin-left:6px;margin-right:24px}.switch-checked:after,.switch-checked:before{left:100%;margin-left:-19px}.portal-loading{height:50px;overflow:hidden;text-align:center;line-height:50px;-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.portal-loading:before{content:'';position:relative;background-color:transparent;width:13px;height:13px;border-radius:100%;margin:0 10px 0 0;-webkit-animation-fill-mode:both;animation-fill-mode:both;border:2px solid #c5c5c5;border-bottom-color:transparent;background:0 0;display:inline-block;-webkit-animation:rotate .75s 0s linear infinite;animation:rotate .75s 0s linear infinite;top:3px}.portal-loading span{color:#aaa;font-size:14px}@-webkit-keyframes rotate{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes rotate{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.page-content{background:#fff;overflow-y:auto;-webkit-overflow-scrolling:touch;overflow-x:hidden;width:100%;height:100%}.app-classify:before,.app-more:before{content:"";background:#efeff3;display:block;height:10px;width:100%}.app-classify>div{padding:15px 15px 5px 15px}.app-classify .title{display:block;font-size:15px;color:#999}.apps{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;width:100%}.app{width:25%;min-width:25%;max-width:25%;-webkit-box-flex:1;-webkit-flex:1;-moz-box-flex:1;-ms-flex:1;flex:1;padding-top:10px;text-align:center;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.app.app-drag.app-chosen{opacity:.6}.app.app-ghost.app-chosen{opacity:0}.app.app-chosen{opacity:.6;background:#eee}.app.app-chosen.sortable-fallback{height:auto!important}.app .img-container{position:relative}.app img{font-size:16px;display:block;margin:auto;width:3.5em;height:3.5em;border-radius:8px;box-shadow:0 2px 2px 0 rgba(0,0,0,.3)}.app .img-container:after{content:" ";position:absolute;display:block;left:0;top:0;right:0;bottom:0;z-index:1}.app p{font-size:12px;white-space:nowrap;margin:0;padding:0;line-height:2.6;color:#666;overflow:hidden;text-overflow:ellipsis}.app-more p a{position:relative;text-decoration:none;color:#999;font-size:15px;display:block;width:100%;padding:15px;line-height:24px}.app-more p a:active{background:#efefef;-webkit-transition:.2s all ease-in;transition:.2s all ease-in}.app-more p a:after{content:">";position:absolute;right:25px}.tabs{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;width:100%;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;-moz-box-orient:horizontal;-moz-box-direction:normal;-ms-flex-direction:row;flex-direction:row;border-bottom:1px solid #dfdfdf}.tabs .tab{position:relative;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-box-pack:start;-webkit-justify-content:flex-start;-moz-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:start;-webkit-align-items:flex-start;-moz-box-align:start;-ms-flex-align:start;align-items:flex-start;font-size:15px;height:42px;line-height:42px;margin-right:42px}.tabs .tab.active{color:#0f8fea;font-weight:600}.tabs .tab.active span{color:#325674}.tabs .tab .t-badge{position:relative;display:block;height:100%;padding:0 2px}.tabs .tab.active .t-badge:after{content:"";position:absolute;width:100%;height:3px;left:0;bottom:-1px;background-color:#325674}.badge-dot,.tabs .tab .t-badge .t-badge-dot{position:absolute;top:12px;right:-5px;height:7px;width:7px;border-radius:100%;background:#e4151f;z-index:10}.tab-panel{display:none}.tab-panel.active{display:block}.app-center h3{display:none;padding:25px 20px 0;font-size:22px}.app-center .tabs{padding:0 20px;overflow:hidden;background:#fff}.app-center .tabs .tab{margin-right:30px;line-height:46px}.app-center .content{position:absolute;width:100%;top:45px;bottom:0;overflow:hidden}.app-center .content>div{height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch;overflow-x:hidden}.app-center .app-list{padding:10px 20px 0}.app-center .app-list:last-child{padding:10px 20px}.app-list header{position:relative;font-size:14px;line-height:24px;color:#333}.app-list header label,.app-list header label span{color:#777}.app-list header a{position:absolute;right:0;color:#017afd}.app-list .app-item{position:relative;list-style:none;padding:5px 0;display:none}.app-list[data-expand=false] .app-item:nth-child(1),.app-list[data-expand=false] .app-item:nth-child(2),.app-list[data-expand=true] .app-item{display:block}.page-content [data-version=true] .badge-dot,.page-content [data-version=true] .t-badge-dot{display:inline}.page-content [data-version=false] .badge-dot,.page-content [data-version=false] .t-badge-dot{display:none}.app-item .switch{position:absolute;right:0;top:18px}.app-item>a{display:block}.app-item>a>div{position:relative;padding-left:68px}.app-item>a>div .download{position:absolute;top:12px;right:0;width:32px;height:32px;background:url(/mobilemode/mobile/images/portal/clouddownload-o.png) no-repeat;display:none}.app-item[data-inuse='0']>a>div .download{display:block}.app-item .detail{padding:5px 0;border-bottom:1px solid #efeff4}.app-item img{position:absolute;width:54px;height:54px;padding:2px 0;-moz-box-sizing:content-box;box-sizing:content-box}.app-item .name{position:relative;font-weight:400;font-size:17px;line-height:1;padding:5px 60px 2px 0;color:#000}.app-item .name>span{display:inline-block;max-width:100%}.app-item .name .badge-dot{right:inherit;top:5px;margin-left:3px}.app-item .desc{padding:4px 0 5px;padding-right:42px}.page-content.app-info>div{padding:0}.page-content.app-info>div>section{position:relative;padding:20px}.page-content.app-info>div>section:first-child{border-bottom:10px solid #efeff4}.page-content.app-info>div>section:last-child{position:static;padding:0 20px}.app-info .base-info img{position:absolute;width:84px;height:84px}.app-info .base-info>div{padding-left:105px;height:84px}.app-info .base-info h4{font-size:22px}.app-info .base-info .desc{line-height:2;padding-bottom:5px}.app-info .base-info .open-btn{background-color:#0f8fea;color:#fff;margin-top:7px;display:none}.app-info .base-info .download{margin-top:3px;width:32px;height:32px;background:url(/mobilemode/mobile/images/portal/clouddownload-o.png) no-repeat;display:none}.app-info .base-info[data-inuse='1'] .open-btn{display:block}.app-info .base-info[data-inuse='0'] .download{display:block}.app-info .statistics-info{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;-moz-box-orient:horizontal;-moz-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.app-info .statistics-info>div{-webkit-box-flex:2;-webkit-flex:2;-moz-box-flex:2;-ms-flex:2;flex:2;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-box-pack:center;-webkit-justify-content:center;-moz-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center}.app-info .statistics-info .rate{-webkit-box-flex:3;-webkit-flex:3;-moz-box-flex:3;-ms-flex:3;flex:3}.app-info .statistics-info>div .score,.app-info .statistics-info>div p{color:#666;font-size:22px;margin-left:0;padding-bottom:1px}.app-info .statistics-info .version{text-align:center}.app-info .statistics-info .comment p{margin-left:0}.stars{display:inline-block;padding-left:5px}.star{display:inline-block;margin-left:-4px;width:16px;height:16px;background:url(/mobilemode/mobile/images/portal/star-o.png) no-repeat}.star.half{background:url(/mobilemode/mobile/images/portal/star-half.png) no-repeat}.star.active{background:url(/mobilemode/mobile/images/portal/star.png) no-repeat}.page-content.app-info .thumbnail-info{overflow-y:hidden;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:0;white-space:nowrap;padding:0 20px}.app-info .thumbnail-info img{display:inline-block;height:240px;width:148px;margin:0 5px 0 0;padding:20px;vertical-align:top;background-color:#ddd}.app-info .tab{min-width:auto}.app-info .tab-panel .information{padding:7px 0}.app-info .tab-panel .information p{position:relative;color:#ababab;font-size:13px;line-height:36px;border-bottom:1px solid #eee}.app-info .tab-panel .information span{position:absolute;right:0;color:#000}.app-info .comments,.app-info .ver-logs{margin:15px 0}.app-info .comment-wrapper{padding:15px;width:100%;height:160px;font-size:15px;background:#f7f7fd;border-radius:5px;margin-bottom:15px}.app-info .comment-wrapper:last-child{margin-bottom:0}.app-info .comment-header{position:relative}.app-info .comment-header h4{line-height:1.5}.app-info .comment-wrapper .comment-rate{padding-left:1px}.app-info .comment-wrapper .comment-rate .star{display:inline-block;margin-left:-4px;width:16px;height:16px;background:url(/mobilemode/mobile/images/portal/star-o.png) no-repeat;background-size:contain}.app-info .comment-wrapper .comment-rate .star.active{background:url(/mobilemode/mobile/images/portal/star-active.png) no-repeat;background-size:contain}.app-info .comment-wrapper .comment-sub{position:absolute;top:0;right:0;color:#ababab}.app-info .comment-wrapper .comment-sub span{display:block}.app-info .comment-wrapper .comment-content{position:relative;padding:8px 0 0;color:#333;line-height:20px;height:88px;overflow:hidden;word-break:break-word}.app-info .comment-wrapper.all{height:auto}.app-info .comment-wrapper.all .comment-content{height:auto;overflow-y:auto}.app-info .comment-wrapper.more .comment-content .more-btn{display:block}.app-info .comment-wrapper .comment-content .more-btn{position:absolute;right:0;bottom:0;padding-right:2px;width:42px;line-height:20px;text-align:right;background-color:#f7f7fd;box-shadow:-18px 0 20px 0 #f7f7fd;display:none}.app-info .comment-wrapper .comment-content .more-content{display:none}.app-info .ver-log{font-size:15px;padding-bottom:5px}.app-info .ver-log header{position:relative}.app-info .ver-log .ver-title{display:inline-block;width:48px;padding:4px 0;color:#000;font-weight:600;background:#eee;text-align:center;line-height:1;font-size:15px;border-radius:27px}.app-info .ver-log .update-time{position:absolute;font-size:12px;color:#ababab;right:0;line-height:27px}.app-info .ver-log .log-content{padding:10px 0;padding-left:15px;color:#666;font-size:15px;list-style:decimal}.app-info .comments .no-comments,.app-info .ver-logs .no-logs{color:#aaa;font-size:13px}.app-info .more-comments,.detail-info .portal-loading{margin-top:-15px}.app-info .more-comments{display:none;padding:7px 5px;text-align:center;color:#1890ff}.page-footer .review{position:absolute;left:20px;bottom:20px;width:48px;height:48px;border-radius:48px;line-height:48px;background-color:#017afd;text-align:center;box-shadow:0 0 5px 2px rgba(0,0,0,.1);z-index:99;-webkit-overflow-scrolling:touch;display:none}.page-footer .review img{margin-top:10px;width:28px;height:28px}.comment-edit{position:relative}.comment-edit header{position:relative;height:38px;line-height:38px;background-color:#f3f3f3;border-bottom:1px solid #eee}.comment-edit header h4{position:absolute;top:0;font-size:16px;line-height:38px;left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%)}.comment-edit header button{position:absolute;line-height:38px;left:13px;font-size:15px;background-color:inherit;color:#1890ff;outline:0;border:none}.comment-edit header button.send{left:inherit;right:13px;color:#bababa}.comment-edit header button.send.active{color:#1890ff}.comment-edit .comment-form{font-size:13px;padding-left:1em}.comment-edit input{border:none;height:34px;width:100%;font-size:15px;line-height:34px;padding-right:1em;border-bottom:1px solid #eee}.comment-edit textarea{position:absolute;border:none;top:126px;bottom:0;width:100%;left:0;font-size:15px;line-height:20px;padding:4px 13px 0}.comment-edit .comment-rate{text-align:center;border-bottom:1px solid #eee}.comment-rate .stars{padding:2px 0 0 0}.comment-rate .stars,.comment-rate p{margin-left:-13px}.comment-form .comment-rate .star{margin-left:8px;width:24px;height:24px;background-image:url(/mobilemode/mobile/images/portal/star-o2.png);background-repeat:no-repeat}.comment-form .comment-rate .star:first-child{margin-left:0}.comment-form .comment-rate .star.active{background-image:url(/mobilemode/mobile/images/portal/star-active2.png)}.comment-rate p{font-size:12px;color:#aaa;padding:2px 0}