diff --git a/src/assets/img/ripple-loading.svg b/src/assets/img/ripple-loading.svg deleted file mode 100644 index 0905720..0000000 --- a/src/assets/img/ripple-loading.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - \ No newline at end of file diff --git a/src/assets/img/widget-img.jpeg b/src/assets/img/widget-img.jpeg deleted file mode 100644 index d85bd81..0000000 Binary files a/src/assets/img/widget-img.jpeg and /dev/null differ diff --git a/src/assets/img/widget-img1.jpg b/src/assets/img/widget-img1.jpg deleted file mode 100644 index a13c12f..0000000 Binary files a/src/assets/img/widget-img1.jpg and /dev/null differ diff --git a/src/components/EmptyFile/index.vue b/src/components/EmptyFile/index.vue index bd5a691..e35969f 100644 --- a/src/components/EmptyFile/index.vue +++ b/src/components/EmptyFile/index.vue @@ -18,7 +18,7 @@ props: { emptyImgUrl: { type: String, - default: '~@/assets/img/widget-img.jpeg' + default: '~@/assets/img/emptyfile_intro.jpeg' }, emptyStatus:{ type: String, @@ -38,7 +38,7 @@ }, methods: { sourceImg(){ - return '~@/assets/img/widget-img.jpeg' + return '~@/assets/img/emptyfile_intro.jpeg' } } } diff --git a/src/components/backtop/AlBackTop.vue b/src/components/backtop/AlBackTop.vue deleted file mode 100644 index 4b9da07..0000000 --- a/src/components/backtop/AlBackTop.vue +++ /dev/null @@ -1,146 +0,0 @@ - - - - diff --git a/src/components/markdown/config/editormd.js b/src/components/markdown/config/editormd.js deleted file mode 100644 index e1091f8..0000000 --- a/src/components/markdown/config/editormd.js +++ /dev/null @@ -1,45 +0,0 @@ -const defaultConfig = { - width: "100%", - height: 600, - path: '/static/editor.md/lib/', - // theme: 'dark', - // previewTheme: 'dark', - // editorTheme: 'pastel-on-dark', - markdown: '', // 默认填充内容 - lineWrapping: true, // 编辑框不换行 - codeFold: true, // 代码折叠 - placeholder: '请输入...', - syncScrolling: true, - saveHTMLToTextarea: true, // 保存 HTML 到 Textarea - searchReplace: true, - watch: true, // 实时预览 - htmlDecode: "style,script,iframe|on*", // 开启 HTML 标签解析，为了安全性，默认不开启 - toolbar: true, //工具栏 - previewCodeHighlight: true, // 预览 HTML 的代码块高亮，默认开启 - emoji: true, - taskList: true, - tocm: true, // Using [TOCM] - tex: true, // 开启科学公式TeX语言支持，默认关闭 - flowChart: true, // 开启流程图支持，默认关闭 - sequenceDiagram: true, // 开启时序/序列图支持，默认关闭, - // dialogLockScreen: false, // 设置弹出层对话框不锁屏，全局通用，默认为true - // dialogShowMask: false, // 设置弹出层对话框显示透明遮罩层，全局通用，默认为true - // dialogDraggable: false, // 设置弹出层对话框不可拖动，全局通用，默认为true - // dialogMaskOpacity: 0.4, // 设置透明遮罩层的透明度，全局通用，默认值为0.1 - // dialogMaskBgColor: "#000", // 设置透明遮罩层的背景颜色，全局通用，默认为#fff - // imageUpload: false, - // imageFormats: ["jpg", "jpeg", "gif", "png", "bmp", "webp"], - // imageUploadURL: "./php/upload.php", - // onload: function() { - // // this.fullscreen(); - // // this.unwatch(); - // // this.watch().fullscreen(); - // // this.setMarkdown("#PHP"); - // // this.width("100%"); - // // this.height(480); - // // this.resize("100%", 640); - // }, -}; -export { - defaultConfig, -}; diff --git a/src/components/markdown/editormd.vue b/src/components/markdown/editormd.vue deleted file mode 100644 index 042de2a..0000000 --- a/src/components/markdown/editormd.vue +++ /dev/null @@ -1,95 +0,0 @@ - - diff --git a/src/router/index.js b/src/router/index.js index 619eb0d..82507e8 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -47,221 +47,6 @@ export const constantRoutes = [ component: () => import('@/views/404'), hidden: true }, - - // { - // path: '/', - // component: Layout, - // redirect: '/home', - // children: [{ - // path: '', - // name: 'Home', - // component: () => import('@/views/home/index'), - // meta: { title: '所有文件', icon: 'ziyuan' } - // }] - // }, - // { - // path: '/recently', - // component: Layout, - // redirect: '/recently', - // children: [ - // { - // path: '', - // name: 'recently', - // component: () => import('@/views/recently/index'), - // meta: { title: '最近', icon: 'zuijinyuedu' } - // } - // ] - // }, - // - // { - // path: '/favorite', - // component: Layout, - // children: [ - // { - // path: 'index', - // name: 'Form', - // component: () => import('@/views/favorite/index'), - // meta: { title: '收藏', icon: 'Favoritestarrate' } - // } - // ] - // }, - // - // { - // path: '/share', - // component: Layout, - // children: [ - // { - // path: '', - // name: 'share', - // component: () => import('@/views/share/index'), - // meta: { title: '分享', icon: 'gongxiangzhongxin' } - // } - // ] - // }, - // - // { - // path: '/audio', - // component: Layout, - // redirect: '/audio', - // children: [ - // { - // path: '', - // name: 'audio', - // component: () => import('@/views/fileType/audio'), - // meta: { title: '音乐', icon: 'audio' } - // } - // ] - // }, - // { - // path: '/video', - // component: Layout, - // redirect: '/video', - // children: [ - // { - // path: '', - // name: 'video', - // component: () => import('@/views/fileType/video'), - // meta: { title: '视频', icon: 'video' } - // } - // ] - // }, - // { - // path: '/image', - // component: Layout, - // redirect: '/image', - // children: [ - // { - // path: '', - // name: 'image', - // component: () => import('@/views/fileType/image'), - // meta: { title: '图片', icon: 'image' } - // } - // ] - // }, - // { - // path: '/document', - // component: Layout, - // redirect: '/document', - // children: [ - // { - // path: '', - // name: 'document', - // component: () => import('@/views/fileType/document'), - // meta: { title: '文档', icon: 'document' } - // } - // ] - // }, - // { - // path: '/markdown', - // component: Layout, - // hidden: true, - // children: [ - // { - // path: 'editor', - // name: 'markdown', - // component: () => import('@/views/markdown/index'), - // meta: { title: '创建文档', icon: 'md' } - // } - // ] - // }, - // { - // path: '/setting/user', - // component: Layout, - // children: [ - // { - // path: '', - // name: 'setting-user', - // component: () => import('@/views/setting/sys/cusomerInfo'), - // meta: { title: '个人信息' , icon: 'UserSettings'} - // } - // ] - // }, - // { - // path: '/setting/manager-users', - // component: Layout, - // children: [ - // { - // path: '', - // name: 'manager-users', - // component: () => import('@/views/setting/sys/cusomerManager'), - // meta: { title: '用户管理' , icon: 'huaban'} - // } - // ] - // }, - // { - // path: '/setting/manager-roles', - // component: Layout, - // children: [ - // { - // path: '', - // name: 'manager-roles', - // component: () => import('@/views/setting/sys/roleManager'), - // meta: { title: '角色管理' , icon: 'role'} - // } - // ] - // }, - // { - // path: '/setting/manager-menus', - // component: Layout, - // children: [ - // { - // path: '', - // name: 'manager-menus', - // component: () => import('@/views/setting/sys/menuManager'), - // meta: { title: '菜单管理' , icon: 'menu'} - // } - // ] - // }, - // { - // path: '/setting/website', - // component: Layout, - // name: 'website', - // meta: { title: '网站管理', icon: 'wangzhanguanli'}, - // children: [ - // { - // path: 'manager-articles', - // name: 'manager-articles', - // component: () => import('@/views/setting/articles/articlePageManager'), - // meta: { title: '文章' , icon: 'guanlizhuanjiawenzhang'} - // }, - // { - // path: 'manager-alone-page', - // name: 'manager-alone-page', - // component: () => import('@/views/setting/articles/alonePageManager'), - // meta: { title: '独立页面' , icon: 'yemianshezhi'} - // }, - // { - // path: 'manager-blog', - // name: 'manager-blog', - // component: () => import('@/views/setting/articles/blogManager'), - // meta: { title: '外观' , icon: 'pifu'} - // }, - // { - // path: 'manager-categories', - // name: 'manager-categories', - // component: () => import('@/views/setting/articles/categoryManager'), - // meta: { title: '分类', icon: 'fenlei' } - // }, - // { - // path: 'manager-tags', - // name: 'manager-tags', - // component: () => import('@/views/setting/articles/tagManager'), - // meta: { title: '标签', icon: 'biaoqian' } - // } - // ] - // }, - // { - // path: '/setting/manager-cloud', - // component: Layout, - // children: [ - // { - // path: '', - // name: 'manager-cloud', - // component: () => import('@/views/setting/cloudManager'), - // meta: { title: '网盘设置', icon: 'yunshezhi' } - // } - // ] - // }, { path: '/s', component: Layout, @@ -300,40 +85,11 @@ export const dynamicRouters = [ component: () => import('@/views/public/share/shareList'), } ] - }, - { - path: '/demo', - component: Layout, - children: [ - { - path: 'index_m', - name: 'demo_m', - component: () => import('@/views/demo/index_m'), - meta: { title: 'demo', icon: 'example' } - } - ] - }, - { - path: '/upload', - component: Layout, - children: [{ - path: 'index_m', - name: 'upload_m', - component: () => import('@/views/upload/mobile/index'), - meta: { title: '上传文件列表' } - }] - }, + } ] const createRouter = () => new VueRouter({ mode: 'history', // require service support - // scrollBehavior (to, from, savedPosition) { - // if (savedPosition) { - // return savedPosition - // } else { - // return { x: 0, y: 0 } - // } - // }, routes: constantRoutes }) diff --git a/src/styles/article.scss b/src/styles/article.scss deleted file mode 100644 index 90d36e9..0000000 --- a/src/styles/article.scss +++ /dev/null @@ -1,121 +0,0 @@ -/deep/ .el-backtop { - -webkit-backdrop-filter: saturate(180%) blur(20px); - backdrop-filter: saturate(180%) blur(1px); - background-color: rgba(255,255,255,0.5); - color: #272936; - z-index: 999; -} -.article-header { - height: 70vh; - min-height: 12.5px; - position: relative; - display: table; - text-align: center; - overflow: hidden; - color: #fff; - background-color: #2e2e2e; - width: -webkit-calc(100% - -0.0625rem); - width: calc(100% - -0.0625rem); - -webkit-transition: 1s ease background-color; - -moz-transition: 1s ease background-color; - -ms-transition: 1s ease background-color; - -o-transition: 1s ease background-color; - transition: 1s ease background-color; - .article-background { - display: block; - width: 100%; - height: 100%; - background-repeat: no-repeat; - background-size: cover; - background-position: center; - position: absolute; - left: 0; - top: 0; - overflow: hidden; - opacity: 1; - -webkit-transition: 1s ease opacity; - -moz-transition: 1s ease opacity; - -ms-transition: 1s ease opacity; - -o-transition: 1s ease opacity; - transition: 1s ease opacity; - } -} - -.inner { - display: table-cell; - position: relative; - z-index: 10; - width: 100%; - left: -1px; - vertical-align: middle; -} - -.blog-title { - font-size: 2.5rem; - line-height: 1.5; - margin-bottom: .75rem; -} - -@media not all, screen and (-webkit-min-device-pixel-ratio: 1.5), not all, not all { - .blog-description.font-mono { - font-family: Consolas,Menlo,Monaco,"lucida console","Liberation Mono","Courier New","andale mono",monospaceX,monospace,sans-serif; - font-size: 1rem; - } -} - -.typed-cursor { - animation: typedjsBlink 0.7s infinite; - -webkit-animation: typedjsBlink 0.7s infinite; - animation: typedjsBlink 0.7s infinite; -} - -@keyframes typedjsBlink { - 50% { - opacity: 0.0; - } -} - -@media (min-width: 576px) { - -} - -@media screen and (max-width: 768px) { - .blog-title { - font-size: 1.75rem; - font-weight: 400; - margin-bottom: .5rem; - } - - //.blog-description { - // font-size: .8125rem; - //} - - .cover-wrapper .cover .cover-body { - padding-bottom: 68px; - .title { - font-size: 2rem; - font-weight: 400; - } - } - - .article-header .inner { - padding-bottom: 80px; - } -} - -@media (min-width: 768px){ - -} - -@media (min-width: 992px) { - .navbar>.container-fluid { - max-width: 960px; - } -} - -@media (min-width: 1210px) { - .navbar>.container-fluid { - max-width: 1170px; - } -} - diff --git a/src/styles/articles.scss b/src/styles/articles.scss deleted file mode 100644 index 0e60158..0000000 --- a/src/styles/articles.scss +++ /dev/null @@ -1,4427 +0,0 @@ -@supports ((-webkit-backdrop-filter: blur(20px)) or (backdrop-filter: blur(20px))) { - .blur { - background: rgba(255, 255, 255, .85) !important; - -webkit-backdrop-filter: saturate(200%) blur(20px); - backdrop-filter: saturate(200%) blur(20px) - } -} - -.shadow { - box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1) -} - -.shadow.floatable { - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.shadow.floatable:hover { - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 4px 8px 0 rgba(0, 0, 0, .1), 0 8px 16px 0 rgba(0, 0, 0, .1) -} - -@font-face { - font-family: 'Varela Round'; - src: url(https://cdn.jsdelivr.net/gh/xaoxuu/cdn-fonts/VarelaRound/VarelaRound-Regular.ttf); - font-weight: 400; - font-style: normal -} - -* { - box-sizing: border-box; - outline: 0; - margin: 0; - padding: 0 -} - -html { - color: #444; - width: 100%; - height: 100%; - font-family: 'Varela Round', "Microsoft YaHei", "Source Sans Pro", "Helvetica Neue", Menlo, Monaco, monospace, "Lucida Console", sans-serif, Helvetica, "Hiragino Sans GB", "Hiragino Sans GB W3", Source Han Sans CN Regular, WenQuanYi Micro Hei, Arial, sans-serif; - font-size: 16px; - line-height: 1.5; - -webkit-text-size-adjust: 100%; - -ms-text-size-adjust: 100%; - text-rendering: optimizelegibility; - -webkit-tap-highlight-color: transparent -} - -body { - background-color: #f4f4f4 -} - -body.modal-active { - overflow: hidden -} - -@media screen and (max-width:680px) { - body.modal-active { - position: fixed; - top: 0; - right: 0; - bottom: 0; - left: 0 - } -} - -::-moz-selection { - background: rgba(33, 150, 243, .2) -} - -::selection { - background: rgba(33, 150, 243, .2) -} - -h1 { - font-size: 1.625rem -} - -h2 { - font-size: 1.375rem -} - -h3 { - font-size: 1.25rem -} - -h4 { - font-size: 1.125rem -} - -h5 { - font-size: 1rem -} - -h6 { - font-size: 1rem -} - -h1, h2, h3, h4, h6 { - font-weight: 400 -} - -a { - color: #2196f3; - cursor: pointer; - text-decoration: none; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -a:hover { - color: #ff5722 -} - -a:active, a:hover { - outline: 0 -} - -pre { - tab-size: 4; - -moz-tab-size: 4; - -o-tab-size: 4; - -webkit-tab-size: 4 -} - -img { - max-width: 100% -} - -.clearfix { - zoom: 1 -} - -.clearfix:after, .clearfix:before { - content: " "; - display: table -} - -.clearfix:after { - clear: both -} - -.hidden { - text-indent: -9999px; - visibility: hidden; - display: none -} - -.inner { - position: relative; - width: 80%; - max-width: 710px; - margin: 0 auto -} - -.vertical { - display: table-cell; - vertical-align: middle -} - -ol, ul { - padding-left: 0 -} - -li { - list-style: none -} - -ul.h-list { - display: flex; - align-items: center; - height: 100% -} - -ul.h-list > li { - height: 100%; - justify-content: center -} - -article, aside, details, figcaption, figure, footer, header, hgroup, -main, menu, nav, section, summary { - display: block -} - -abbr[title] { - border-bottom: 1px dotted -} - -b, strong { - font-weight: 700 -} - -dfn { - font-style: italic -} - -h1 { - font-size: 2em; - margin: .67em 0 -} - -mark { - background: #ff0; - color: #000 -} - -small { - font-size: 80% -} - -sub, sup { - font-size: 65%; - line-height: 0; - position: relative; - vertical-align: baseline -} - -sup { - top: -.6em -} - -sub { - bottom: -.3em -} - -img { - border: 0; - background: 0 0; - max-width: 100% -} - -figure { - margin: 1em 40px -} - -hr { - box-sizing: content-box; - height: 0; - border: 0; - border-radius: 1px; - border-bottom: 1px solid rgba(68, 68, 68, .1) -} - -pre { - overflow: auto -} - -code, kbd, pre, samp { - font-family: monospace, monospace; - font-size: 1em -} - -button, input, optgroup, select, textarea { - color: inherit; - font: inherit; - margin: 0 -} - -button { - overflow: visible -} - -button, select { - text-transform: none -} - -button, html input[type=button], input[type=reset], input[type=submit] { - -webkit-appearance: button; - cursor: pointer -} - -button[disabled], html input[disabled] { - cursor: default -} - -button::-moz-focus-inner, input::-moz-focus-inner { - border: 0; - padding: 0 -} - -input { - line-height: normal -} - -input[type=checkbox], input[type=radio] { - box-sizing: border-box; - padding: 0 -} - -input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { - height: auto -} - -input[type=search] { - -webkit-appearance: textfield; - box-sizing: content-box -} - -input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration { - -webkit-appearance: none -} - -fieldset { - border: 1px solid silver; - margin: 0 2px; - padding: .35em .625em .75em -} - -legend { - border: 0; - padding: 0 -} - -textarea { - overflow: auto -} - -optgroup { - font-weight: 700 -} - -table { - border-collapse: collapse; - margin-top: .7em; - margin-bottom: .7em; - width: 100% -} - -table th { - background-color: #efefef -} - -table td, table th { - padding: 4px 12px; - border: 1px solid #eaeaea -} - -table tr { - background-color: #f9f9f9 -} - -table tbody > tr { - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -table tbody > tr:hover { - background-color: #efefef -} - -overflow table { - overflow: auto; - display: block -} - -overflow table tr { - word-break: keep-all -} - -td, th { - padding: 0 -} - -.highlight { - position: relative; - width: 100%; - margin: 1rem 0; - display: block; - background: #f6f6f6; - font-size: .8125rem; - font-family: Menlo, Monaco, courier, monospace, "Lucida Console", 'Source Code Pro', "Microsoft YaHei", Helvetica, Arial, sans-serif, Ubuntu; - border-radius: 4px; - border: 1px solid #e7e7e7; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.highlight figcaption { - position: -webkit-sticky; - position: sticky; - left: 0; - padding: 4px 8px 4px 8px; - background-color: #eaeaea -} - -.highlight table { - overflow: auto; - display: block; - margin: 0; - background-color: transparent; - border: none -} - -.highlight table td, .highlight table th { - padding: 0; - border: none -} - -.highlight table tr { - background-color: transparent -} - -.highlight table tr:hover { - background-color: transparent -} - -.highlight table .gutter { - -moz-user-select: none; - -ms-user-select: none; - -webkit-user-select: none; - user-select: none; - padding: 0 12px; - text-align: right; - border-width: 0; - margin-left: 0; - position: -webkit-sticky; - position: sticky; - left: 0; - background-color: #eaeaea -} - -.highlight table .gutter pre { - color: rgba(68, 68, 68, .65) -} - -.highlight table pre { - background: 0 0; - margin: 0; - padding: 0; - border: none -} - -.highlight table .code { - padding: 16px; - vertical-align: top; - background-color: transparent -} - -.highlight table .code:before { - content: ""; - position: absolute; - top: 0; - right: 0; - color: rgba(68, 68, 68, .65); - font-size: .75rem; - padding: 4px 8px -} - -.highlight.html .code:before { - content: "HTML" -} - -.highlight.js .code:before { - content: "JS" -} - -.highlight.bash .code:before { - content: "bash" -} - -.highlight.shell .code:before { - content: "shell" -} - -.highlight.css .code:before { - content: "css" -} - -.highlight.less .code:before { - content: "less" -} - -.highlight.stylus .code:before { - content: "stylus" -} - -.highlight.swift .code:before { - content: "Swift" -} - -.highlight.objc .code:before { - content: "ObjC" -} - -.highlight.c .code:before { - content: "C" -} - -.highlight.cpp .code:before { - content: "C++" -} - -.highlight.java .code:before { - content: "Java" -} - -.highlight.python .code:before { - content: "Python" -} - -.highlight.yaml .code:before { - content: "YAML" -} - -.highlight.plain .code:before { - content: "" -} - -pre .line { - color: rgba(68, 68, 68, .9) -} - -pre .marked { - background-color: rgba(254, 213, 66, .4); - padding: 2px 8px 2px 0; - border-radius: 2px; - width: 100% -} - -pre .title { - color: #3f51b5 -} - -pre .comment { - color: rgba(68, 158, 72, .7) -} - -pre .attr, pre .javascript .function, pre .keyword { - color: #9c27b0 -} - -pre .built_in, pre .tag .name, pre .type { - color: #4ba7ee -} - -pre .attribute, pre .css .class, pre .css .id, pre .css .pseudo, pre .html .doctype, -pre .regexp, pre .ruby .constant, pre .variable, pre .xml .doctype, pre .xml .pi, -pre .xml .tag .title { - color: #fd8607 -} - -pre .constant, pre .literal, pre .number, pre .params, pre .preprocessor { - color: #fd8607 -} - -pre .class, pre .css .rules .attribute, pre .ruby .class .title { - color: #ff9800 -} - -pre .string { - color: #449e48 -} - -pre .header, pre .inheritance, pre .ruby .symbol, pre .value, pre .xml .cdata { - color: #4caf50 -} - -pre .css .hexcolor { - color: #6cc -} - -pre .coffeescript .title, pre .function, pre .javascript .title, pre .perl .sub, -pre .python .decorator, pre .python .title, pre .ruby .function .title, -pre .ruby .title .keyword { - color: #69c -} - -.html .tag .name { - color: #ee2b29 -} - -.alert { - display: none; - position: fixed; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - z-index: 99999; - text-align: center; - padding: 30px 36px 29px 36px; - border-radius: 12px; - box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1); - font-weight: 700; - font-size: 1.125rem -} - -.alert.alert-success { - color: #247830; - background: #daf4de -} - -.alert.alert-info { - color: #028baf; - background-color: #e4f9ff -} - -.alert.alert-warning { - color: #c48700; - background-color: #fffdf7 -} - -.alert.alert-danger { - color: #ef0b01; - background-color: #fff -} - -.highlight { - position: relative -} - -.btn-copy { - display: inline-block; - cursor: pointer; - border: none; - -moz-user-select: none; - -ms-user-select: none; - -webkit-user-select: none; - user-select: none; - -webkit-appearance: none; - font-size: calc(.8125rem - 1px); - font-weight: 700; - padding: 4px 8px; - color: rgba(68, 68, 68, .65); - background: #fff; - border-bottom-left-radius: 4px; - border-top-right-radius: 4px; - box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1); - position: absolute; - top: 0; - right: 0; - opacity: 0; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.btn-copy > i { - margin-right: 4px -} - -.btn-copy:hover { - color: #ff5722; - background: #ffeee8 -} - -.highlight:hover .btn-copy { - opacity: 1 -} - -.article-entry div.info { - background-color: rgba(27, 205, 252, .2); - border-left: 4px solid #1bcdfc; - border-radius: 4px -} - -.article-entry div.success { - background-color: rgba(61, 197, 80, .2); - border-left: 4px solid #3dc550; - border-radius: 4px -} - -.article-entry div.warning { - background-color: rgba(255, 189, 43, .2); - border-left: 4px solid #ffbd2b; - border-radius: 4px -} - -.article-entry div.danger { - background-color: rgba(254, 95, 88, .2); - border-left: 4px solid #fe5f58; - border-radius: 4px -} - -fancybox { - display: flex; - justify-content: center; - align-items: center -} - -fancybox a { - margin: 0 1px; - padding: 0 -} - -@media screen and (max-width:500px) { - fancybox a { - margin: 0 .5px - } -} - -fancybox a > img { - margin: 0 -} - -.l_main #comments { - position: relative -} - -.l_main #comments #valine_container img { - display: inline -} - -.l_main #comments #valine_container .vwrap { - border-radius: 12px; - border-style: dashed; - border: 1px dashed rgba(68, 68, 68, .3); - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.l_main #comments #valine_container .vwrap:hover { - border: 1px dashed #2196f3 -} - -.l_main #comments #valine_container .vwrap .vheader .vinput { - border-radius: 0; - border-bottom: 1px dashed rgba(68, 68, 68, .3) -} - -.l_main #comments #valine_container .vwrap .vheader .vinput:hover { - border-bottom: 1px dashed #2196f3 -} - -.l_main #comments #valine_container .vwrap .vheader .vinput:focus { - border-bottom: 1px solid #2196f3 -} - -.l_main #comments #valine_container .vwrap .vedit .vctrl span { - color: #2196f3; - padding: 0; - margin: 10px -} - -.l_main #comments #valine_container button { - border: none; - padding: 8px 2rem 7px 2rem; - border-radius: 4px; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.l_main #comments #valine_container button:hover { - color: #ff5722; - background: #ffeee8 -} - -.l_main #comments #valine_container blockquote { - padding: 16px; - border-left: 2px solid #2196f3; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.l_main #comments #valine_container blockquote p { - text-align: left; - word-wrap: normal -} - -.l_main #comments #valine_container pre code { - border: none -} - -.l_main #comments #valine_container .vemoji-btn, .l_main #comments #valine_container .vpreview-btn, -.l_main #comments #valine_container a { - color: #2196f3; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.l_main #comments #valine_container .vemoji-btn:hover, .l_main #comments #valine_container .vpreview-btn:hover, -.l_main #comments #valine_container a:hover { - color: #ff5722; - text-decoration: underline -} - -.l_main #comments #valine_container div.info { - box-shadow: none -} - -.l_main #comments #valine_container div.info > div.power, .l_main #comments #valine_container div.info > div.power a { - font-size: .75rem -} - -.l_main #comments #valine_container .vhead span.vnick { - color: rgba(68, 68, 68, .65) -} - -.l_main #comments #valine_container .vhead a.vnick { - color: #ff9800; - font-weight: 700 -} - -.l_main #comments #valine_container .vhead a.vnick:hover { - color: #ff5722; - text-decoration: underline -} - -.l_main #comments #valine_container .vhead .vsys { - margin: 2px; - padding: 1px 8px; - background-color: rgba(68, 68, 68, .1) -} - -.l_main #comments #valine_container .vcard .vquote { - border-left: none -} - -.l_main #comments #valine_container .vcard .vh { - border-bottom: 1px dashed rgba(68, 68, 68, .1) -} - -.l_main #comments #valine_container .vmeta .vat { - font-weight: 700; - color: #2196f3; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.l_main #comments #valine_container .vmeta .vat:hover { - color: #ff5722; - text-decoration: underline -} - -.l_main #comments #valine_container .vmeta .vat:active { - color: #ff5621 -} - -.l_main #comments #valine_container .vinput { - color: #444 -} - -.l_main #comments #valine_container p { - color: #444 -} - -.l_main #comments .vemojis { - justify-content: space-between -} - -.l_main #comments .vemojis i { - width: auto; - height: 36px; - padding: 0; - margin: 8px 8px 0 8px -} - -.l_main #comments .vemojis i #emoji { - height: 24px; - margin-top: 6px; - background: 0 0 -} - -.l_main #comments p #emoji { - display: inline; - max-height: 28px; - background: 0 0 -} - -#archive-page { - margin-bottom: 32px -} - -#archive-page .archive .archive-year { - margin-top: 4em; - margin-bottom: 1em -} - -#archive-page .archive .archive-year:first-child { - margin-top: 0; - padding-top: 0 -} - -#archive-page .archive .archive-year h2 { - margin-top: 1em -} - -#archive-page .archive .archive-post a { - color: #444; - width: 100%; - display: inline-flex; - flex-flow: row nowrap; - justify-content: flex-start; - align-items: flex-start; - background: 0 0; - border-left: 2px solid transparent; - border-radius: 2px; - vertical-align: middle; - text-decoration: none; - font-size: .875rem; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -#archive-page .archive .archive-post a.child { - padding-left: 32px -} - -#archive-page .archive .archive-post a:hover { - background: #e8f4fd; - border-left: 2px solid #2196f3 -} - -#archive-page .archive .archive-post a:active { - border-left: 4px solid #2196f3 -} - -#archive-page .archive .archive-post time { - flex: none; - vertical-align: middle; - padding: .4em; - padding-left: 2em; - color: rgba(68, 68, 68, .65) -} - -@media screen and (max-width:500px) { - #archive-page .archive .archive-post time { - padding-left: 1em - } -} - -#archive-page .archive .archive-post .title { - flex: auto; - padding: .4em -} - -#archive-page .archive .archive-post .title i { - color: #ff5722 -} - -#archive-page .archive .archive-post .title i.red { - color: #fe5f58 -} - -#archive-page .archive .archive-post .title i.green { - color: #3dc550 -} - -#archive-page .archive .archive-post .title i.yellow { - color: #ffbd2b -} - -#archive-page .archive .archive-post .title i.blue { - color: #1bcdfc -} - -#archive-page .archive .archive-post .title i.theme { - color: #2196f3 -} - -#archive-page .archive .archive-post .title i.accent { - color: #ff5722 -} - -#archive-page .archive .archive-post .title i.orange { - color: #ff5722 -} - -#archive-page .archive .all-categories time { - color: #444 -} - -#archive-page .archive .all-categories .title { - color: rgba(68, 68, 68, .65) -} - -#archive-page .archive .all-tags { - display: flex; - flex-wrap: wrap; - align-items: flex-start; - justify-content: flex-start; - align-items: baseline; - word-spacing: 8px; - text-align: center -} - -#archive-page .archive .all-tags > a { - color: rgba(68, 68, 68, .65); - margin-right: 16px -} - -#archive-page .archive .all-tags > a.active, #archive-page .archive .all-tags > a:active, -#archive-page .archive .all-tags > a:hover { - color: #ff5722 !important -} - -.article { - color: #555; - word-wrap: break-word -} - -.article img { - position: relative; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -@media screen and (max-width:500px) { - .article img { - box-shadow: none - } -} - -.article div > img, .article p > img { - display: block; - margin: auto; - border-radius: 4px -} - -@media screen and (max-width:500px) { - .article div > img, .article p > img { - border-radius: 2px - } -} - -.article span img { - display: inline; - margin: auto -} - -.article center, .article center p { - text-align: center -} - -.article .aplayer { - margin: 0; - display: inline-block; - width: 400px; - max-width: 100%; - border-radius: 4px; - color: #666 -} - -.article div.small-img img, .article p.small-img img { - width: auto; - max-width: 100%; - margin: 0; - box-shadow: none -} - -.article s { - color: rgba(85, 85, 85, .75) -} - -.article u { - color: #ff5722 -} - -.article p { - margin-top: 1rem; - margin-bottom: 1rem; - text-align: justify; - max-width: 100%; - overflow: auto -} - -.article p.has-jax { - font-family: Menlo, Monaco, courier, monospace, "Lucida Console", 'Source Code Pro', "Microsoft YaHei", Helvetica, Arial, sans-serif, Ubuntu; - background: rgba(255, 255, 255, 0); - padding: 16px 8px; - border-radius: 4px -} - -.article p.has-jax .mjx-chtml.MJXc-display { - margin: 0 -} - -.article ol, .article ul { - font-size: .9375rem; - list-style: initial; - padding-left: 8px; - margin-left: 16px; - margin-top: 1rem; - margin-bottom: 1rem -} - -.article ol ol, .article ol ul, .article ul ol, .article ul ul { - margin-top: 0; - margin-bottom: 0 -} - -.article ol.task-list, .article ul.task-list { - padding-left: 0; - margin-left: 4px -} - -.article ol.task-list li, .article ul.task-list li { - list-style: none -} - -.article ol.task-list li input, .article ul.task-list li input { - margin-right: 4px -} - -.article ul > li { - list-style: initial -} - -.article ol > li { - list-style: decimal -} - -.article a { - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.article a:before { - display: none -} - -.article a:hover { - color: #ff5722; - text-decoration: underline -} - -.article a:active { - color: #d93400 -} - -.article h1, .article h2, .article h3, .article h4, .article h5, .article h6 { - position: relative -} - -.article h1:first-child, .article h2:first-child, .article h3:first-child, -.article h4:first-child, .article h5:first-child, .article h6:first-child { - margin-top: 0; - padding-top: 0 -} - -.article h1.title, .article h2.title, .article h3.title, .article h4.title, -.article h5.title, .article h6.title { - left: 0 -} - -.article h1.title:before, .article h2.title:before, .article h3.title:before, -.article h4.title:before, .article h5.title:before, .article h6.title:before { - content: none -} - -.article h1, .article h2 { - margin-top: 2.5em; - padding-bottom: .2em; - border-bottom: 1px solid rgba(68, 68, 68, .1) -} - -.article h1 { - text-align: left; - color: #444 -} - -.article h2 { - text-align: left; - color: #444 -} - -.article h3 { - margin-top: 1.5em; - text-align: left; - color: #2196f3 -} - -.article h4 { - padding-top: 1em; - text-align: left; - margin-bottom: 1rem; - color: #444 -} - -.article h5 { - font-weight: 700; - margin-bottom: 1rem; - color: #444 -} - -.article h6 { - margin-bottom: 1rem; - color: #444 -} - -.article .subtitle h6 { - color: rgba(68, 68, 68, .9) -} - -.article figure figcaption span { - display: inline-block; - margin-right: 5px -} - -.article blockquote { - background: #e8f4fd; - border-left: 4px solid #2196f3; - border-radius: 4px -} - -.article blockquote, .article div.danger, .article div.info, .article div.success, -.article div.warning { - box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1); - position: relative; - width: 100%; - padding: .7em 1.2em; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.article blockquote, .article blockquote ol, .article blockquote p, -.article blockquote ul, .article div.danger, .article div.danger ol, -.article div.danger p, .article div.danger ul, .article div.info, .article div.info ol, -.article div.info p, .article div.info ul, .article div.success, .article div.success ol, -.article div.success p, .article div.success ul, .article div.warning, -.article div.warning ol, .article div.warning p, .article div.warning ul { - text-align: left; - word-wrap: normal; - font-size: .9375rem; - margin-top: .5rem; - margin-bottom: .5rem -} - -.article blockquote footer, .article div.danger footer, .article div.info footer, -.article div.success footer, .article div.warning footer { - padding: 0; - text-align: justify; - color: inherit; - font-style: italic; - margin: .5rem 0 -} - -.article blockquote footer cite, .article div.danger footer cite, .article div.info footer cite, -.article div.success footer cite, .article div.warning footer cite { - color: rgba(68, 68, 68, .65); - margin-left: 1em -} - -.article blockquote footer cite::before, .article div.danger footer cite::before, -.article div.info footer cite::before, .article div.success footer cite::before, -.article div.warning footer cite::before { - content: '----'; - padding: 0 .3em -} - -.article blockquote.pullquote.right, .article div.danger.pullquote.right, -.article div.info.pullquote.right, .article div.success.pullquote.right, -.article div.warning.pullquote.right { - border-left: none; - border-right: 4px solid #2196f3 -} - -.article blockquote.pullquote.right p, .article div.danger.pullquote.right p, -.article div.info.pullquote.right p, .article div.success.pullquote.right p, -.article div.warning.pullquote.right p { - text-align: right -} - -.article pre { - display: block; - box-sizing: border-box; - margin-top: 1rem; - margin-bottom: 1rem; - overflow: auto; - background: #f6f6f6; - font-size: .8125rem; - font-family: Menlo, Monaco, courier, monospace, "Lucida Console", 'Source Code Pro', "Microsoft YaHei", Helvetica, Arial, sans-serif, Ubuntu; - border: 1px solid #ddd; - padding: 16px -} - -.article div > pre { - border-radius: 4px -} - -.article div > pre > code { - padding: 0; - margin: 0; - background: 0 0; - color: rgba(68, 68, 68, .9) -} - -.article code { - font-family: Menlo, Monaco, courier, monospace, "Lucida Console", 'Source Code Pro', "Microsoft YaHei", Helvetica, Arial, sans-serif, Ubuntu; - padding: 4px 2px 2px 2px; - margin: 0; - vertical-align: middle; - border-radius: 2px; - line-height: 1.45; - font-size: .8125rem; - color: #4f5a60; - background: #f7f8f8 -} - -@media screen and (max-width:500px) { - .article ol, .article ul { - font-size: .875rem - } - - .article figure { - font-size: 13px; - line-height: 1.6em - } -} - -.article .widget { - background: 0 0; - margin: 1rem 0; - box-shadow: none; - border-radius: 4px; - cursor: auto; - background: #f4f4f4; - padding: 8px 0; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.article .widget:hover { - box-shadow: none -} - -.article .widget:active { - box-shadow: none -} - -.article .widget header { - padding: 4px .6em; - padding-bottom: 0; - color: rgba(68, 68, 68, .85) -} - -.article .widget.copyright, .article .widget.qrcode { - background: 0 0; - padding: 0 -} - -.article .widget.copyright header, .article .widget.qrcode header { - display: none -} - -.article .widget.copyright .content, .article .widget.qrcode .content { - padding: 0 -} - -.article .widget .content { - padding: 0 .6em; - margin: 0 -} - -.article .widget .content ul.entry, .article .widget .content ul.popular-posts { - padding-left: 9px; - margin-left: 16px -} - -.article .widget .content ul.entry a, .article .widget .content ul.popular-posts a { - display: inline; - border-left: none; - padding: 0; - padding-left: 4px; - color: #2196f3; - font-weight: 400 -} - -.article .widget .content ul.entry a.active, .article .widget .content ul.entry a:active, -.article .widget .content ul.entry a:hover, .article .widget .content ul.popular-posts a.active, -.article .widget .content ul.popular-posts a:active, .article .widget .content ul.popular-posts a:hover { - border-left: none; - background: 0 0; - color: #ff5722 -} - -.article .widget.qrcode > .content { - display: flex; - flex-wrap: wrap; - align-items: center; - justify-content: center; - padding-left: 16px; - padding-right: 16px; - margin-bottom: 4px -} - -.article .widget.qrcode > .content > fancybox, .article .widget.qrcode > .content > img { - margin: 0 8px -} - -.article .widget.qrcode > .content img { - margin-bottom: 4px -} - -.article .widget-blur { - -webkit-backdrop-filter: none; - backdrop-filter: none -} - -article .readmore > a { - font-size: .875rem -} - -article .readmore > a:hover { - text-decoration: none -} - -.cover-wrapper .cover { - top: 0; - left: 0; - max-width: 100%; - height: 100vh; - display: flex; - flex-wrap: nowrap; - flex-direction: column; - align-items: center; - align-self: center; - align-content: center; - color: #f0f5ff; - padding: 16px -} - -.cover-wrapper .cover .white { - color: #fff; - text-shadow: 0 1px 2px rgba(0, 0, 0, .1) -} - -.cover-wrapper .cover .cover-body div.b { - margin-top: 8vh; - margin-bottom: 8vh -} - -.cover-wrapper .cover.half { - margin-bottom: -100px; - height: 70vh; -} - -.cover-wrapper .cover.half .cover-body div.b { - margin-top: 10% -} - -@media screen and (max-width:500px) { - .cover-wrapper .cover.half .cover-body div.a { - margin-top: 4vh - } -} - -.cover-wrapper .cover .scroll-down { - width: 100%; - height: 64px; - position: absolute; - bottom: 0; - text-align: center; - cursor: pointer -} - -.cover-wrapper .cover .scroll-down .scroll-down-effects { - color: #fff; - font-size: 24px; - line-height: 64px; - position: absolute; - text-shadow: 0 1px 2px rgba(0, 0, 0, .1); - -webkit-animation: scroll-down-effect 1.5s infinite; - animation: scroll-down-effect 1.5s infinite -} - -@-webkit-keyframes scroll-down-effect { - 0% { - top: 0; - opacity: 1 - } - - 50% { - top: -16px; - opacity: .4 - } - - 100% { - top: 0; - opacity: 1 - } -} - -@keyframes scroll-down-effect { - 0% { - top: 0; - opacity: 1 - } - - 50% { - top: -16px; - opacity: .4 - } - - 100% { - top: 0; - opacity: 1 - } -} - -.cover-wrapper .cover .cover-body { - margin: auto -} - -.cover-wrapper .cover .cover-body, .cover-wrapper .cover .cover-body div.a, -.cover-wrapper .cover .cover-body div.b { - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - max-width: 100% -} - -.cover-wrapper .cover .cover-body .title { - font-size: 3rem; - line-height: 1.2 -} - -.cover-wrapper .cover .cover-body .subtitle { - font-size: .875rem -} - -.cover-wrapper .cover .cover-body .logo { - max-height: 100px; - max-width: calc(100% - 4 * 16px) -} - -@media screen and (min-height:1024px) { - .cover-wrapper .cover .cover-body .title { - font-size: 3.6rem - } - - .cover-wrapper .cover .cover-body .subtitle { - font-size: 1.05rem - } - - .cover-wrapper .cover .cover-body .logo { - max-height: 150px - } -} - -.cover-wrapper .cover .cover-body .m_search { - position: relative; - max-width: calc(100% - 16px); - width: 320px; - vertical-align: middle -} - -.cover-wrapper .cover .cover-body .m_search .form { - position: relative; - display: block; - width: 100% -} - -.cover-wrapper .cover .cover-body .m_search .icon, .cover-wrapper .cover .cover-body .m_search .input { - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.cover-wrapper .cover .cover-body .m_search .icon { - position: absolute; - display: block; - line-height: 2.5rem; - width: 32px; - top: 0; - left: 1rem; - color: rgba(85, 85, 85, .75) -} - -.cover-wrapper .cover .cover-body .m_search .input { - display: block; - height: 2.5rem; - width: 100%; - box-shadow: none; - box-sizing: border-box; - font-size: .875rem; - -webkit-appearance: none; - padding-left: 36px; - border-radius: 1.4rem; - background: rgba(255, 255, 255, .6); - -webkit-backdrop-filter: blur(10px); - backdrop-filter: blur(10px); - border: none; - color: #444 -} - -@media screen and (max-width:500px) { - .cover-wrapper .cover .cover-body .m_search .input { - padding-left: 36px - } -} - -.cover-wrapper .cover .cover-body .m_search .input:hover { - background: rgba(255, 255, 255, .8) -} - -.cover-wrapper .cover .cover-body .m_search .input:focus { - background: #fff -} - -.cover-wrapper .cover .cover-body .menu { - margin-top: 16px -} - -.cover-wrapper .cover .cover-body .menu ul { - display: flex; - flex-wrap: wrap; - align-items: baseline; - justify-content: center -} - -.cover-wrapper .cover .cover-body .menu ul li { - display: flex; - flex-wrap: wrap; - align-items: center; - padding: 0; - height: auto -} - -.cover-wrapper .cover .cover-body .menu ul > li > a { - font-size: .875rem; - padding: 2px; - margin: 4px; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - color: #555; - border-bottom: 2px solid transparent -} - -.cover-wrapper .cover .cover-body .menu ul > li > a.active, .cover-wrapper .cover .cover-body .menu ul > li > a:active, -.cover-wrapper .cover .cover-body .menu ul > li > a:hover { - color: #2196f3; - border-bottom: 2px solid #2196f3 -} - -.cover-wrapper .cover .cover-body .menu ul > li > a.white { - color: rgba(255, 255, 255, .7); - text-shadow: 0 1px 2px rgba(0, 0, 0, .1) -} - -.cover-wrapper .cover .cover-body .menu ul > li > a.white.active, .cover-wrapper .cover .cover-body .menu ul > li > a.white:active, -.cover-wrapper .cover .cover-body .menu ul > li > a.white:hover { - color: #fff; - border-bottom: 2px solid #fff -} - -.cover-wrapper .cover .cover-body .switcher > li a:hover { - background: rgba(68, 68, 68, .15) -} - -footer { - position: relative; - bottom: 10px; - padding: 10px 10px 10px 10px; - width: 100%; - color: rgba(68, 68, 68, .65); - margin: 0 auto; - overflow: hidden; - text-align: center -} - -footer, footer p { - font-size: .8125rem -} - -footer.white, footer.white a { - text-shadow: 0 1px 2px rgba(0, 0, 0, .1) -} - -footer .codename { - text-decoration: underline -} - -footer .social-wrapper { - display: flex; - justify-content: center; - flex-wrap: wrap; - margin: 4px 8px; - font-size: 16px -} - -footer a { - color: rgba(68, 68, 68, .65); - padding: 0; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -footer a.social { - position: relative; - display: inline-block; - text-align: center; - display: flex; - justify-content: center; - align-items: center; - width: 32px; - height: 32px; - margin: 4px; - border-radius: 100px -} - -footer a.social:hover { - background: #e8f4fd; - color: #2196f3 -} - -footer .copyright { - margin-top: 16px; - font-size: .75rem -} - -@media screen and (max-width:768px) { - footer { - justify-content: center - } -} - -.article.typo.l_friends .friends-group .friend-content { - display: flex; - flex-wrap: wrap; - margin: -8px; - border-radius: 12px; - align-items: flex-start; - line-height: 1.3 -} - -.article.typo.l_friends .friends-group .friend-content .friend-card { - display: flex; - border-radius: 4px; - box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1); - padding: 8px 0; - margin: 8px; - margin-top: calc(2.25 * 16px + 32px); - color: rgba(68, 68, 68, .65); - background: #f4f4f4; - justify-content: flex-start; - align-content: flex-start; - flex-direction: column; - width: calc(100% / 4 - 16px) -} - -@media screen and (max-width:1024px) { - .article.typo.l_friends .friends-group .friend-content .friend-card { - width: calc(100% / 4 - 16px) - } -} - -@media screen and (max-width:768px) { - .article.typo.l_friends .friends-group .friend-content .friend-card { - width: calc(100% / 3 - 16px) - } -} - -@media screen and (max-width:500px) { - .article.typo.l_friends .friends-group .friend-content .friend-card { - width: calc(100% / 2 - 16px) - } -} - -.article.typo.l_friends .friends-group .friend-content .friend-card:hover { - text-decoration: none -} - -.article.typo.l_friends .friends-group .friend-content .friend-card:hover .friend-left .avatar { - transform: scale(1.2) rotate(12deg); - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 4px 8px 0 rgba(0, 0, 0, .1), 0 8px 16px 0 rgba(0, 0, 0, .1) -} - -.article.typo.l_friends .friends-group .friend-content .friend-card .friend-left { - display: flex; - align-self: center -} - -.article.typo.l_friends .friends-group .friend-content .friend-card .friend-left .avatar { - width: 64px; - height: 64px; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1); - margin: 16px 8px 4px 8px; - margin-top: calc(-1.25 * 16px - 32px); - border-radius: 100%; - border: 2px solid #fff; - background: #fff -} - -.article.typo.l_friends .friends-group .friend-content .friend-card .friend-right { - margin: 4px 8px; - display: flex; - flex-direction: column; - text-align: center -} - -.article.typo.l_friends .friends-group .friend-content .friend-card .friend-right p { - text-align: center -} - -.article.typo.l_friends .friends-group .friend-content .friend-card .friend-right .friend-tags-wrapper { - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - margin-left: -2px; - word-break: break-all -} - -.article.typo.l_friends .friends-group .friend-content .friend-card .friend-right p { - margin: 0 -} - -.article.typo.l_friends .friends-group .friend-content .friend-card .friend-right p.friend-name { - font-size: .8125rem; - padding-top: 4px; - font-weight: 700 -} - -.article.typo.l_friends .friends-group .friend-content .friend-card .friend-right p.tags { - font-size: .75rem; - display: inline; - background: 0 0; - word-wrap: break-word; - padding-right: 4px -} - -.l_body { - position: relative; - margin: 16px 16px 0 16px; - min-height: calc(100vh - 70vh); -} - -.l_body.nocover { - margin-top: 64px -} - -@media screen and (max-width:425px) { - //.l_body { - // margin: 80px 0 16px - //} - // - //.l_body.nocover { - // margin-top: 48px - //} -} - -.l_body .s-top { - transition: all .6s ease; - -moz-transition: all .6s ease; - -webkit-transition: all .6s ease; - -o-transition: all .6s ease; - z-index: 9; - position: fixed; - width: 48px; - height: 48px; - line-height: 48px; - border-radius: 100%; - bottom: 32px; - right: 32px; - transform: translateY(100px) scale(0); - transform-origin: bottom; - color: #444 -} - -@media screen and (max-width:768px) { - .l_body .s-top { - right: 16px - } -} - -.l_body .s-top.show { - transform: translateY(0) scale(1) -} - -.l_body .s-top.show.hl { - background: #2196f3; - color: #fff; - box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1) -} - -@media screen and (min-width:768px) { - .l_body .s-top:hover { - transform: scale(1.2); - border-radius: 25%; - background: #2196f3; - color: #fff; - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 4px 8px 0 rgba(0, 0, 0, .1), 0 8px 16px 0 rgba(0, 0, 0, .1) - } - - .l_body .s-top:hover.hl { - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 4px 8px 0 rgba(0, 0, 0, .1), 0 8px 16px 0 rgba(0, 0, 0, .1) - } -} - -.l_main { - width: calc(100% - 1 * 285px); - padding-right: 16px; - float: left -} - -@media screen and (max-width:1440px) { - .l_main { - width: calc(100% - 1 * 240px) - } -} - -@media screen and (max-width:768px) { - .l_main { - width: 100% - } -} - -.l_main.no_sidebar { - width: 100%; - padding-right: 0; - max-width: 795px; - margin: auto -} - -.l_main.no_sidebar ~ .l_side { - display: none -} - -.l_main .post-list { - position: relative; - margin: 16px auto; - -webkit-column-gap: 16px; - -moz-column-gap: 16px; - column-gap: 16px -} - -.l_main .post-list.multiple-columns { - -webkit-columns: 320px; - -moz-columns: 320px; - columns: 320px -} - -.l_main ul.popular-posts h3 { - padding: 0; - margin: 0; - font-size: 1rem -} - -.l_main .post-wrapper { - column-break-inside: avoid; - -webkit-column-break-inside: avoid; - -moz-column-break-inside: avoid; - break-inside: avoid-column -} - -.l_main .post-wrapper { - margin-bottom: 16px -} - -.l_main .post-wrapper .post .meta { - margin-bottom: 16px -} - -.l_main .post-wrapper .post .meta .title { - font-size: 1.375rem -} - -.l_main .post-wrapper .post .meta .title a { - font-size: 1.375rem -} - -@media screen and (max-width:500px) { - .l_main .post-wrapper .post .meta { - margin-bottom: 16px - } - - .l_main .post-wrapper .post .meta .title { - font-size: 1.25rem - } -} - -@media screen and (max-width:500px) and (max-width:500px) { - .l_main .post-wrapper .post { - padding: 24px 16px - } -} - -.l_main .widget.grid .content .grid.fixed a { - width: calc(100% / 8 - 0 * 16px) -} - -@media screen and (max-width:1024px) { - .l_main .widget.grid .content .grid.fixed a { - width: calc(100% / 7 - 0 * 16px) - } -} - -@media screen and (max-width:768px) { - .l_main .widget.grid .content .grid.fixed a { - width: calc(100% / 6 - 0 * 16px) - } -} - -@media screen and (max-width:500px) { - .l_main .widget.grid .content .grid.fixed a { - width: calc(100% / 5 - 0 * 16px) - } -} - -@media screen and (max-width:425px) { - .l_main .widget.grid .content .grid.fixed a { - width: calc(100% / 4 - 0 * 16px) - } -} - -@media screen and (max-width:375px) { - .l_main .widget.grid .content .grid.fixed a { - width: calc(100% / 3 - 0 * 16px) - } -} - -.l_main .post { - position: relative; - margin: 16px auto; - padding: 24px; - border-radius: 12px -} - -@media screen and (max-width:425px) { - //.l_main .post { - // border-radius: 0 - //} -} - -.l_main .post h1 { - font-weight: 400; - font-size: 1.625rem -} - -.l_main .post .meta { - color: rgba(68, 68, 68, .65) -} - -.l_main .post .meta#header-meta { - margin-top: 0; - margin-bottom: 16px -} - -.l_main .post .meta#footer-meta { - margin-top: 32px; - margin-bottom: 8px -} - -.l_main .post .meta .aplayer, .l_main .post .meta .thumbnail { - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - width: 65px; - height: 65px; - border-radius: 100%; - float: right; - margin: 4px; - box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1) -} - -.l_main .post .meta .aplayer:hover, .l_main .post .meta .thumbnail:hover { - border-radius: 25%; - transform: scale(1.1); - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 4px 8px 0 rgba(0, 0, 0, .1), 0 8px 16px 0 rgba(0, 0, 0, .1) -} - -@media screen and (max-width:500px) { - .l_main .post .meta .aplayer:hover, .l_main .post .meta .thumbnail:hover { - border-radius: 100%; - transform: scale(1); - box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1) - } -} - -.l_main .post .meta .thumbnail { - width: auto; - border-radius: 4px; - box-shadow: none; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.l_main .post .meta .thumbnail:hover { - border-radius: 4px; - transform: scale(1.1) rotate(4deg); - box-shadow: none -} - -.l_main .post .meta .title { - transition: all .1s ease; - -moz-transition: all .1s ease; - -webkit-transition: all .1s ease; - -o-transition: all .1s ease; - margin: 0 -} - -.l_main .post .meta .title a { - display: inline; - font-weight: 400; - color: #444; - text-decoration: none -} - -.l_main .post .meta .title a:hover { - color: #ff5722 -} - -.l_main .post .meta .new-meta-box { - transition: all .1s ease; - -moz-transition: all .1s ease; - -webkit-transition: all .1s ease; - -o-transition: all .1s ease; - padding-top: 4px; - padding-bottom: 8px; - display: flex; - align-items: center; - flex-wrap: wrap -} - -.l_main .post .meta .new-meta-box, .l_main .post .meta .new-meta-box i, -.l_main .post .meta .new-meta-box p { - font-size: .875rem -} - -.l_main .post .meta .new-meta-box .new-meta-item { - color: rgba(68, 68, 68, .65); - line-height: 1.2; - display: flex; - align-items: center; - justify-content: center; - padding: 2px; - margin: 0 8px 0 0; - border-radius: 4px -} - -.l_main .post .meta .new-meta-box .new-meta-item.link-btns { - display: flex; - flex-wrap: wrap; - justify-content: flex-start -} - -.l_main .post .meta .new-meta-box .new-meta-item.link-btns .btn { - color: #fff; - padding: 1px 4px; - border-radius: 2px; - margin: 2px -} - -.l_main .post .meta .new-meta-box .new-meta-item.link-btns .btn, .l_main .post .meta .new-meta-box .new-meta-item.link-btns .btn i, -.l_main .post .meta .new-meta-box .new-meta-item.link-btns .btn p { - line-height: 1.5 -} - -.l_main .post .meta .new-meta-box .new-meta-item.link-btns .btn:hover { - box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .1), 0 8px 16px 0 rgba(0, 0, 0, .1) -} - -.l_main .post .meta .new-meta-box .new-meta-item.link-btns .btn i { - padding-left: 3px; - padding-top: 2px -} - -.l_main .post .meta .new-meta-box .new-meta-item.link-btns .btn p { - color: #fff -} - -.l_main .post .meta .new-meta-box .new-meta-item.link-btns .btn:hover { - color: #fff -} - -.l_main .post .meta .new-meta-box .new-meta-item.link-btns .btn:hover p { - color: #fff -} - -.l_main .post .meta .new-meta-box .new-meta-item .notlink { - cursor: default -} - -.l_main .post .meta .new-meta-box .new-meta-item .notlink:hover { - color: rgba(68, 68, 68, .65) -} - -.l_main .post .meta .new-meta-box .new-meta-item .notlink:hover p { - color: rgba(68, 68, 68, .65) -} - -.l_main .post .meta .new-meta-box .new-meta-item:last-child { - margin-right: 0 -} - -.l_main .post .meta .new-meta-box .new-meta-item i, .l_main .post .meta .new-meta-box .new-meta-item img { - display: inline -} - -.l_main .post .meta .new-meta-box .new-meta-item i { - margin-right: 4px; - border-radius: 0 -} - -.l_main .post .meta .new-meta-box .new-meta-item i.fas { - margin-right: 2px -} - -.l_main .post .meta .new-meta-box .new-meta-item a, .l_main .post .meta .new-meta-box .new-meta-item p { - color: rgba(68, 68, 68, .65); - padding-left: 0; - padding-right: 4px -} - -.l_main .post .meta .new-meta-box .new-meta-item a { - display: flex; - justify-content: center; - align-items: center -} - -.l_main .post .meta .new-meta-box .new-meta-item a img { - height: 1.2em; - width: 1.2em; - margin-right: 5px; - transform: translateY(-1px) -} - -.l_main .post .meta .new-meta-box .new-meta-item a p { - margin: 0; - padding-top: 2px; - font-weight: 400; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.l_main .post .meta .new-meta-box .new-meta-item a:hover { - color: #ff5722; - text-decoration: none -} - -.l_main .post .meta .new-meta-box .new-meta-item a:hover p { - color: #ff5722 -} - -.l_main .post .meta .new-meta-box .author i, .l_main .post .meta .new-meta-box .author img { - border-radius: 100% -} - -.l_main .post .meta .new-meta-box .share-body { - display: flex -} - -.l_main .post .meta .new-meta-box .share-body a { - padding: 0; - margin-right: 4px -} - -.l_main .post .meta .new-meta-box .share-body a img { - height: 1.8em; - width: auto; - background: 0 0 -} - -.l_main .post span > img { - display: inline-block -} - -.l_main .post a img { - display: inline -} - -@media screen and (max-width:768px) { - .l_main { - padding-right: 0 - } - - .l_main .post .meta { - margin-bottom: 16px - } - - .l_main .post .meta .title { - font-size: 1.25rem - } -} - -@media screen and (max-width:768px) and (max-width:500px) { - .l_main { - width: 100% - } -} - -@media screen and (max-width:768px) and (max-width:500px) { - .l_main .post { - padding: 24px 16px - } -} - -details { - display: block; - background: #f4f4f4; - padding: 16px; - margin: 1rem 0; - border-radius: 4px; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -details summary { - cursor: pointer; - padding: 16px; - margin: -16px; - color: rgba(85, 85, 85, .7); - font-size: .875rem; - font-weight: 700 -} - -details summary:hover { - color: rgba(85, 85, 85, .9) -} - -details[blue] { - background: #e8f4fd -} - -details[cyan] { - background: #e8fafe -} - -details[green] { - background: #ebf9ed -} - -details[yellow] { - background: #fff8e9 -} - -details[red] { - background: #feefee -} - -.body-wrapper { - position: relative; - display: flex; - width: 100%; - max-width: 1080px; - margin: 0 auto; - flex-wrap: wrap; - justify-content: space-between; - align-items: stretch -} - -.container--flex { - display: flex; - flex-wrap: nowrap; - justify-content: space-between; - align-items: center -} - -div.hoverbox { - display: flex; - flex-direction: column; - justify-content: center; - align-items: center -} - -div.hoverbox > div.target { - display: none; - position: absolute; - background: #fff; - border-radius: 12px; - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 4px 8px 0 rgba(0, 0, 0, .1), 0 8px 16px 0 rgba(0, 0, 0, .1); - padding: 8px; - margin-left: -4px; - margin-top: -108px -} - -div.hoverbox > div.target > img { - margin: 0; - padding: 0; - height: 128px; - width: 128px -} - -div.hoverbox:hover > div.target { - display: flex -} - -.comments .article p[ct] { - margin-top: 0; - margin-bottom: .5rem; - font-size: 1.125rem; - color: #444 -} - -.comments .article p[cst] { - margin-top: .5rem; - margin-bottom: .5rem; - font-size: .875rem -} - -.white-box { - background: #fff -} - -#loading-bar-wrapper { - position: fixed; - top: 0; - left: 0; - height: 2px; - width: 100%; - z-index: 99999 -} - -#loading-bar { - position: fixed; - width: 0; - height: 2px; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - background-color: #2196f3 -} - -.l_header { - position: fixed; - z-index: 9999; - top: 0; - width: 100%; - line-height: 64px; - padding: 0 16px; - margin-bottom: 16px; - box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1); - background: #fff -} - -.l_header .wrapper { - padding: auto 16px; - max-width: 1080px; - margin: auto; - height: 64px; - -moz-user-select: none; - -ms-user-select: none; - -webkit-user-select: none; - user-select: none; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.l_header .wrapper .nav-main { - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - transform: translateY(-64px) -} - -.l_header .wrapper .nav-sub { - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - opacity: 0 -} - -.l_header .wrapper a:not([href]) { - cursor: default -} - -.l_header .wrapper a.logo { - color: #444 -} - -.l_header.no_sidebar .wrapper { - max-width: 795px -} - -@media screen and (max-width:500px) { - .l_header .wrapper.sub .logo { - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - padding-left: 16px; - padding-right: 0 - } -} - -.l_header .wrapper.sub .nav-main { - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - transform: translateY(-128px) -} - -.l_header .wrapper.sub .nav-sub { - opacity: 1 -} - -.l_header .nav-main, .l_header .nav-sub { - height: 64px -} - -.l_header.hide { - transform: translateY(100px) scale(0) -} - -.l_header.show { - transform: translateY(0) scale(1) -} - -.l_header, .l_header a { - height: 64px; - line-height: 64px -} - -.l_header .logo { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - padding: 0 24px; - font-size: 1.25rem; - font-family: 'Varela Round', "Microsoft YaHei", "Source Sans Pro", "Helvetica Neue", Menlo, Monaco, monospace, "Lucida Console", sans-serif, Helvetica, "Hiragino Sans GB", "Hiragino Sans GB W3", Source Han Sans CN Regular, WenQuanYi Micro Hei, Arial, sans-serif; - letter-spacing: 0 -} - -@media screen and (max-width:500px) { - .l_header .logo { - padding: 0 16px - } -} - -.l_header .logo.img { - padding: 0 16px 0 0 -} - -.l_header .logo img { - height: 100% -} - -.l_header img.logo { - padding: 4px 0 -} - -.l_header .nav-sub .logo { - padding: 0 24px; - font-size: 1rem; - font-family: 'Varela Round', "Microsoft YaHei", "Source Sans Pro", "Helvetica Neue", Menlo, Monaco, monospace, "Lucida Console", sans-serif, Helvetica, "Hiragino Sans GB", "Hiragino Sans GB W3", Source Han Sans CN Regular, WenQuanYi Micro Hei, Arial, sans-serif; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis -} - -@media screen and (max-width:500px) { - .l_header .nav-sub .logo { - padding: 0 16px; - letter-spacing: -.5px; - padding-top: 1px - } -} - -.l_header .menu { - position: relative; - flex: 1 0 auto; - height: 64px; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - margin: 0 16px 0 0 -} - -.l_header .menu li ul.submenu { - z-index: 1; - display: none; - position: absolute; - background: #fff; - box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .1); - margin-top: -8px; - margin-left: 0; - border-radius: 6px; - border: 1px solid #e7e7e7; - padding: 8px 0 -} - -.l_header .menu li ul.submenu > hr { - margin-top: 8px; - margin-bottom: 8px -} - -.l_header .menu li ul.submenu > li { - white-space: nowrap; - word-break: keep-all -} - -.l_header .menu li ul.submenu > li.header { - font-size: .75rem; - font-weight: 700; - line-height: 2em; - color: rgba(68, 68, 68, .65); - margin: 8px 16px 4px -} - -.l_header .menu li ul.submenu > li ul { - margin-left: 0; - display: none; - margin-top: -40px; - left: calc(100% - .5 * 16px) -} - -.l_header .menu li ul.submenu > li > a { - font-size: .875rem; - font-weight: 700; - line-height: 33px; - padding: 0 16px; - height: 32px; - border-left: 2px solid transparent -} - -.l_header .menu li ul.submenu > li > a.active, .l_header .menu li ul.submenu > li > a:active, -.l_header .menu li ul.submenu > li > a:hover { - color: #2196f3; - border-left: 2px solid #2196f3; - border-bottom: none -} - -.l_header .menu li ul.submenu > li > a > i { - margin-right: 4px -} - -.l_header .menu li:hover > ul.submenu { - display: block -} - -.l_header .menu ul > li > a { - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - display: block; - padding: 0 8px; - color: rgba(68, 68, 68, .85) -} - -.l_header .menu ul > li > a.current { - border-bottom: 2px solid rgba(33, 150, 243, .8) -} - -.l_header .menu ul > li > a:hover { - color: #2196f3; - border-bottom: 2px solid #2196f3; - background: #e8f4fd -} - -.l_header .menu ul > li > a.active, .l_header .menu ul > li > a:active { - color: #2196f3; - border-bottom: 2px solid #2196f3 -} - -@media screen and (max-width:500px) { - .l_header .menu { - display: none - } -} - -.l_header .switcher { - display: none; - line-height: 64px -} - -.l_header .switcher .s-toc { - display: none -} - -@media screen and (max-width:768px) { - .l_header .switcher .s-toc { - display: flex - } -} - -.l_header .switcher > li { - height: 48px; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - margin: 2px -} - -@media screen and (max-width:500px) { - .l_header .switcher > li { - margin: 0 1px; - height: 48px - } -} - -.l_header .switcher > li a { - display: flex; - justify-content: center; - align-items: center; - width: 48px; - height: 48px; - padding: .85em 1.1em; - border-radius: 100px; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - color: #2196f3 -} - -.l_header .switcher > li a.active, .l_header .switcher > li a:active { - background: #e8f4fd -} - -@media screen and (max-width:500px) { - .l_header .switcher > li a { - width: 32px; - height: 48px - } -} - -@media screen and (max-width:500px) { - .l_header .switcher { - display: flex; - padding-left: 8px; - padding-right: 10px - } -} - -.l_header .nav-sub .switcher { - display: flex -} - -.l_header .m_search { - position: relative; - display: flex; - width: 285px; - height: 64px -} - -@media screen and (max-width:1440px) { - .l_header .m_search { - width: 240px - } -} - -.l_header .m_search .form { - position: relative; - display: flex; - width: 100%; - margin: auto; - justify-content: flex-start; - align-items: center -} - -.l_header .m_search .icon, .l_header .m_search .input { - transition: all .3s ease; - -moz-transition: all .3s ease; - -webkit-transition: all .3s ease; - -o-transition: all .3s ease -} - -.l_header .m_search .icon { - position: absolute; - width: 32px; - left: 5px; - color: rgba(68, 68, 68, .7) -} - -@media screen and (max-width:500px) { - .l_header .m_search .icon { - display: none - } -} - -.l_header .m_search .input { - display: block; - padding-top: 8px; - padding-bottom: 8px; - width: 100%; - color: #444; - background: rgba(242, 242, 242, .75); - box-shadow: none; - box-sizing: border-box; - padding-left: 36px; - font-size: .875rem; - border-radius: 8px; - border: 1px dashed transparent -} - -@media screen and (max-width:500px) { - .l_header .m_search .input { - padding-left: 8px; - border: none - } - - .l_header .m_search .input:focus, .l_header .m_search .input:hover { - border: none - } -} - -.l_header .m_search .input:hover ~ .icon { - color: rgba(33, 150, 243, .8) -} - -.l_header .m_search .input:focus ~ .icon { - color: #2196f3 -} - -@media (max-width:500px) { - .l_header { - padding: 0 - } - - .l_header .m_search { - width: 0; - overflow: hidden; - position: absolute; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - margin-left: 16px - } - - .l_header.z_search-open .logo { - opacity: 0 - } - - .l_header.z_search-open .m_search { - width: calc(100% - 112px) - } -} - -ul.menu-phone { - display: none; - position: fixed; - padding: 8px 0; - top: 80px; - right: 16px; - z-index: 10000; - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 4px 8px 0 rgba(0, 0, 0, .1), 0 8px 16px 0 rgba(0, 0, 0, .1); - border-radius: 6px; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - transform: scale(0, 0) rotate(12deg); - transform-origin: right top -} - -@media screen and (max-width:500px) { - ul.menu-phone { - display: block - } -} - -ul.menu-phone.show { - transform: scale(1, 1) -} - -ul.menu-phone > li > a { - display: block; - font-size: 1rem; - color: #444; - line-height: 33px; - height: 32px; - padding: 0 16px; - border-left: 2px solid transparent -} - -ul.menu-phone > li > a i { - margin-right: 4px -} - -ul.menu-phone > li > a.active { - border-left: 2px solid #2196f3; - color: #2196f3 -} - -.cover-wrapper .l_header { - transition: all .5s ease; - -moz-transition: all .5s ease; - -webkit-transition: all .5s ease; - -o-transition: all .5s ease; - transform: translateY(-128px) -} - -.cover-wrapper .l_header.show { - transform: translateY(0) -} - -.l_main .prev-next { - width: 100%; - display: flex; - justify-content: space-between; - align-items: baseline; - color: rgba(68, 68, 68, .65); - margin: 0; - font-size: 1rem -} - -.l_main .prev-next .prev { - text-align: left; - border-top-right-radius: 32px; - border-bottom-right-radius: 32px -} - -.l_main .prev-next .next { - text-align: right; - border-top-left-radius: 32px; - border-bottom-left-radius: 32px -} - -.l_main .prev-next p { - margin: 16px -} - -.l_main .prev-next section { - color: rgba(68, 68, 68, .65); - padding: 16px; - border-radius: 12px -} - -.l_main .prev-next section:hover { - color: #ff5722 -} - -@media screen and (max-width:425px) { - .l_main .prev-next section { - border-radius: 0 - } -} - -.l_main .article .prev-next { - width: 100%; - display: flex; - justify-content: space-between; - align-content: flex-start -} - -.l_main .article .prev-next > a { - width: 100%; - padding: 8px; - color: rgba(68, 68, 68, .65); - background: #f4f4f4; - border-radius: 4px -} - -.l_main .article .prev-next > a:hover { - text-decoration: none; - background: #ffeee8 -} - -.l_main .article .prev-next > a:hover p.title { - color: #ff5722 -} - -.l_main .article .prev-next > a p.title { - margin: 8px .5rem; - font-weight: 700; - font-size: 1rem -} - -.l_main .article .prev-next > a p.title > i { - width: 1rem -} - -.l_main .article .prev-next > a p.content { - font-size: .875rem; - margin: 0 .5rem; - text-align: justify; - word-break: break-all -} - -.l_main .article .prev-next > a:only-child { - margin-left: 0; - margin-right: 0 -} - -.l_main .article .prev-next .prev { - margin-left: 0; - margin-right: 8px -} - -.l_main .article .prev-next .prev p.title { - text-align: left -} - -.l_main .article .prev-next .next { - margin-left: 8px; - margin-right: 0 -} - -.l_main .article .prev-next .next p.title { - text-align: right -} - -#u-search { - display: none; - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - padding: 60px 20px; - z-index: 999999 -} - -@media screen and (max-width:680px) { - #u-search { - padding: 0 - } -} - -#u-search .modal { - position: fixed; - height: 80%; - width: 100%; - max-width: 640px; - left: 50%; - top: 0; - margin: 64px 0 0 -320px; - background: #fff; - z-index: 3; - border-radius: 4px; - overflow: hidden -} - -@media screen and (max-width:680px) { - #u-search .modal { - box-shadow: none; - max-width: none; - top: 0; - left: 0; - margin: 0; - height: 100%; - border-radius: 0 - } -} - -#u-search .modal-ajax-content { - opacity: 0; - visibility: hidden; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -#u-search .modal-ajax-content.loaded { - opacity: 1; - visibility: visible -} - -#u-search .modal-header { - position: relative; - width: 100%; - height: 64px; - z-index: 3; - border-top-left-radius: 4px; - border-top-right-radius: 4px; - font-size: 16px; - box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1); - background: #f2f2f2; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -@media screen and (max-width:680px) { - #u-search .modal-header { - border-radius: 0; - padding: 0 - } -} - -#u-search .modal-header .btn-close { - display: block; - position: absolute; - width: 55px; - height: 64px; - top: 0; - right: 0; - color: #2196f3; - cursor: pointer; - text-align: center; - line-height: 64px; - vertical-align: middle; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - z-index: 2 -} - -#u-search .modal-header .btn-close:hover { - transform: rotate(90deg) -} - -#u-search .modal-header .modal-loading { - position: absolute; - bottom: 0; - left: 0; - width: 100%; - height: 2px; - background: 0 0; - z-index: 1 -} - -#u-search .modal-header .modal-loading .modal-loading-bar { - display: block; - position: relative; - width: 0%; - height: 100%; - background: #2196f3; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -#u-search .modal-header #u-search-modal-form { - position: relative; - width: 100%; - height: 100%; - z-index: 2 -} - -#u-search .modal-header #u-search-modal-form #u-search-modal-input { - margin: 16px 50px; - padding: 0 8px; - width: calc(100% - 100px - 16px); - line-height: 2rem; - border-radius: 4px; - vertical-align: middle; - border: none; - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - box-shadow: none; - background: 0 0; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -@media screen and (max-width:680px) { - #u-search .modal-header #u-search-modal-form #u-search-modal-input { - padding: 0 - } -} - -#u-search .modal-header #u-search-modal-form #u-search-modal-input:focus { - border-top-left-radius: 4px; - border-top-right-radius: 4px -} - -#u-search .modal-header #u-search-modal-btn-submit { - position: absolute; - top: 0; - left: 0; - padding-left: 5px; - padding-top: 2px; - background: 0 0; - border: none; - width: 50px; - height: 64px; - vertical-align: middle; - color: #2196f3; - z-index: 2 -} - -#u-search .modal-footer { - position: absolute; - display: none; - bottom: 0; - left: 0; - width: 100%; - height: 50px; - padding: 0 15px; - background: #fff -} - -#u-search .modal-footer .logo { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - text-align: center; - z-index: 0 -} - -#u-search .modal-footer .logo a { - display: inline-block; - height: 50px -} - -#u-search .modal-footer .logo.google img { - height: 24px; - margin-top: 13px -} - -#u-search .modal-footer .logo.baidu img { - height: 22px; - margin-top: 14px -} - -#u-search .modal-footer .logo img { - position: relative; - display: inline-block; - width: auto; - height: 18px; - margin-top: 16px -} - -#u-search .modal-footer .modal-error { - position: relative; - float: left; - vertical-align: middle; - line-height: 50px; - font-size: 13px; - z-index: 1 -} - -#u-search .modal-footer .modal-metadata { - position: relative; - float: left; - vertical-align: middle; - line-height: 50px; - font-size: 13px; - z-index: 1 -} - -#u-search .modal-footer .nav { - position: relative; - display: block; - float: right; - vertical-align: middle; - font-size: .875rem; - font-weight: 700; - line-height: 50px; - color: rgba(68, 68, 68, .65); - cursor: pointer; - z-index: 1 -} - -#u-search .modal-footer .nav:hover { - color: #ff5722 -} - -#u-search .modal-footer .nav.btn-next { - margin-left: 16px -} - -#u-search .modal-footer .nav .icon { - font-size: .875rem -} - -#u-search .modal-body { - position: absolute; - padding: 16px; - width: 100%; - height: calc(100% - 64px); - top: 64px; - left: 0; - overflow-y: scroll; - -webkit-overflow-scrolling: touch; - background: #fff; - border-radius: 4px -} - -#u-search .modal-body .modal-results { - list-style: none -} - -#u-search .modal-body .modal-results .result { - position: relative; - display: block; - padding: 16px; - text-decoration: none; - border-radius: 4px -} - -#u-search .modal-body .modal-results .result b[mark] { - color: #0c7cd5; - text-decoration: underline -} - -#u-search .modal-body .modal-results .result:hover { - background: #e8f4fd -} - -#u-search .modal-body .modal-results .result .title { - display: inline-block; - max-width: 100%; - color: #5e5e5e; - font-weight: 700; - padding: 1px; - margin-bottom: 2px; - white-space: normal; - overflow: hidden; - text-overflow: ellipsis; - font-size: 1.125rem -} - -#u-search .modal-body .modal-results .result .digest { - display: block; - white-space: inherit; - overflow: hidden; - word-break: break-all; - text-overflow: ellipsis; - font-size: .8125rem; - color: rgba(68, 68, 68, .65) -} - -#u-search .modal-body .modal-results .result .icon { - position: absolute; - top: 50%; - right: 0; - margin-top: -4px; - font-size: 11px; - color: grey -} - -#u-search .modal-overlay { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: rgba(0, 0, 0, .7); - z-index: 1 -} - -.l_side { - width: 285px; - float: right; - position: relative; - display: flex; - flex-direction: column -} - -@media screen and (max-width:1440px) { - .l_side { - width: 240px - } -} - -@media screen and (max-width:768px) { - .l_side { - width: 100% - } -} - -.widget { - z-index: 0; - background: #fff; - margin-top: 16px; - border-radius: 12px; - width: 100%; - display: none -} - -.widget.desktop { - display: block -} - -@media screen and (max-width:768px) { - .widget { - display: none !important - } - - .widget.mobile { - display: block !important - } -} - -@media screen and (max-width:425px) { - .widget { - width: calc(100% - 2 * 16px); - margin: 16px 16px 0 16px; - display: none !important - } - - .widget.mobile { - display: block !important - } -} - -.widget header { - border-top-left-radius: 12px; - border-top-right-radius: 12px; - font-weight: 700; - line-height: 1.5em; - padding: calc(16px - 2px); - padding-bottom: 0 -} - -.widget header, .widget header a { - color: #2196f3 -} - -.widget header > a:hover { - color: #ff5722 -} - -.widget header span.name { - margin-left: 8px -} - -.widget .content { - text-align: justify; - font-size: .875rem; - padding: 8px 0; - max-height: calc(100% - 264px); - max-width: 100% -} - -.widget .content p { - margin: .5rem 0 -} - -.widget .content ul > li a { - color: rgba(68, 68, 68, .65); - padding: 0 16px; - padding-left: 12px; - line-height: 2; - display: flex; - justify-content: space-between; - align-content: center; - border-left: 2px solid transparent; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.widget .content ul.entry a .name, .widget .content ul.popular-posts a .name { - flex: auto; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - color: rgba(68, 68, 68, .8) -} - -.widget .content ul.entry a .badge, .widget .content ul.popular-posts a .badge { - flex: none; - font-weight: 400; - font-size: .875rem; - color: rgba(68, 68, 68, .7) -} - -.widget .content ul.entry a:hover, .widget .content ul.popular-posts a:hover { - border-left: 2px solid #2196f3; - background: rgba(33, 150, 243, .1) -} - -.widget .content ul.entry a.active, .widget .content ul.popular-posts a.active { - border-left: 2px solid #2196f3 -} - -.widget .content ul.entry a.active .name, .widget .content ul.popular-posts a.active .name { - color: #2196f3 -} - -.widget .content ul.entry a.active .badge, .widget .content ul.popular-posts a.active .badge { - color: rgba(33, 150, 243, .9) -} - -.widget .content ul.entry a:active, .widget .content ul.popular-posts a:active { - border-left: 4px solid #2196f3 -} - -.widget .content ul.entry a.child, .widget .content ul.popular-posts a.child { - padding-left: 32px -} - -.widget.blogger { - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.widget.blogger .content { - padding: 0 -} - -.widget.blogger .content div.avatar { - display: flex; - justify-content: center -} - -.widget.blogger .content img { - padding: 0; - margin: 0; - display: flex; - justify-content: center; - width: 285px; - height: 285px; - border-top-left-radius: 12px; - border-top-right-radius: 12px -} - -@media screen and (max-width:1440px) { - .widget.blogger .content img { - width: 240px; - height: 240px - } -} - -@media screen and (max-width:768px) { - .widget.blogger .content img { - width: 96px; - height: 96px; - border-radius: 100%; - margin-top: 8px; - padding: 8px - } -} - -.widget.blogger .content h2 { - text-align: center; - font-weight: 700; - margin: 8px; - margin-top: 16px -} - -@media screen and (max-width:768px) { - .widget.blogger .content h2 { - margin: 8px - } -} - -.widget.blogger .content p { - font-weight: 700; - text-align: center; - margin: 8px 8px 0 8px; - empty-cells: hide -} - -.widget.blogger .content .social-wrapper { - display: flex; - justify-content: space-between; - flex-wrap: wrap; - margin: 4px 4px -} - -.widget.blogger .content .social-wrapper a { - color: rgba(68, 68, 68, .65); - padding: 0; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.widget.blogger .content .social-wrapper a:hover { - color: #ff5722 -} - -.widget.blogger .content .social-wrapper a.social { - font-size: 1rem; - display: flex; - justify-content: center; - align-items: center; - width: 32px; - height: 32px; - margin: 4px; - border-radius: 100px -} - -.widget.blogger .content .social-wrapper a.social:hover { - background: #e8f4fd; - color: #2196f3 -} - -@media screen and (max-width:768px) { - .widget.blogger .content .social-wrapper { - justify-content: center; - display: none - } -} - -@media screen and (max-width:768px) { - .widget.blogger { - box-shadow: none; - background: 0 0 !important; - margin-top: 32px; - -webkit-backdrop-filter: none; - backdrop-filter: none - } -} - -.widget.text .content { - padding: 4px 16px -} - -.widget.text .content, .widget.text .content p { - font-size: .875rem; - word-break: break-all -} - -.widget.text .content a { - color: #2196f3; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.widget.text .content a:hover { - color: #ff5722; - text-decoration: underline -} - -.widget.text .content a:active { - color: #d93400 -} - -.widget.list .content { - padding: 8px 0 -} - -.widget.list .content a { - font-size: .875rem; - font-weight: 700; - line-height: 2.4em -} - -.widget.list .content a:hover { - text-decoration: none -} - -.widget.list .content a i { - margin-left: 1px -} - -.widget.list .content a img { - display: inline; - vertical-align: middle; - height: 2em; - width: 2em -} - -.widget.list .content a img#round { - border-radius: 100% -} - -.widget.grid .content .grid { - border: none; - display: flex; - flex-wrap: wrap; - justify-content: space-around; - padding: 0 16px -} - -.widget.grid .content .grid a { - text-align: center; - border-radius: 12px; - margin: 4px 0; - padding: 4px 8px; - display: flex; - flex-direction: column; - align-items: center; - font-size: .75rem; - font-weight: 700; - color: rgba(68, 68, 68, .7); - line-height: 1.5; - word-wrap: break-word; - border: 1px solid transparent -} - -.widget.grid .content .grid a i { - margin-top: .3em; - margin-bottom: .3em; - font-size: 1.8em -} - -.widget.grid .content .grid a img { - display: inline; - vertical-align: middle; - margin-bottom: 4px -} - -.widget.grid .content .grid a img#round { - border-radius: 100% -} - -.widget.grid .content .grid a:hover { - color: #2196f3; - background: #e8f4fd; - border-radius: 4px -} - -.widget.grid .content .grid a:active { - color: #2196f3 -} - -.widget.grid .content .grid a.active { - color: #2196f3; - border: 1px solid #2196f3 -} - -.widget.grid .content .grid.fixed a { - width: calc(100% / 3 - 0 * 16px) -} - -@media screen and (max-width:768px) { - .widget.grid .content .grid.fixed a { - width: calc(100% / 6 - 0 * 16px) - } -} - -@media screen and (max-width:500px) { - .widget.grid .content .grid.fixed a { - width: calc(100% / 5 - 0 * 16px) - } -} - -@media screen and (max-width:425px) { - .widget.grid .content .grid.fixed a { - width: calc(100% / 4 - 0 * 16px) - } -} - -@media screen and (max-width:375px) { - .widget.grid .content .grid.fixed a { - width: calc(100% / 3 - 0 * 16px) - } -} - -.widget.tagcloud .content { - text-align: justify; - padding: 8px 16px -} - -.widget.tagcloud .content a { - display: inline-block; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - line-height: 1.6em -} - -.widget.tagcloud .content a:hover { - color: #ff5722 !important; - text-decoration: underline -} - -.widget.related_posts .content { - font-weight: 700 -} - -.widget.related_posts .content ul { - margin-top: 8px; - margin-bottom: 8px -} - -.widget.related_posts .content h3 { - font-size: .875rem; - font-weight: 700; - margin: 0 -} - -.widget.related_posts .content h3 a { - line-height: inherit; - padding-top: 4px; - padding-bottom: 4px -} - -.widget.qrcode .content { - display: flex; - flex-wrap: wrap; - align-items: center; - justify-content: space-around; - padding-left: 16px; - padding-right: 16px -} - -.widget.qrcode .content, .widget.qrcode .content img { - margin-bottom: 4px -} - -.l_side > .widget.page .content { - padding-top: 0; - padding-left: 12px; - padding-right: 12px -} - -.aplayer-container { - display: flex; - justify-content: center; - min-height: 100px -} - -.aplayer-container meting-js { - max-width: 100% -} - -.aplayer { - max-width: 500px; - border-radius: 4px; - color: #444; - font-family: 'Varela Round', "Microsoft YaHei", "Source Sans Pro", "Helvetica Neue", Menlo, Monaco, monospace, "Lucida Console", sans-serif, Helvetica, "Hiragino Sans GB", "Hiragino Sans GB W3", Source Han Sans CN Regular, WenQuanYi Micro Hei, Arial, sans-serif -} - -.aplayer .aplayer-list { - text-align: left -} - -@media screen and (max-width:500px) { - .aplayer { - border-radius: 12px - } -} - -div.tabs .highlight, div.tabs ol, div.tabs p, div.tabs ul { - margin-top: .5rem; - margin-bottom: .5rem -} - -div.tabs { - display: block; - position: relative; - margin-top: 1rem; - margin-bottom: 1rem; - border-bottom: 0; - border-radius: 4px; - box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1) -} - -div.tabs ul.nav-tabs { - display: flex; - overflow-x: auto; - white-space: nowrap; - justify-content: flex-start; - margin: 0; - padding: 0; - padding-top: 2px; - background: #efefef; - border-radius: 4px 4px 0 0; - padding: 0 4px -} - -div.tabs ul.nav-tabs li.tab { - list-style-type: none; - border-radius: 4px 4px 0 0 -} - -div.tabs ul.nav-tabs li.tab a { - display: block; - padding: 8px; - margin: 0 2px; - text-align: center; - font-size: .875rem; - font-weight: 700; - color: rgba(68, 68, 68, .65); - border-top: 2px solid transparent; - border-bottom: 2px solid transparent -} - -div.tabs ul.nav-tabs li.tab a:hover { - text-decoration: none; - color: #555; - border-bottom: 2px solid rgba(68, 68, 68, .65) -} - -div.tabs ul.nav-tabs li.tab.active a { - cursor: default; - color: #555; - border-bottom: 2px solid rgba(68, 68, 68, .65) -} - -div.tabs .tab-content { - overflow: hidden -} - -div.tabs .tab-content .tab-pane { - background: #f9f9f9; - border-top: 0; - border-radius: 4px; - padding: .5rem 16px -} - -div.tabs .tab-content .tab-pane:not(.active) { - display: none -} - -div.tabs .tab-content .tab-pane.active { - display: block -} - -div.tabs .tab-content .tab-pane.active:nth-of-type(1) { - border-radius: 0 4px 4px 4px -} - -p[small] { - font-size: .875rem -} - -p[large] { - font-size: 3rem; - line-height: 1.3 -} - -p[huge] { - font-size: 4rem; - line-height: 1.3 -} - -p[ultra] { - font-size: 6rem; - line-height: 1.3 -} - -p[huge], p[large], p[small], p[ultra] { - margin: 0; - padding: 0 -} - -p[bold] { - font-weight: 700 -} - -p[left] { - text-align: left -} - -p[center] { - text-align: center -} - -p[right] { - text-align: right -} - -p[red], red { - color: #fe5f58 -} - -p[yellow], yellow { - color: #ffbd2b -} - -green, p[green] { - color: #3dc550 -} - -cyan, p[cyan] { - color: #1bcdfc -} - -blue, p[blue] { - color: #2196f3 -} - -gray, p[gray] { - color: #666 -} - -.article li > btn a, .article p > btn a { - line-height: 1.5em; - background: #2196f3; - color: #fff; - padding: 2px 3px 0 3px; - margin: 2px; - border-radius: 2px; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.article li > btn a:hover, .article p > btn a:hover { - color: #fff; - text-decoration: none; - background: #ff5722 -} - -.article li > btn[regular] a, .article p > btn[regular] a { - line-height: 3; - padding: 9px 16px 7px 16px -} - -.article li > btn[regular] a i, .article p > btn[regular] a i { - margin-right: 2px -} - -.article li > btn[large] a, .article p > btn[large] a { - line-height: 3; - padding: 11px 40px 9px 40px -} - -.article li > btn[large] a i, .article p > btn[large] a i { - margin: 0 5px 0 -2px -} - -.article li > btn[center], .article p > btn[center] { - display: block; - text-align: center -} - -.article btns { - font-weight: 700; - display: flex; - flex-wrap: wrap; - margin: 0 -8px; - align-items: flex-start -} - -.article btns, .article btns a, .article btns b, .article btns p { - font-size: .875rem; - color: #555 -} - -.article btns[wide] a { - padding-left: 32px; - padding-right: 32px -} - -.article btns[fill] a { - flex-grow: 1; - width: auto -} - -.article btns[around] { - justify-content: space-around -} - -.article btns[center] { - justify-content: center -} - -.article btns[grid2] a { - width: calc(100% / 2 - 16px) -} - -@media screen and (max-width:1024px) { - .article btns[grid2] a { - width: calc(100% / 2 - 16px) - } -} - -@media screen and (max-width:768px) { - .article btns[grid2] a { - width: calc(100% / 2 - 16px) - } -} - -@media screen and (max-width:500px) { - .article btns[grid2] a { - width: calc(100% / 1 - 16px) - } -} - -.article btns[grid3] a { - width: calc(100% / 3 - 16px) -} - -@media screen and (max-width:1024px) { - .article btns[grid3] a { - width: calc(100% / 3 - 16px) - } -} - -@media screen and (max-width:768px) { - .article btns[grid3] a { - width: calc(100% / 3 - 16px) - } -} - -@media screen and (max-width:500px) { - .article btns[grid3] a { - width: calc(100% / 1 - 16px) - } -} - -.article btns[grid4] a { - width: calc(100% / 4 - 16px) -} - -@media screen and (max-width:1024px) { - .article btns[grid4] a { - width: calc(100% / 3 - 16px) - } -} - -@media screen and (max-width:768px) { - .article btns[grid4] a { - width: calc(100% / 3 - 16px) - } -} - -@media screen and (max-width:500px) { - .article btns[grid4] a { - width: calc(100% / 2 - 16px) - } -} - -.article btns[grid5] a { - width: calc(100% / 5 - 16px) -} - -@media screen and (max-width:1024px) { - .article btns[grid5] a { - width: calc(100% / 4 - 16px) - } -} - -@media screen and (max-width:768px) { - .article btns[grid5] a { - width: calc(100% / 3 - 16px) - } -} - -@media screen and (max-width:500px) { - .article btns[grid5] a { - width: calc(100% / 2 - 16px) - } -} - -.article btns a { - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - margin: 8px; - margin-top: calc(2.25 * 16px + 32px); - min-width: 120px; - font-weight: 700; - display: flex; - justify-content: flex-start; - align-content: center; - align-items: center; - flex-direction: column; - padding: 8px; - text-align: center; - background: #f4f4f4; - border-radius: 4px -} - -.article btns a > i:first-child, .article btns a > img:first-child { - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease; - height: 64px; - width: 64px; - box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1); - margin: 16px 8px 4px 8px; - margin-top: calc(-1.25 * 16px - 32px); - border: 2px solid #fff; - background: #fff; - line-height: 60px; - font-size: 28px -} - -.article btns a > i:first-child[auto], .article btns a > img:first-child[auto] { - width: auto -} - -.article btns a > i:first-child { - color: #fff; - background: #2196f3 -} - -.article btns a b, .article btns a p { - margin: .25em; - font-weight: 400; - line-height: 1.25; - word-wrap: break-word -} - -.article btns a b { - font-weight: 700; - line-height: 1.3 -} - -.article btns a img { - margin: .4em auto -} - -.article btns a:hover { - text-decoration: none -} - -.article btns a:not([href]) { - cursor: default; - color: inherit -} - -.article btns a[href]:hover { - background: rgba(255, 87, 34, .15) -} - -.article btns a[href]:hover, .article btns a[href]:hover b { - color: #ff5722 -} - -.article btns a[href]:hover > i:first-child, .article btns a[href]:hover > img:first-child { - transform: scale(1.1) translateY(-8px); - box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .1) -} - -.article btns a[href]:hover > i:first-child { - background: #ff5722 -} - -.article btns[circle] > a > i:first-child, .article btns[circle] > a > img:first-child { - border-radius: 32px -} - -.article btns[rounded] > a > i:first-child, .article btns[rounded] > a > img:first-child { - border-radius: 16px -} - -.l_side .toc-wrapper { - z-index: 1; - overflow: hidden; - border-radius: 12px; - position: -webkit-sticky; - position: sticky; - top: 80px; - transition: all .28s ease; - transition: all .28s ease; - -moz-transition: all .28s ease; - -webkit-transition: all .28s ease; - -o-transition: all .28s ease -} - -.l_side .toc-wrapper header { - position: -webkit-sticky; - position: sticky; - width: 100%; - top: 0; - padding-bottom: 4px -} - -.l_side .toc-wrapper .content { - max-height: calc(100vh - 144px); - overflow: auto -} - -.l_side .toc-wrapper .content a { - border-left: 2px solid transparent -} - -.l_side .toc-wrapper .content a:hover { - background: #e8f4fd; - border-left: 2px solid #2196f3 -} - -.l_side .toc-wrapper .content a:active { - border-left: 4px solid #2196f3 -} - -.l_side .toc-wrapper .content a.active { - color: #2196f3; - border-left: 2px solid #2196f3 -} - -@media screen and (max-width:768px) { - .l_side .toc-wrapper { - position: fixed; - max-height: 1000px; - width: auto; - max-width: calc(100% - 2 * 16px); - top: 64px; - right: 16px; - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 4px 8px 0 rgba(0, 0, 0, .1), 0 8px 16px 0 rgba(0, 0, 0, .1); - visibility: hidden; - transform: scale(0, 0) rotate(12deg); - transform-origin: right top - } - - .l_side .toc-wrapper.active { - visibility: visible; - transform: scale(1, 1) - } -} - -@media screen and (max-width:425px) { - .l_side .toc-wrapper { - right: 0 - } -} - -.l_side .toc-wrapper a { - padding-left: 8px; - color: rgba(68, 68, 68, .65); - font-size: .875rem; - display: inline-block -} - -.l_side .toc-wrapper ol .toc-item.toc-level-1 .toc-child a, .l_side .toc-wrapper ul .toc-item.toc-level-1 .toc-child a { - padding-left: 12.8px; - font-weight: 400 -} - -.l_side .toc-wrapper ol .toc-item.toc-level-2 .toc-child a, .l_side .toc-wrapper ul .toc-item.toc-level-2 .toc-child a { - padding-left: 25.6px; - font-weight: 400 -} - -.l_side .toc-wrapper ol .toc-item.toc-level-3 .toc-child a, .l_side .toc-wrapper ul .toc-item.toc-level-3 .toc-child a { - padding-left: 38.4px; - font-weight: 400 -} - -.l_side .toc-wrapper ol .toc-item.toc-level-4 .toc-child a, .l_side .toc-wrapper ul .toc-item.toc-level-4 .toc-child a { - padding-left: 51.2px; - font-weight: 400 -} - -.l_side .toc-wrapper ol .toc-item.toc-level-5 .toc-child a, .l_side .toc-wrapper ul .toc-item.toc-level-5 .toc-child a { - padding-left: 64px; - font-weight: 400 -} - -.l_side .toc-wrapper ol .toc-item.toc-level-6 .toc-child a, .l_side .toc-wrapper ul .toc-item.toc-level-6 .toc-child a { - padding-left: 64px; - font-weight: 400 -} - -.l_side .toc-wrapper ol li, .l_side .toc-wrapper ul li { - width: auto; - text-align: left -} - -.l_side .toc-wrapper ol li a, .l_side .toc-wrapper ul li a { - padding: 0 8px 0 11px; - font-weight: 700; - width: 100% -} - -.l_side .toc-wrapper:empty { - display: none -} - -.backstretch { - left: 0; - top: 0; - overflow: hidden; - margin: 0; - padding: 0; - height: 70vh; - z-index: -999998; - position: absolute; -} - -.blog-background { - object-fit: cover; - width: 100%; - height: 100%; -} - -//@media only screen and (max-width: 768px){ -// .backstretch { -// left: -1000px; -// } -//} -// -//@media only screen and (min-width: 768px){ -// .backstretch { -// left: -888px; -// } -//} -// -//@media only screen and (min-width: 992px){ -// .backstretch { -// left: -768px; -// } -//} -// -//@media only screen and (min-width: 1200px){ -// .backstretch { -// left: -500px; -// } -//} -// -//@media only screen and (min-width: 1440px){ -// .backstretch { -// left: -300px; -// } -//} - -//@media only screen and (min-width: 1920px){ -// .backstretch { -// left: -300px; -// } -//} diff --git a/src/views/demo/index.vue b/src/views/demo/index.vue deleted file mode 100644 index 903cfd4..0000000 --- a/src/views/demo/index.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - - - - diff --git a/src/views/demo/index_m.vue b/src/views/demo/index_m.vue deleted file mode 100644 index 1816ef6..0000000 --- a/src/views/demo/index_m.vue +++ /dev/null @@ -1,65 +0,0 @@ - - - \ No newline at end of file