diff options
Diffstat (limited to 'static/css/vec.css')
-rw-r--r-- | static/css/vec.css | 424 |
1 files changed, 423 insertions, 1 deletions
diff --git a/static/css/vec.css b/static/css/vec.css index e9a4bbf..5dc09f9 100644 --- a/static/css/vec.css +++ b/static/css/vec.css @@ -1,2 +1,424 @@ -@import url(//fonts.googleapis.com/css?family=Droid+Sans+Mono|Russo+One|Source+Sans+Pro:400,700);@import url(//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css);.hljs{display:block;background:white;padding:0.5em;color:#333333;overflow-x:auto}.hljs-comment,.hljs-meta{color:#969896}.hljs-string,.hljs-variable,.hljs-template-variable,.hljs-strong,.hljs-emphasis,.hljs-quote{color:#df5000}.hljs-keyword,.hljs-selector-tag,.hljs-type{color:#a71d5d}.hljs-literal,.hljs-symbol,.hljs-bullet,.hljs-attribute{color:#0086b3}.hljs-section,.hljs-name{color:#63a35c}.hljs-tag{color:#333333}.hljs-title,.hljs-attr,.hljs-selector-id,.hljs-selector-class,.hljs-selector-attr,.hljs-selector-pseudo{color:#795da3}.hljs-addition{color:#55a532;background-color:#eaffea}.hljs-deletion{color:#bd2c00;background-color:#ffecec}.hljs-link{text-decoration:underline}html{height:100%}body{margin:0;padding:0;min-height:100%;font-family:"Source Sans Pro","PingFang SC","Microsoft YaHei",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:100%;letter-spacing:.01rem;position:relative}h1,h2,h3,h4,h5,h6{font-family:"Russo One","Arial Black","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-weight:700;line-height:1.25}a{color:#005580;text-decoration:none}a:hover{color:#08c}img,video{max-width:100%}.pull-left{float:left}.pull-right{float:right}.clearfix::before,.clearfix::after{display:table;content:"";line-height:0}.clearfix::after{clear:both}.content{margin:0 auto;padding:6rem 1.85rem 8rem;max-width:40rem}header{position:fixed;top:0;width:100%;height:1.75rem;font-family:"Droid Sans Mono",Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:.875rem;font-weight:bold;background:#2d2d2d;border-bottom:1px solid #000;z-index:99}header ul,header ol{margin:0;padding:0;list-style:none}header nav{padding:0 0.5rem}header .nav-center{text-align:center;line-height:1.75rem;color:#000;text-transform:uppercase;text-shadow:rgba(255,255,255,0.098) 0 1px 0,rgba(255,255,255,0.12) 0 0 1.875rem}header a{color:#bbb;line-height:1.75rem;padding:0 0.5rem}header a:hover,header .current a{color:#fff}footer{position:absolute;width:100%;padding:1rem;bottom:0;box-sizing:border-box;color:#ccc}footer a{color:#ccc}footer .footer-info{border-top:.4rem double #f2f2f2;padding-top:0.25rem}.user-profile{width:100%;padding:4rem 1rem 8rem;font-family:"Russo One","Arial Black","Hiragino Sans GB","Microsoft YaHei",sans-serif;color:#888;text-align:center;box-sizing:border-box}.user-profile .user-avatar{margin:1rem 0}.user-profile .user-avatar img{width:16rem;height:16rem}.user-profile .user-socials a{color:#a7a7a7;font-size:1.25rem;line-height:1.5rem;text-decoration:none}.user-profile .user-socials a:hover{color:#777}.user-profile .user-motivation{max-width:56rem;font-size:4rem;line-height:4.125rem;margin:1rem auto}.posts{margin-left:-6rem}.posts .posts-archive{margin-bottom:3rem}.posts .posts-archive time{display:block;width:10rem;float:left;font-family:"Russo One","Arial Black","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-size:1.75rem;text-align:right;color:#CCCCCC;font-weight:bold;white-space:nowrap;line-height:1.25rem;padding:.125rem 0}.posts .posts-archive ol{margin-left:12rem}.posts .posts-archive ol li{margin-bottom:.5rem;list-style:decimal}.post{color:#444;line-height:1.8;width:100%}.post hr{height:0.25rem;padding:0;margin:1.5rem 0;background-color:#e7e7e7;border:0}.post em{text-emphasis-style:circle;text-emphasis-position:under}.post code{font-family:"Droid Sans Mono",Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:0.85rem;color:#555;background-color:#f5f5f5;border:1px solid #eef;border-radius:3px;padding:0.2rem 0.5rem}.post pre{display:block;margin:0 0 1rem 0;padding:1rem;font-size:0.8rem;line-height:1.4;white-space:pre;white-space:pre-wrap;word-break:break-all;word-wrap:break-word;background-color:#f5f5f5}.post pre code{font-size:0.7rem;padding:0;color:inherit;border:none}.post blockquote{padding:0.5rem 1rem;margin:0.8rem 0;color:#7a7a7a;border-left:0.3rem solid #e5e5e5}.post blockquote p:first-child{margin-top:0}.post blockquote p:last-child{margin-bottom:0}#TableOfContents{border-radius:.25rem;padding:1rem;background-color:#f7f7f7;margin:5rem 0 0 35rem;position:absolute;font-size:.875rem}#TableOfContents ul{list-style:none;margin:0;padding:0}#TableOfContents a{display:inline-block;white-space:nowrap;overflow:hidden;max-width:14rem;text-overflow:ellipsis}#TableOfContents a:before{content:'•';padding-right:.25rem}#TableOfContents a+ul{padding-left:1.5rem}#TableOfContents ~ section{margin-left:-6rem}.pagination{width:100%;margin:4rem 0 0;padding:1.6rem 0;border-top:1px solid #e7e7e7}.pagination a{width:42%;overflow:hidden;position:relative}.pagination .previous{float:left;padding-left:1.25rem}.pagination .previous:before{display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;position:absolute;top:50%;margin-top:-.5rem;left:0;content:"\f053"}.pagination .next{float:right;text-align:right;padding-right:1.25rem}.pagination .next:after{display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;position:absolute;top:50%;margin-top:-.5rem;right:0;content:"\f054"}.disqus{width:100%;padding:5rem 0 2rem;border-top:1px solid #e7e7e7}.formspree input,.formspree textarea{font-size:0.8rem;border:1px solid #ddd;background:#fff;padding:0.5rem 2%;margin:1.2rem 1rem 1.2rem 0;line-height:1.5rem;width:96%;border:1px solid #ddd;border-radius:3px;display:block}.formspree input{max-width:25rem}.formspree button{float:right;color:#999;font-weight:bold;border-radius:3px;border:1px solid #d5d5d5;background:#fff;font-size:.8rem;padding:.5rem 1.2rem}.formspree button:hover{background:#f5f5f5}@media (max-width: 480px){.content{margin:0 auto;padding:4rem 1rem 8rem}.user-profile .user-avatar img{width:8rem;height:8rem}.user-profile .user-motivation{font-size:2.625rem;line-height:3.125rem}.pagination a{font-size:.75rem}.pagination .previous:before,.pagination .next:after{margin-top:-.35rem}}@media (max-width: 920px){.posts{margin-left:0rem}#TableOfContents{display:none}#TableOfContents ~ section{margin-left:0rem}}@media (max-width: 700px){.posts{margin-left:0rem}.posts .posts-archive time{float:none;text-align:left;margin-bottom:1rem}.posts .posts-archive ol{margin-left:0}} +@charset "UTF-8"; +@import url(//fonts.googleapis.com/css?family=Droid+Sans+Mono|Russo+One|Source+Sans+Pro:400,700); +@import url(//use.fontawesome.com/releases/v5.0.7/css/all.css); +/** + * GitHub Gist Theme + * Author : Louis Barranqueiro - https://github.com/LouisBarranqueiro + */ +.hljs { + display: block; + background: white; + padding: 0.5em; + color: #333333; + overflow-x: auto; } + +.hljs-comment, +.hljs-meta { + color: #969896; } + +.hljs-string, +.hljs-variable, +.hljs-template-variable, +.hljs-strong, +.hljs-emphasis, +.hljs-quote { + color: #df5000; } + +.hljs-keyword, +.hljs-selector-tag, +.hljs-type { + color: #a71d5d; } + +.hljs-literal, +.hljs-symbol, +.hljs-bullet, +.hljs-attribute { + color: #0086b3; } + +.hljs-section, +.hljs-name { + color: #63a35c; } + +.hljs-tag { + color: #333333; } + +.hljs-title, +.hljs-attr, +.hljs-selector-id, +.hljs-selector-class, +.hljs-selector-attr, +.hljs-selector-pseudo { + color: #795da3; } + +.hljs-addition { + color: #55a532; + background-color: #eaffea; } + +.hljs-deletion { + color: #bd2c00; + background-color: #ffecec; } + +.hljs-link { + text-decoration: underline; } + +html { + height: 100%; } + +body { + margin: 0; + padding: 0; + min-height: 100%; + font-family: "Source Sans Pro", "PingFang SC", "Microsoft YaHei", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; + font-size: 100%; + letter-spacing: .01rem; + position: relative; } + +h1, h2, h3, h4, h5, h6 { + font-family: "Russo One", "Arial Black", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; + font-weight: 700; + line-height: 1.25; } + +a { + color: #005580; + text-decoration: none; } + a:hover { + color: #08c; } + +img, video { + max-width: 100%; } + +.pull-left { + float: left; } + +.pull-right { + float: right; } + +.clearfix::before, .clearfix::after { + display: table; + content: ""; + line-height: 0; } + +.clearfix::after { + clear: both; } + +.content { + margin: 0 auto; + padding: 6rem 1.85rem 8rem; + max-width: 40rem; } + +/* ============== Header ============== */ +header { + position: fixed; + top: 0; + width: 100%; + height: 1.75rem; + font-family: "Droid Sans Mono", Consolas, "Liberation Mono", Menlo, Courier, monospace; + font-size: .875rem; + font-weight: bold; + background: #2d2d2d; + border-bottom: 1px solid #000; + z-index: 99; } + header ul, header ol { + margin: 0; + padding: 0; + list-style: none; } + header nav { + padding: 0 0.5rem; } + header .nav-center { + text-align: center; + line-height: 1.75rem; + color: #000; + text-transform: uppercase; + text-shadow: rgba(255, 255, 255, 0.098) 0 1px 0, rgba(255, 255, 255, 0.12) 0 0 1.875rem; } + header a { + color: #bbb; + line-height: 1.75rem; + padding: 0 0.5rem; } + header a:hover, header .current a { + color: #fff; } + +/* ============== Footer ============== */ +footer { + position: absolute; + width: 100%; + padding: 1rem; + bottom: 0; + box-sizing: border-box; + color: #ccc; } + footer a { + color: #ccc; } + footer .footer-info { + border-top: .4rem double #f2f2f2; + padding-top: 0.25rem; } + +/* ============== Index ============== */ +.index { + display: flex; + align-items: center; } + +.user-profile { + width: 100%; + padding: 4rem 1rem 12rem; + font-family: "Russo One", "Arial Black", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; + color: #888; + text-align: center; + box-sizing: border-box; } + +.user-profile .user-avatar { + margin: 1rem 0; } + +.user-profile .user-avatar img { + width: 16rem; + height: 16rem; } + +.user-profile .user-socials a { + color: #a7a7a7; + font-size: 1.25rem; + line-height: 1.5rem; + text-decoration: none; } + +.user-profile .user-socials a:hover { + color: #777; } + +.user-profile .user-motivation { + max-width: 56rem; + font-size: 4rem; + line-height: 4.125rem; + margin: 1rem auto; } + +/* ============== List ============== */ +.posts { + margin-left: -6rem; } + .posts .posts-archive { + margin-bottom: 3rem; } + .posts .posts-archive time { + display: block; + width: 10rem; + float: left; + font-family: "Russo One", "Arial Black", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; + font-size: 1.75rem; + text-align: right; + color: #CCCCCC; + font-weight: bold; + white-space: nowrap; + line-height: 1.25rem; + padding: .125rem 0; } + .posts .posts-archive ol { + margin-left: 12rem; + list-style-type: none; + counter-reset: li; } + .posts .posts-archive ol li { + margin-bottom: .5rem; + list-style: none; + counter-increment: li; } + .posts .posts-archive ol li::before { + content: counter(li) "."; + color: #005580; + display: inline-block; + width: 1em; + margin-left: -1.5em; + margin-right: 0.5em; + text-align: right; } + +/* ============== Page ============== */ +.content.wide { + max-width: 52rem; } +.content.toc { + max-width: 50rem; } + +.post { + color: #444; + line-height: 1.8; + width: 100%; } + .post h1, .post h2, .post h3, .post h4, .post h5, .post h6 { + padding: 2.5rem 0 1rem; + -webkit-margin-before: 0; + -webkit-margin-after: 0; + -webkit-margin-start: 0; + -webkit-margin-end: 0; } + .post hr { + height: 0.25rem; + padding: 0; + margin: 1.5rem 0; + background-color: #e7e7e7; + border: 0; } + .post em { + text-emphasis-style: circle; + text-emphasis-position: under; } + .post code { + font-family: "Droid Sans Mono", Consolas, "Liberation Mono", Menlo, Courier, monospace; + font-size: 0.85rem; + color: #555; + background-color: #f5f5f5; + border: 1px solid #eef; + border-radius: 3px; + padding: 0.2rem 0.5rem; } + .post pre { + display: block; + margin: 0 0 1rem 0; + padding: 1rem; + font-size: 0.8rem; + line-height: 1.4; + white-space: pre; + white-space: pre-wrap; + word-break: break-all; + word-wrap: break-word; + background-color: #f5f5f5; } + .post pre code { + font-size: 0.7rem; + padding: 0; + color: inherit; + border: none; } + .post blockquote { + padding: 0.5rem 1rem; + margin: 0.8rem 0; + color: #7a7a7a; + border-left: 0.3rem solid #e5e5e5; } + .post blockquote p:first-child { + margin-top: 0; } + .post blockquote p:last-child { + margin-bottom: 0; } + +#TableOfContents { + border-radius: .25rem; + padding: 1rem; + background-color: #f7f7f7; + margin: 5rem 0 0 45rem; + position: absolute; + font-size: .875rem; } + #TableOfContents ul { + list-style: none; + margin: 0; + padding: 0; } + #TableOfContents ul li a { + display: inline-block; + white-space: nowrap; + overflow: hidden; + max-width: 14rem; + text-overflow: ellipsis; } + #TableOfContents ul li a:before { + content: '├'; + padding-right: .25rem; } + #TableOfContents ul li:last-of-type > a:before { + content: '└'; + padding-right: .25rem; } + #TableOfContents a + ul { + padding-left: 1.5rem; } + #TableOfContents ~ section { + margin-left: -6rem; } + +.pagination { + width: 100%; + margin: 4rem 0 0; + padding: 1.6rem 0; + border-top: 1px solid #e7e7e7; } + .pagination a { + width: 42%; + overflow: hidden; + position: relative; } + .pagination .previous { + float: left; + padding-left: 1.25rem; } + .pagination .previous:before { + display: inline-block; + font: normal normal 900 14px/1 "Font Awesome 5 Free"; + font-size: inherit; + text-rendering: auto; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + position: absolute; + top: 50%; + margin-top: -.5rem; + left: 0; + content: "\f053"; } + .pagination .next { + float: right; + text-align: right; + padding-right: 1.25rem; } + .pagination .next:after { + display: inline-block; + font: normal normal 900 14px/1 "Font Awesome 5 Free"; + font-size: inherit; + text-rendering: auto; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + position: absolute; + top: 50%; + margin-top: -.5rem; + right: 0; + content: "\f054"; } + +.disqus { + width: 100%; + padding: 5rem 0 2rem; + border-top: 1px solid #e7e7e7; } + +/* ============== formspree ============== */ +.formspree input, .formspree textarea { + font-size: 0.8rem; + border: 1px solid #ddd; + background: #fff; + padding: 0.5rem 2%; + margin: 1.2rem 1rem 1.2rem 0; + line-height: 1.5rem; + width: 96%; + border: 1px solid #ddd; + border-radius: 3px; + display: block; } +.formspree input { + max-width: 25rem; } +.formspree button { + float: right; + color: #999; + font-weight: bold; + border-radius: 3px; + border: 1px solid #d5d5d5; + background: #fff; + font-size: .8rem; + padding: .5rem 1.2rem; } + .formspree button:hover { + background: #f5f5f5; } + +/* ============== media ============== */ +@media (max-width: 1200px) { + .content.toc { + max-width: 40rem; } + + #TableOfContents { + margin: 5rem 0 0 35rem; } } +@media (max-width: 920px) { + .posts { + margin-left: 0rem; } + + #TableOfContents { + display: none; } + #TableOfContents ~ section { + margin-left: 0rem; } } +@media (max-width: 700px) { + .posts { + margin-left: 0rem; } + .posts .posts-archive time { + float: none; + text-align: left; + margin-bottom: 1rem; } + .posts .posts-archive ol { + margin-left: 0; } } +@media (max-width: 480px) { + .content { + margin: 0 auto; + padding: 4rem 1rem 8rem; } + + .user-profile .user-avatar img { + width: 8rem; + height: 8rem; } + + .user-profile .user-motivation { + font-size: 2.625rem; + line-height: 3.125rem; } + + .pagination a { + font-size: .75rem; } + .pagination .previous:before, .pagination .next:after { + margin-top: -.35rem; } } + /*# sourceMappingURL=vec.css.map */ |