diff options
Diffstat (limited to 'static/css')
| -rw-r--r-- | static/css/style.css | 1624 |
1 files changed, 1624 insertions, 0 deletions
diff --git a/static/css/style.css b/static/css/style.css new file mode 100644 index 0000000..a30b3d5 --- /dev/null +++ b/static/css/style.css @@ -0,0 +1,1624 @@ +.inline { + display: inline; + } + .block { + display: block; + } + .inline-block { + display: inline-block; + } + .table { + display: table; + } + .table-cell { + display: table-cell; + } + .overflow-hidden { + overflow: hidden; + } + .overflow-scroll { + overflow: scroll; + } + .overflow-auto { + overflow: auto; + } + .clearfix:before, + .clearfix:after { + display: table; + content: " "; + } + .clearfix:after { + clear: both; + } + .left { + float: left; + } + .right { + float: right; + } + .fit { + max-width: 100%; + } + .truncate { + display: inline-block; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + .max-width-1 { + max-width: 24rem; + } + .max-width-2 { + max-width: 32rem; + } + .max-width-3 { + max-width: 48rem; + } + .max-width-4 { + max-width: 64rem; + } + .border-box { + box-sizing: border-box; + } + .m0 { + margin: 0; + } + .mt0 { + margin-top: 0; + } + .mr0 { + margin-right: 0; + } + .mb0 { + margin-bottom: 0; + } + .ml0 { + margin-left: 0; + } + .mx0 { + margin-right: 0; + margin-left: 0; + } + .my0 { + margin-top: 0; + margin-bottom: 0; + } + .m1 { + margin: 0.5rem; + } + .mt1 { + margin-top: 0.5rem; + } + .mr1 { + margin-right: 0.5rem; + } + .mb1 { + margin-bottom: 0.5rem; + } + .ml1 { + margin-left: 0.5rem; + } + .mx1 { + margin-right: 0.5rem; + margin-left: 0.5rem; + } + .my1 { + margin-top: 0.5rem; + margin-bottom: 0.5rem; + } + .m2 { + margin: 1rem; + } + .mt2 { + margin-top: 1rem; + } + .mr2 { + margin-right: 1rem; + } + .mb2 { + margin-bottom: 1rem; + } + .ml2 { + margin-left: 1rem; + } + .mx2 { + margin-right: 1rem; + margin-left: 1rem; + } + .my2 { + margin-top: 1rem; + margin-bottom: 1rem; + } + .m3 { + margin: 2rem; + } + .mt3 { + margin-top: 2rem; + } + .mr3 { + margin-right: 2rem; + } + .mb3 { + margin-bottom: 2rem; + } + .ml3 { + margin-left: 2rem; + } + .mx3 { + margin-right: 2rem; + margin-left: 2rem; + } + .my3 { + margin-top: 2rem; + margin-bottom: 2rem; + } + .m4 { + margin: 4rem; + } + .mt4 { + margin-top: 4rem; + } + .mr4 { + margin-right: 4rem; + } + .mb4 { + margin-bottom: 4rem; + } + .ml4 { + margin-left: 4rem; + } + .mx4 { + margin-right: 4rem; + margin-left: 4rem; + } + .my4 { + margin-top: 4rem; + margin-bottom: 4rem; + } + .mxn1 { + margin-right: -0.5rem; + margin-left: -0.5rem; + } + .mxn2 { + margin-right: -1rem; + margin-left: -1rem; + } + .mxn3 { + margin-right: -2rem; + margin-left: -2rem; + } + .mxn4 { + margin-right: -4rem; + margin-left: -4rem; + } + .ml-auto { + margin-left: auto; + } + .mr-auto { + margin-right: auto; + } + .mx-auto { + margin-right: auto; + margin-left: auto; + } + .p0 { + padding: 0; + } + .pt0 { + padding-top: 0; + } + .pr0 { + padding-right: 0; + } + .pb0 { + padding-bottom: 0; + } + .pl0 { + padding-left: 0; + } + .px0 { + padding-right: 0; + padding-left: 0; + } + .py0 { + padding-top: 0; + padding-bottom: 0; + } + .p1 { + padding: 0.5rem; + } + .pt1 { + padding-top: 0.5rem; + } + .pr1 { + padding-right: 0.5rem; + } + .pb1 { + padding-bottom: 0.5rem; + } + .pl1 { + padding-left: 0.5rem; + } + .py1 { + padding-top: 0.5rem; + padding-bottom: 0.5rem; + } + .px1 { + padding-right: 0.5rem; + padding-left: 0.5rem; + } + .p2 { + padding: 1rem; + } + .pt2 { + padding-top: 1rem; + } + .pr2 { + padding-right: 1rem; + } + .pb2 { + padding-bottom: 1rem; + } + .pl2 { + padding-left: 1rem; + } + .py2 { + padding-top: 1rem; + padding-bottom: 1rem; + } + .px2 { + padding-right: 1rem; + padding-left: 1rem; + } + .p3 { + padding: 2rem; + } + .pt3 { + padding-top: 2rem; + } + .pr3 { + padding-right: 2rem; + } + .pb3 { + padding-bottom: 2rem; + } + .pl3 { + padding-left: 2rem; + } + .py3 { + padding-top: 2rem; + padding-bottom: 2rem; + } + .px3 { + padding-right: 2rem; + padding-left: 2rem; + } + .p4 { + padding: 4rem; + } + .pt4 { + padding-top: 4rem; + } + .pr4 { + padding-right: 4rem; + } + .pb4 { + padding-bottom: 4rem; + } + .pl4 { + padding-left: 4rem; + } + .py4 { + padding-top: 4rem; + padding-bottom: 4rem; + } + .px4 { + padding-right: 4rem; + padding-left: 4rem; + } + body h1, + body .h1 { + display: block; + margin-top: 3rem; + margin-bottom: 1rem; + color: #2bbc8a; + letter-spacing: 0.01em; + font-weight: 700; + font-style: normal; + font-size: 1.5em; + -moz-osx-font-smoothing: grayscale; + -webkit-font-smoothing: antialiased; + } + body h2, + body .h2 { + position: relative; + display: block; + margin-top: 2rem; + margin-bottom: 0.5rem; + color: #383838; + text-transform: none; + letter-spacing: normal; + font-weight: bold; + font-size: 1rem; + } + body h3 { + color: #383838; + text-decoration: underline; + font-weight: bold; + font-size: 0.9rem; + } + body h4, + body h5, + body h6 { + display: inline; + text-decoration: none; + color: #8c8c8c; + font-weight: bold; + font-size: 0.9rem; + } + body h3, + body h4, + body h5, + body h6 { + margin-top: 0.9rem; + margin-bottom: 0.5rem; + } + body hr { + border: 0.5px dashed #8c8c8c; + opacity: 0.5; + margin: 0; + margin-top: 20px; + margin-bottom: 20px; + } + body strong { + font-weight: bold; + } + body em, + body cite { + font-style: italic; + } + body sup, + body sub { + position: relative; + vertical-align: baseline; + font-size: 0.75em; + line-height: 0; + } + body sup { + top: -0.5em; + } + body sub { + bottom: -0.2em; + } + body small { + font-size: 0.85em; + } + body acronym, + body abbr { + border-bottom: 1px dotted; + } + body ul, + body ol, + body dl { + line-height: 1.725; + } + body ul ul, + body ol ul, + body ul ol, + body ol ol { + margin-top: 0; + margin-bottom: 0; + } + body ol { + list-style: decimal; + } + body dt { + font-weight: bold; + } + body table { + width: 100%; + border-collapse: collapse; + text-align: left; + font-size: 12px; + overflow: auto; + display: block; + } + body th { + padding: 8px; + border-bottom: 1px dashed #666; + color: #383838; + font-weight: bold; + font-size: 13px; + } + body td { + padding: 0 8px; + border-bottom: none; + } + @font-face { + font-style: normal; + font-family: "Meslo LG"; + src: local("Meslo LG S"), url("../lib/meslo-LG/MesloLGS-Regular.ttf") format("truetype"); + } + @font-face { + font-style: normal; + font-family: "JetBrains Mono"; + src: local("JetBrains Mono"), url("../lib/JetBrainsMono/ttf/JetBrainsMono-Regular.ttf") format("truetype"); + } + *, + *:before, + *:after { + box-sizing: border-box; + } + html { + margin: 0; + padding: 0; + height: 100%; + border-top: 2px solid #383838; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; + } + body { + margin: 0; + height: 100%; + background-color: #fff; + color: #383838; + font-display: swap; + font-weight: 400; + font-size: 14px; + font-family: "JetBrains Mono", monospace; + line-height: 1.725; + text-rendering: geometricPrecision; + flex: 1; + -moz-osx-font-smoothing: grayscale; + -webkit-font-smoothing: antialiased; + } + .content { + position: relative; + display: flex; + flex-direction: column; + min-height: 100%; + overflow-wrap: break-word; + } + .content p { + hyphens: auto; + -moz-hyphens: auto; + -ms-hyphens: auto; + -webkit-hyphens: auto; + } + .content code { + hyphens: manual; + -moz-hyphens: manual; + -ms-hyphens: manual; + -webkit-hyphens: manual; + } + .content a { + color: #383838; + text-decoration: none; + background-image: linear-gradient(transparent, transparent 5px, #383838 5px, #383838); + background-position: bottom; + background-size: 100% 6px; + background-repeat: repeat-x; + } + .content a:hover { + background-image: linear-gradient(transparent, transparent 4px, #d480aa 4px, #d480aa); + } + .content a.icon { + background: none; + } + .content a.icon:hover { + color: #d480aa; + } + .content h1 a, + .content .h1 a, + .content h2 a, + .content h3 a, + .content h4 a, + .content h5 a, + .content h6 a { + background: none; + color: inherit; + text-decoration: none; + } + .content h1 a:hover, + .content .h1 a:hover, + .content h2 a:hover, + .content h3 a:hover, + .content h4 a:hover, + .content h5 a:hover, + .content h6 a:hover { + background-image: linear-gradient(transparent, transparent 6px, #d480aa 6px, #d480aa); + background-position: bottom; + background-size: 100% 6px; + background-repeat: repeat-x; + } + .content h6 a { + background: none; + color: inherit; + text-decoration: none; + } + .content h6 a:hover { + background-image: linear-gradient(transparent, transparent 6px, #d480aa 6px, #d480aa); + background-position: bottom; + background-size: 100% 6px; + background-repeat: repeat-x; + } + @media (min-width: 540px) { + .image-wrap { + flex-direction: row; + margin-bottom: 2rem; + } + .image-wrap .image-block { + flex: 1 0 35%; + margin-right: 2rem; + } + .image-wrap p { + flex: 1 0 65%; + } + } + .max-width { + max-width: 48rem; + } + @media (max-width: 480px) { + .px3 { + padding-right: 1rem; + padding-left: 1rem; + } + .my4 { + margin-top: 2rem; + margin-bottom: 2rem; + } + } + @media (min-width: 480px) { + p { + text-align: justify; + } + } + #header { + margin: 0 auto 2rem; + width: 100%; + } + #header h1, + #header .h1 { + margin-top: 0; + margin-bottom: 0; + color: #383838; + letter-spacing: 0.01em; + font-weight: 700; + font-style: normal; + font-size: 1.5rem; + line-height: 2rem; + -moz-osx-font-smoothing: grayscale; + -webkit-font-smoothing: antialiased; + } + #header a { + background: none; + color: inherit; + text-decoration: none; + } + #header #logo { + display: inline-block; + float: left; + margin-right: 20px; + width: 50px; + height: 50px; + border-radius: 5px; + background-size: 50px 50px; + background-repeat: no-repeat; + filter: grayscale(100%); + -webkit-filter: grayscale(100%); + } + #header #nav { + color: #2bbc8a; + letter-spacing: 0.01em; + font-weight: 200; + font-style: normal; + font-size: 0.8rem; + } + #header #nav ul { + margin: 0; + padding: 0; + list-style-type: none; + line-height: 15px; + } + #header #nav ul a { + margin-right: 15px; + color: #2bbc8a; + } + #header #nav ul a:hover { + background-image: linear-gradient(transparent, transparent 5px, #2bbc8a 5px, #2bbc8a); + background-position: bottom; + background-size: 100% 6px; + background-repeat: repeat-x; + } + #header #nav ul li { + display: inline-block; + margin-right: 15px; + border-right: 1px dotted; + border-color: #2bbc8a; + vertical-align: middle; + } + #header #nav ul .icon { + display: none; + } + #header #nav ul li:last-child { + margin-right: 0; + border-right: 0; + } + #header #nav ul li:last-child a { + margin-right: 0; + } + #header:hover #logo { + filter: none; + -webkit-filter: none; + } + @media screen and (max-width: 480px) { + #header #title { + display: table; + margin-right: 5rem; + min-height: 50px; + } + #header #title h1 { + display: table-cell; + vertical-align: middle; + } + #header #nav ul a:hover { + background: none; + } + #header #nav ul li { + display: none; + border-right: 0; + } + #header #nav ul li.icon { + position: absolute; + top: 77px; + right: 1rem; + display: inline-block; + } + #header #nav ul.responsive li { + display: block; + } + #header #nav li:not(:first-child) { + padding-top: 1rem; + padding-left: 70px; + font-size: 1rem; + } + } + #header-post { + position: fixed; + top: 2rem; + right: 0; + display: inline-block; + float: right; + z-index: 100; + } + #header-post a { + background: none; + color: inherit; + text-decoration: none; + } + #header-post a.icon { + background: none; + } + #header-post a.icon:hover { + color: #d480aa; + } + #header-post ol { + list-style-type: none; + } + #header-post ul { + display: inline-block; + margin: 0; + padding: 0; + list-style-type: none; + } + #header-post ul li { + display: inline-block; + margin-right: 15px; + vertical-align: middle; + } + #header-post ul li:last-child { + margin-right: 0; + } + #header-post #menu-icon { + float: right; + margin-right: 2rem; + margin-left: 15px; + } + #header-post #menu-icon:hover { + color: #2bbc8a; + } + #header-post #menu-icon-tablet { + float: right; + margin-right: 2rem; + margin-left: 15px; + } + #header-post #menu-icon-tablet:hover { + color: #2bbc8a; + } + #header-post #top-icon-tablet { + position: fixed; + right: 2rem; + bottom: 2rem; + margin-right: 2rem; + margin-left: 15px; + } + #header-post #top-icon-tablet:hover { + color: #2bbc8a; + } + #header-post .active { + color: #2bbc8a; + } + #header-post #menu { + visibility: hidden; + margin-right: 2rem; + } + #header-post #nav { + color: #2bbc8a; + letter-spacing: 0.01em; + font-weight: 200; + font-style: normal; + font-size: 0.8rem; + } + #header-post #nav ul { + line-height: 15px; + } + #header-post #nav ul a { + margin-right: 15px; + color: #2bbc8a; + } + #header-post #nav ul a:hover { + background-image: linear-gradient(transparent, transparent 5px, #2bbc8a 5px, #2bbc8a); + background-position: bottom; + background-size: 100% 6px; + background-repeat: repeat-x; + } + #header-post #nav ul li { + border-right: 1px dotted #2bbc8a; + } + #header-post #nav ul li:last-child { + margin-right: 0; + border-right: 0; + } + #header-post #nav ul li:last-child a { + margin-right: 0; + } + #header-post #actions { + float: right; + margin-top: 2rem; + margin-right: 2rem; + width: 100%; + text-align: right; + } + #header-post #actions ul { + display: block; + } + #header-post #actions .info { + display: block; + font-style: italic; + } + #header-post #share { + clear: both; + padding-top: 1rem; + padding-right: 2rem; + text-align: right; + } + #header-post #share li { + display: block; + margin: 0; + } + #header-post #toc { + float: right; + clear: both; + overflow: auto; + margin-top: 1rem; + padding-right: 2rem; + max-width: 20em; + max-height: calc(95vh - 7rem); + text-align: right; + } + #header-post #toc a:hover { + color: #d480aa; + } + #header-post #toc .toc-level-1 > .toc-link { + display: none; + } + #header-post #toc .toc-level-2 { + color: #383838; + font-size: 0.8rem; + } + #header-post #toc .toc-level-2:before { + color: #2bbc8a; + content: "#"; + } + #header-post #toc .toc-level-3 { + color: #666; + font-size: 0.7rem; + } + #header-post #toc .toc-level-4 { + color: #525252; + font-size: 0.4rem; + } + #header-post #toc .toc-level-5 { + display: none; + } + #header-post #toc .toc-level-6 { + display: none; + } + #header-post #toc .toc-number { + display: none; + } + @media screen and (max-width: 500px) { + #header-post { + display: none; + } + } + @media screen and (max-width: 900px) { + #header-post #menu-icon { + display: none; + } + #header-post #actions { + display: none; + } + } + @media screen and (max-width: 1199px) { + #header-post #toc { + display: none; + } + } + @media screen and (min-width: 900px) { + #header-post #menu-icon-tablet { + display: none !important; + } + #header-post #top-icon-tablet { + display: none !important; + } + } + @media screen and (min-width: 1199px) { + #header-post #actions { + width: auto; + } + #header-post #actions ul { + display: inline-block; + float: right; + } + #header-post #actions .info { + display: inline; + float: left; + margin-right: 2rem; + font-style: italic; + } + } + #footer-post { + position: fixed; + right: 0; + bottom: 0; + left: 0; + z-index: 5000000; + width: 100%; + border-top: 1px solid #666; + background: #fafafa; + transition: opacity 0.2s; + } + #footer-post a { + background: none; + color: inherit; + text-decoration: none; + } + #footer-post a.icon { + background: none; + } + #footer-post a.icon:hover { + color: #d480aa; + } + #footer-post #nav-footer { + padding-right: 1rem; + padding-left: 1rem; + background: #e6e6e6; + text-align: center; + } + #footer-post #nav-footer a { + color: #2bbc8a; + font-size: 1em; + } + #footer-post #nav-footer a:hover { + background-image: linear-gradient(transparent, transparent 5px, #2bbc8a 5px, #2bbc8a); + background-position: bottom; + background-size: 100% 6px; + background-repeat: repeat-x; + } + #footer-post #nav-footer ul { + display: table; + margin: 0; + padding: 0; + width: 100%; + list-style-type: none; + } + #footer-post #nav-footer ul li { + display: inline-table; + padding: 10px; + width: 20%; + vertical-align: middle; + } + #footer-post #actions-footer { + overflow: auto; + margin-top: 1rem; + margin-bottom: 1rem; + padding-right: 1rem; + padding-left: 1rem; + width: 100%; + text-align: center; + white-space: nowrap; + } + #footer-post #actions-footer a { + display: inline-block; + padding-left: 1rem; + color: #2bbc8a; + } + #footer-post #share-footer { + padding-right: 1rem; + padding-left: 1rem; + background: #e6e6e6; + text-align: center; + } + #footer-post #share-footer ul { + display: table; + margin: 0; + padding: 0; + width: 100%; + list-style-type: none; + } + #footer-post #share-footer ul li { + display: inline-table; + padding: 10px; + width: 20%; + vertical-align: middle; + } + #footer-post #toc-footer { + clear: both; + padding-top: 1rem; + padding-bottom: 1rem; + background: #e6e6e6; + text-align: left; + } + #footer-post #toc-footer ol { + margin: 0; + padding-left: 20px; + list-style-type: none; + } + #footer-post #toc-footer ol li { + line-height: 30px; + } + #footer-post #toc-footer a:hover { + color: #d480aa; + } + #footer-post #toc-footer .toc-level-1 > .toc-link { + display: none; + } + #footer-post #toc-footer .toc-level-2 { + color: #383838; + font-size: 0.8rem; + } + #footer-post #toc-footer .toc-level-2:before { + color: #2bbc8a; + content: "#"; + } + #footer-post #toc-footer .toc-level-3 { + color: #666; + font-size: 0.7rem; + line-height: 15px; + } + #footer-post #toc-footer .toc-level-4 { + display: none; + } + #footer-post #toc-footer .toc-level-5 { + display: none; + } + #footer-post #toc-footer .toc-level-6 { + display: none; + } + #footer-post #toc-footer .toc-number { + display: none; + } + @media screen and (min-width: 500px) { + #footer-post-container { + display: none; + } + } + .post-list { + padding: 0; + } + .post-list .post-item { + margin-bottom: 1rem; + margin-left: 0; + list-style-type: none; + } + .post-list .post-item .meta { + display: block; + margin-right: 16px; + min-width: 100px; + color: #666; + font-size: 14px; + } + @media (min-width: 480px) { + .post-list .post-item { + display: flex; + margin-bottom: 5px; + } + .post-list .post-item .meta { + text-align: left; + } + } + .project-list { + padding: 0; + list-style: none; + } + .project-list .project-item { + margin-bottom: 5px; + } + .project-list .project-item p { + display: inline; + } + article header .posttitle { + margin-top: 0; + margin-bottom: 0; + text-transform: none; + font-size: 1.5em; + line-height: 1.25; + } + article header .meta { + margin-top: 0; + margin-bottom: 1rem; + } + article header .meta * { + color: #8c8c8c; + font-size: 0.85rem; + } + article header .author { + text-transform: uppercase; + letter-spacing: 0.01em; + font-weight: 700; + } + article header .postdate { + display: inline; + } + article .content h2:before { + position: absolute; + top: -4px; + left: -1rem; + color: #2bbc8a; + content: "#"; + font-weight: bold; + font-size: 1.2rem; + } + article .content img, + article .content video { + display: block; + margin: auto; + max-width: 100%; + height: auto; + } + article .content .video-container { + position: relative; + overflow: hidden; + padding-top: 56.25%; + height: 0; + } + article .content .video-container iframe, + article .content .video-container object, + article .content .video-container embed { + position: absolute; + top: 0; + left: 0; + margin-top: 0; + width: 100%; + height: 100%; + } + article .content blockquote { + margin: 1rem 10px; + padding: 0.5em 10px; + background: inherit; + color: #2bbc8a; + quotes: "\201C" "\201D" "\2018" "\2019"; + font-weight: bold; + } + article .content blockquote p { + margin: 0; + } + article .content blockquote:before { + margin-right: 0.25em; + color: #2bbc8a; + content: "\201C"; + vertical-align: -0.4em; + font-size: 2em; + line-height: 0.1em; + } + article .content blockquote footer { + margin: line-height 0; + color: #666; + font-size: 11px; + } + article .content blockquote footer a { + background-image: linear-gradient(transparent, transparent 5px, #666 5px, #666); + color: #666; + } + article .content blockquote footer a:hover { + background-image: linear-gradient(transparent, transparent 4px, #858585 4px, #858585); + color: #858585; + } + article .content blockquote footer cite:before { + padding: 0 0.5em; + content: "—"; + } + article .content .pullquote { + margin: 0; + width: 45%; + text-align: left; + } + article .content .pullquote.left { + margin-right: 1em; + margin-left: 0.5em; + } + article .content .pullquote.right { + margin-right: 0.5em; + margin-left: 1em; + } + article .content .caption { + position: relative; + display: block; + margin-top: 0.5em; + color: #666; + text-align: center; + font-size: 0.9em; + } + .posttitle { + text-transform: none; + font-size: 1.5em; + line-height: 1.25; + } + .article-tag .tag-link { + background-image: linear-gradient(transparent, transparent 10px, #d480aa 10px, #d480aa); + background-position: bottom; + background-size: 100% 6px; + background-repeat: repeat-x; + } + .article-tag .tag-link:before { + content: "#"; + } + .article-category .category-link { + background-image: linear-gradient(transparent, transparent 10px, #d480aa 10px, #d480aa); + background-position: bottom; + background-size: 100% 6px; + background-repeat: repeat-x; + } + @media (min-width: 480px) { + .article-tag, + .article-category { + display: inline; + } + .article-tag:before, + .article-category:before { + content: "|"; + } + } + #archive .post-list { + padding: 0; + } + #archive .post-list .post-item { + margin-bottom: 1rem; + margin-left: 0; + list-style-type: none; + } + #archive .post-list .post-item .meta { + display: block; + margin-right: 16px; + min-width: 100px; + color: #666; + font-size: 14px; + } + @media (min-width: 480px) { + #archive .post-list .post-item { + display: flex; + margin-bottom: 5px; + margin-left: 1rem; + } + #archive .post-list .post-item .meta { + text-align: left; + } + } + .blog-post-comments { + margin-top: 4rem; + } + #footer { + position: absolute; + bottom: 0; + margin-bottom: 10px; + width: 100%; + color: #666; + vertical-align: top; + text-align: center; + font-size: 11px; + } + #footer ul { + margin: 0; + padding: 0; + list-style: none; + } + #footer li { + display: inline-block; + margin-right: 15px; + border-right: 1px solid; + border-color: #666; + vertical-align: middle; + } + #footer li a { + margin-right: 15px; + } + #footer li:last-child { + margin-right: 0; + border-right: 0; + } + #footer li:last-child a { + margin-right: 0; + } + #footer a { + color: #666; + text-decoration: underline; + background-image: none; + } + #footer a:hover { + color: #858585; + } + #footer .footer-left { + height: 20px; + vertical-align: middle; + line-height: 20px; + } + @media (min-width: 39rem) { + #footer { + display: flex; + flex-flow: row wrap; + justify-content: space-between; + align-items: center; + align-content: center; + margin-bottom: 20px; + } + #footer .footer-left { + align-self: flex-start; + margin-right: 20px; + } + #footer .footer-right { + align-self: flex-end; + } + } + .pagination { + display: inline-block; + margin-top: 2rem; + width: 100%; + text-align: center; + } + .pagination .page-number { + color: #383838; + font-size: 0.8rem; + } + .pagination a { + padding: 4px 6px; + border-radius: 5px; + background-image: none; + color: #383838; + text-decoration: none; + } + .pagination a:hover { + background-image: none; + } + .pagination a:hover:not(.active) { + color: #383838; + } + .search-input { + padding: 4px 7px; + width: 100%; + outline: none; + border: solid 1px #8c8c8c; + border-radius: 5px; + background-color: #fff; + color: #383838; + font-size: 1.2rem; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + } + .search-input:focus { + border: solid 1px #2bbc8a; + } + #search-result ul.search-result-list { + padding: 0; + list-style-type: none; + } + #search-result li { + margin: 2em auto; + } + #search-result a.search-result-title { + background-image: none; + color: #383838; + text-transform: capitalize; + font-weight: bold; + line-height: 1.2; + } + #search-result p.search-result { + overflow: hidden; + margin: 0.4em auto; + max-height: 13em; + text-align: justify; + font-size: 0.8em; + } + #search-result em.search-keyword { + border-bottom: 1px dashed #d480aa; + color: #d480aa; + font-weight: bold; + } + .search-no-result { + display: none; + padding-bottom: 0.5em; + color: #383838; + } + #tag-cloud .tag-cloud-title { + color: #666; + } + #tag-cloud .tag-cloud-tags { + clear: both; + text-align: center; + } + #tag-cloud .tag-cloud-tags a { + display: inline-block; + margin: 10px; + } + .tooltipped { + position: relative; + } + .tooltipped::after { + position: absolute; + z-index: 1000000; + display: none; + padding: 0.2em 0.5em; + -webkit-font-smoothing: subpixel-antialiased; + color: #fff; + font-display: swap; + font-weight: 400; + font-size: 11.200000000000001px; + font-family: "JetBrains Mono", monospace; + line-height: 1.725; + text-rendering: geometricPrecision; + text-align: center; + word-wrap: break-word; + white-space: pre; + content: attr(aria-label); + background: #383838; + border-radius: 3px; + opacity: 0; + } + .tooltipped::before { + position: absolute; + z-index: 1000001; + display: none; + width: 0; + height: 0; + color: #383838; + pointer-events: none; + content: ''; + border: 6px solid transparent; + opacity: 0; + } + .tooltipped:hover::before, + .tooltipped:active::before, + .tooltipped:focus::before, + .tooltipped:hover::after, + .tooltipped:active::after, + .tooltipped:focus::after { + display: inline-block; + text-decoration: none; + animation-name: tooltip-appear; + animation-duration: 0.1s; + animation-fill-mode: forwards; + animation-timing-function: ease-in; + } + .tooltipped-s::after, + .tooltipped-sw::after { + top: 100%; + right: 50%; + margin-top: 6px; + } + .tooltipped-s::before, + .tooltipped-sw::before { + top: auto; + right: 50%; + bottom: -7px; + margin-right: -6px; + border-bottom-color: #383838; + } + .tooltipped-sw::after { + margin-right: -16px; + } + .tooltipped-s::after { + transform: translateX(50%); + } + @-moz-keyframes tooltip-appear { + from { + opacity: 0; + } + to { + opacity: 1; + } + } + @-webkit-keyframes tooltip-appear { + from { + opacity: 0; + } + to { + opacity: 1; + } + } + @-o-keyframes tooltip-appear { + from { + opacity: 0; + } + to { + opacity: 1; + } + } + @keyframes tooltip-appear { + from { + opacity: 0; + } + to { + opacity: 1; + } + } + #categories .category-list-title { + color: #666; + } + #categories .category-list .category-list-item .category-list-count { + color: #666; + } + #categories .category-list .category-list-item .category-list-count:before { + content: " ("; + } + #categories .category-list .category-list-item .category-list-count:after { + content: ")"; + } + .highlight { + background: #2b2b2b; + color: #bababa; + } + .highlight .code .strong, + .highlight .code .emphasis { + color: #a8a8a2; + } + .highlight .code .bullet, + .highlight .code .quote, + .highlight .code .link, + .highlight .code .number, + .highlight .code .regexp, + .highlight .code .literal { + color: #6896ba; + } + .highlight .code .code, + .highlight .code .selector-class { + color: #a6e22e; + } + .highlight .code .emphasis { + font-style: italic; + } + .highlight .code .keyword, + .highlight .code .selector-tag, + .highlight .code .section, + .highlight .code .attribute, + .highlight .code .name, + .highlight .code .variable { + color: #cb7832; + } + .highlight .code .params { + color: #b9b9b9; + } + .highlight .code .string, + .highlight .code .subst, + .highlight .code .type, + .highlight .code .built_in, + .highlight .code .builtin-name, + .highlight .code .symbol, + .highlight .code .selector-id, + .highlight .code .selector-attr, + .highlight .code .selector-pseudo, + .highlight .code .template-tag, + .highlight .code .template-variable, + .highlight .code .addition { + color: #e0c46c; + } + .highlight .code .comment, + .highlight .code .deletion, + .highlight .code .meta { + color: #7f7f7f; + } + pre { + overflow-x: auto; + padding: 10px 15px; + padding-bottom: 0; + border: 1px dotted #666; + border-radius: 4px; + font-size: 13px; + font-family: "JetBrains Mono", monospace; + line-height: 22px; + -webkit-border-radius: 4px; + } + pre code { + display: block; + padding: 0; + border: none; + } + code { + padding: 0 5px; + border: 1px dotted #666; + border-radius: 2px; + -webkit-border-radius: 2px; + } + .highlight { + overflow-x: auto; + margin: 1rem 0; + padding: 10px 15px; + border-radius: 4px; + background: #fafafa; + font-family: "JetBrains Mono", monospace; + -webkit-border-radius: 4px; + } + .highlight figcaption { + margin: -5px 0 5px; + color: #757575; + font-size: 0.9em; + zoom: 1; + } + .highlight figcaption a { + float: right; + color: #757575; + font-style: italic; + font-size: 0.8em; + background-image: linear-gradient(transparent, transparent 10px, #d480aa 10px, #d480aa); + background-position: bottom; + background-size: 100% 6px; + background-repeat: repeat-x; + } + .highlight figcaption a:hover { + color: #919191; + } + .highlight figcaption:before, + .highlight figcaption content: "" { + display: table; + } + .highlight figcaption:after { + clear: both; + } + .highlight:hover .btn-copy { + opacity: 1; + } + .highlight .btn-copy { + font-size: 1.2rem; + position: absolute; + right: 20px; + opacity: 0; + transition: opacity 0.2s ease-in; + } + .highlight .btn-copy:hover { + color: #2bbc8a; + } + .highlight pre { + margin: 0; + padding: 0; + border: none; + background: none; + } + .highlight table { + width: auto; + } + .highlight td.gutter { + text-align: right; + opacity: 0.2; + } + .highlight .line { + height: 22px; + }
\ No newline at end of file |