roadmap/index.css

1 line
16 KiB
CSS

:root{--shiki-color-text:#24292e;--shiki-color-background:#f8f8f8;--shiki-token-constant:#005cc5;--shiki-token-string:#032f62;--shiki-token-comment:#6a737d;--shiki-token-keyword:#d73a49;--shiki-token-parameter:#24292e;--shiki-token-function:#24292e;--shiki-token-string-expression:#22863a;--shiki-token-punctuation:#24292e;--shiki-token-link:#24292e}[saved-theme=dark]{--shiki-color-text:#e1e4e8!important;--shiki-color-background:#24292e!important;--shiki-token-constant:#79b8ff!important;--shiki-token-string:#9ecbff!important;--shiki-token-comment:#6a737d!important;--shiki-token-keyword:#f97583!important;--shiki-token-parameter:#e1e4e8!important;--shiki-token-function:#e1e4e8!important;--shiki-token-string-expression:#85e89d!important;--shiki-token-punctuation:#e1e4e8!important;--shiki-token-link:#e1e4e8!important}.callout{border:1px solid var(--border);background-color:var(--bg);box-sizing:border-box;border-radius:5px;padding:0 1rem;transition:max-height .3s;overflow-y:hidden}.callout>:nth-child(2){margin-top:0}.callout[data-callout=note]{--color:#448aff;--border:#448aff44;--bg:#448aff10}.callout[data-callout=abstract]{--color:#00b0ff;--border:#00b0ff44;--bg:#00b0ff10}.callout[data-callout=info],.callout[data-callout=todo]{--color:#00b8d4;--border:#00b8d444;--bg:#00b8d410}.callout[data-callout=tip]{--color:#00bfa5;--border:#00bfa544;--bg:#00bfa510}.callout[data-callout=success]{--color:#09ad7a;--border:#09ad7144;--bg:#09ad7110}.callout[data-callout=question]{--color:#dba642;--border:#dba64244;--bg:#dba64210}.callout[data-callout=warning]{--color:#db8942;--border:#db894244;--bg:#db894210}.callout[data-callout=failure],.callout[data-callout=danger],.callout[data-callout=bug]{--color:#db4242;--border:#db424244;--bg:#db424210}.callout[data-callout=example]{--color:#7a43b5;--border:#7a43b544;--bg:#7a43b510}.callout[data-callout=quote]{--color:var(--secondary);--border:var(--lightgray)}.callout.is-collapsed>.callout-title>.fold{transform:rotate(-90deg)}.callout-title{color:var(--color);align-items:center;gap:5px;padding:1rem 0;display:flex}.callout-title .fold{opacity:.8;cursor:pointer;margin-left:.5rem;transition:transform .3s}.callout-title>.callout-title-inner>p{color:var(--color);margin:0}.callout-icon{width:18px;height:18px}.callout-title-inner{font-weight:700}html{scroll-behavior:smooth;-webkit-text-size-adjust:none;-moz-text-size-adjust:none;text-size-adjust:none;width:100vw;overflow-x:hidden}body,section{box-sizing:border-box;background-color:var(--light);font-family:var(--bodyFont);color:var(--darkgray);max-width:100%;margin:0}.text-highlight{background-color:#fff23688;border-radius:5px;padding:0 .1rem}p,ul,text,a,tr,td,li,ol,ul,.katex,.math{color:var(--darkgray);fill:var(--darkgray);overflow-wrap:anywhere;-webkit-hyphens:auto;hyphens:auto}.math.math-display{text-align:center}a{color:var(--secondary);font-weight:600;text-decoration:none;transition:color .2s}a:hover{color:var(--tertiary)!important}a.internal{background-color:var(--highlight);border-radius:5px;padding:0 .1rem;text-decoration:none}.desktop-only{display:initial}@media (max-width:1510px){.desktop-only{display:none}}.mobile-only{display:none}@media (max-width:1510px){.mobile-only{display:initial}.page{max-width:750px;margin:0 auto;padding:0 1rem}}.page article>h1{font-size:2rem}.page article li:has(>input[type=checkbox]){padding-left:0;list-style-type:none}.page article li:has(>input[type=checkbox]:checked){text-decoration:line-through;-webkit-text-decoration-color:var(--gray);text-decoration-color:var(--gray);color:var(--gray)}.page article li>*{margin-top:0;margin-bottom:0}.page article p>strong{color:var(--dark)}.page>#quartz-body{width:100%;display:flex}@media (max-width:1510px){.page>#quartz-body{flex-direction:column}}.page>#quartz-body .sidebar{box-sizing:border-box;flex-direction:column;flex:1;gap:2rem;width:380px;margin-top:6rem;padding:0 4rem;display:flex;position:fixed;top:0}@media (max-width:1510px){.page>#quartz-body .sidebar{position:initial;width:initial;flex-direction:row;margin-top:2rem;padding:0}}.page>#quartz-body .sidebar.left{left:calc(50vw - 755px)}@media (max-width:1510px){.page>#quartz-body .sidebar.left{align-items:center;gap:0}}.page>#quartz-body .sidebar.right{right:calc(50vw - 755px)}@media (max-width:1510px){.page>#quartz-body .sidebar.right>*{flex:1}}.page .page-header{width:750px;margin:6rem auto 0}@media (max-width:1510px){.page .page-header{width:initial;margin-top:2rem}}.page .center,.page footer{width:750px;margin-left:auto;margin-right:auto}@media (max-width:1510px){.page .center,.page footer{width:initial;margin-left:0;margin-right:0}}.footnotes{border-top:1px solid var(--lightgray);margin-top:2rem}input[type=checkbox]{color:var(--secondary);border:1px solid var(--lightgray);background-color:var(--light);appearance:none;border-radius:3px;width:16px;height:16px;margin-inline:-1.4rem .2rem;position:relative;transform:translateY(2px)}input[type=checkbox]:checked{border-color:var(--secondary);background-color:var(--secondary)}input[type=checkbox]:checked:after{content:"";border:solid var(--light);border-width:0 2px 2px 0;width:4px;height:8px;display:block;position:absolute;top:1px;left:4px;transform:rotate(45deg)}blockquote{border-left:3px solid var(--secondary);margin:1rem 0;padding-left:1rem;transition:border-color .2s}h1,h2,h3,h4,h5,h6,thead{font-family:var(--headerFont);color:var(--dark);font-weight:revert;margin-bottom:0}article>h1>a,article>h2>a,article>h3>a,article>h4>a,article>h5>a,article>h6>a,article>thead>a{color:var(--dark)}article>h1>a.internal,article>h2>a.internal,article>h3>a.internal,article>h4>a.internal,article>h5>a.internal,article>h6>a.internal,article>thead>a.internal{background-color:#0000}h1[id]>a[href^=\#],h2[id]>a[href^=\#],h3[id]>a[href^=\#],h4[id]>a[href^=\#],h5[id]>a[href^=\#],h6[id]>a[href^=\#]{opacity:0;font-family:var(--codeFont);-webkit-user-select:none;user-select:none;margin:0 .5rem;transition:opacity .2s;display:inline-block;transform:translateY(-.1rem)}h1[id]:hover>a,h2[id]:hover>a,h3[id]:hover>a,h4[id]:hover>a,h5[id]:hover>a,h6[id]:hover>a{opacity:1}h1{margin-top:2.25rem;margin-bottom:1rem;font-size:1.75rem}h2{margin-top:1.9rem;margin-bottom:1rem;font-size:1.4rem}h3{margin-top:1.62rem;margin-bottom:1rem;font-size:1.12rem}h4,h5,h6{margin-top:1.5rem;margin-bottom:1rem;font-size:1rem}div[data-rehype-pretty-code-fragment]{line-height:1.6rem;position:relative}div[data-rehype-pretty-code-fragment]>div[data-rehype-pretty-code-title]{font-family:var(--codeFont);border:1px solid var(--lightgray);color:var(--darkgray);border-radius:5px;width:max-content;margin-bottom:-.5rem;padding:.1rem .5rem;font-size:.9rem}div[data-rehype-pretty-code-fragment]>pre{padding:.5rem 0}pre{font-family:var(--codeFont);border:1px solid var(--lightgray);border-radius:5px;padding:.5rem;overflow-x:auto}pre:has(>code.mermaid){border:none}pre>code{counter-reset:line;counter-increment:line 0;background:0 0;padding:0;font-size:.85rem;display:grid}pre>code [data-highlighted-chars]{background-color:var(--highlight);border-radius:5px}pre>code>[data-line]{box-sizing:border-box;border-left:3px solid #0000;padding:0 .25rem}pre>code>[data-line][data-highlighted-line]{background-color:var(--highlight);border-left:3px solid var(--secondary)}pre>code>[data-line]:before{content:counter(line);counter-increment:line;text-align:right;color:#738a9499;width:1rem;margin-right:1rem;display:inline-block}pre>code[data-line-numbers-max-digits="2"]>[data-line]:before{width:2rem}pre>code[data-line-numbers-max-digits="3"]>[data-line]:before{width:3rem}code{color:var(--dark);font-size:.9em;font-family:var(--codeFont);background:var(--lightgray);border-radius:5px;padding:.1rem .2rem}tbody,li,p{line-height:1.6rem}table{border-collapse:collapse;margin:1rem;padding:1.5rem}table>*{line-height:2rem}th{text-align:left;border-bottom:2px solid var(--gray);padding:.4rem 1rem}td{padding:.2rem 1rem}tr{border-bottom:1px solid var(--lightgray)}tr:last-child{border-bottom:none}img{border-radius:5px;max-width:100%;margin:1rem 0}p>img+em{display:block;transform:translateY(-1rem)}hr{background-color:var(--lightgray);border:none;width:100%;height:1px;margin:2rem auto}audio,video{border-radius:5px;width:100%}.spacer{flex:auto}ul.overflow,ol.overflow{content:"";clear:both;height:300px;overflow-y:auto}ul.overflow>li:last-of-type,ol.overflow>li:last-of-type{margin-bottom:50px}ul.overflow:after,ol.overflow:after{pointer-events:none;content:"";opacity:1;background:linear-gradient(transparent 0px,var(--light));width:100%;height:50px;transition:opacity .3s;position:absolute;bottom:0;left:0}header{flex-direction:row;align-items:center;gap:1.5rem;margin:2rem 0;display:flex}header h1{flex:auto;margin:0}.clipboard-button{float:right;color:var(--gray);border-color:var(--dark);background-color:var(--light);z-index:1;opacity:0;border:1px solid;border-radius:5px;margin:-.2rem .3rem;padding:.4rem;transition:all .2s;display:flex;position:absolute;right:0}.clipboard-button>svg{fill:var(--light);filter:contrast(.3)}.clipboard-button:hover{cursor:pointer;border-color:var(--secondary)}.clipboard-button:focus{outline:0}pre:hover>.clipboard-button{opacity:1;transition:all .2s}.article-title{margin:2rem 0 0}.content-meta{color:var(--gray);margin-top:0}.tags{gap:.4rem;margin:1rem 0;padding-left:0;list-style:none;display:flex}.tags>li{white-space:nowrap;overflow-wrap:normal;margin:0;display:inline-block}a.tag-link{background-color:var(--highlight);border-radius:8px;padding:.2rem .5rem}.page-title{margin:0}.search{flex-grow:.3;min-width:-moz-fit-content;min-width:fit-content;max-width:14rem}.search>#search-icon{background-color:var(--lightgray);cursor:pointer;white-space:nowrap;border-radius:4px;align-items:center;height:2rem;display:flex}.search>#search-icon>div{flex-grow:1}.search>#search-icon>p{padding:0 1rem;display:inline}.search>#search-icon svg{cursor:pointer;width:18px;min-width:18px;margin:0 .5rem}.search>#search-icon svg .search-path{stroke:var(--darkgray);stroke-width:2px;transition:stroke .5s}.search>#search-container{contain:layout;z-index:999;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);width:100vw;height:100vh;display:none;position:fixed;top:0;left:0;overflow-y:auto}.search>#search-container.active{display:inline-block}.search>#search-container>#search-space{width:50%;margin-top:15vh;margin-left:auto;margin-right:auto}@media (max-width:1510px){.search>#search-container>#search-space{width:90%}}.search>#search-container>#search-space>*{background:var(--light);border-radius:5px;width:100%;margin-bottom:2em;box-shadow:0 14px 50px #1b21301f,0 10px 30px #1b213029}.search>#search-container>#search-space>input{box-sizing:border-box;font-family:var(--bodyFont);color:var(--dark);border:1px solid var(--lightgray);padding:.5em 1em;font-size:1.1em}.search>#search-container>#search-space>input:focus{outline:none}.search>#search-container>#search-space>#results-container .result-card{cursor:pointer;border:1px solid var(--lightgray);text-transform:none;text-align:left;background:var(--light);border-bottom:none;outline:none;width:100%;margin:0;padding:1em;font-family:inherit;font-size:100%;line-height:1.15;transition:background .2s}.search>#search-container>#search-space>#results-container .result-card .highlight{color:var(--secondary);font-weight:700}.search>#search-container>#search-space>#results-container .result-card:hover,.search>#search-container>#search-space>#results-container .result-card:focus{background:var(--lightgray)}.search>#search-container>#search-space>#results-container .result-card:first-of-type{border-top-left-radius:5px;border-top-right-radius:5px}.search>#search-container>#search-space>#results-container .result-card:last-of-type{border-bottom:1px solid var(--lightgray);border-bottom-right-radius:5px;border-bottom-left-radius:5px}.search>#search-container>#search-space>#results-container .result-card>h3{margin:0}.search>#search-container>#search-space>#results-container .result-card>p{margin-bottom:0}.darkmode{width:20px;height:20px;margin:0 10px;position:relative}.darkmode>.toggle{box-sizing:border-box;display:none}.darkmode svg{cursor:pointer;opacity:0;fill:var(--darkgray);width:20px;height:20px;transition:opacity .1s;position:absolute;top:calc(50% - 10px)}:root[saved-theme=dark] .toggle~label>#dayIcon{opacity:0}:root[saved-theme=dark] .toggle~label>#nightIcon,:root .toggle~label>#dayIcon{opacity:1}:root .toggle~label>#nightIcon{opacity:0}button#toc{text-align:left;cursor:pointer;color:var(--dark);background-color:#0000;border:none;align-items:center;padding:0;display:flex}button#toc h3{margin:0;font-size:1rem;display:inline-block}button#toc .fold{opacity:.8;margin-left:.5rem;transition:transform .3s}button#toc.collapsed .fold{transform:rotate(-90deg)}#toc-content{max-height:none;list-style:none;transition:max-height .5s;overflow:hidden}#toc-content.collapsed>.overflow:after{opacity:0}#toc-content ul{margin:.5rem 0;padding:0;list-style:none}#toc-content ul>li>a{color:var(--dark);opacity:.35;transition:opacity .5s,color .3s}#toc-content ul>li>a.in-view{opacity:.75}#toc-content .depth-0{padding-left:0}#toc-content .depth-1{padding-left:1rem}#toc-content .depth-2{padding-left:2rem}#toc-content .depth-3{padding-left:3rem}#toc-content .depth-4{padding-left:4rem}#toc-content .depth-5{padding-left:5rem}#toc-content .depth-6{padding-left:6rem}.graph>h3{margin:0;font-size:1rem}.graph>.graph-outer{border:1px solid var(--lightgray);box-sizing:border-box;border-radius:5px;height:250px;margin:.5em 0;position:relative;overflow:hidden}.graph>.graph-outer>#global-graph-icon{color:var(--dark);opacity:.5;cursor:pointer;background-color:#0000;border-radius:4px;width:18px;height:18px;margin:.3rem;padding:.2rem;transition:background-color .5s;position:absolute;top:0;right:0}.graph>.graph-outer>#global-graph-icon:hover{background-color:var(--lightgray)}.graph>#global-graph-outer{z-index:9999;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);width:100vw;height:100%;display:none;position:fixed;top:0;left:0;overflow:hidden}.graph>#global-graph-outer.active{display:inline-block}.graph>#global-graph-outer>#global-graph-container{border:1px solid var(--lightgray);background-color:var(--light);box-sizing:border-box;border-radius:5px;width:50vw;height:60vh;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}@media (max-width:1510px){.graph>#global-graph-outer>#global-graph-container{width:90%}}.backlinks{position:relative}.backlinks>h3{margin:0;font-size:1rem}.backlinks>ul{margin:.5rem 0;padding:0;list-style:none}.backlinks>ul>li>a{background-color:#0000}footer{text-align:left;opacity:.7;margin-bottom:4rem}footer ul{flex-direction:row;gap:1rem;margin:-1rem 0 0;padding:0;list-style:none;display:flex}ul.section-ul{margin-top:2em;padding-left:0;list-style:none}li.section-li{margin-bottom:1em}li.section-li>.section{grid-template-columns:6em 3fr 1fr;display:grid}@media (max-width:600px){li.section-li>.section>.tags{display:none}}li.section-li>.section>.tags{justify-self:end;margin-left:1rem}li.section-li>.section>.desc>h3>a{background-color:#0000}li.section-li>.section>.meta{opacity:.6;flex-basis:6em;margin:0}.popover .section{grid-template-columns:6em 1fr!important}.popover .section>.tags{display:none}.section h3,.section>.tags{margin:0}@keyframes dropin{0%{opacity:0;visibility:hidden}1%{opacity:0}to{opacity:1;visibility:visible}}.popover{z-index:999;visibility:hidden;opacity:0;padding:1rem;transition:opacity .3s,visibility .3s;position:absolute;overflow:visible}.popover>.popover-inner{font-weight:initial;line-height:normal;font-size:initial;font-family:var(--bodyFont);border:1px solid var(--lightgray);background-color:var(--light);border-radius:5px;width:30rem;max-height:20rem;padding:0 1rem 1rem;position:relative;overflow:auto;box-shadow:6px 6px 36px #00000040}.popover h1{font-size:1.5rem}@media (max-width:600px){.popover{display:none!important}}a:hover .popover,.popover:hover{animation:.3s .2s forwards dropin}:root{--light:#faf8f8;--lightgray:#e5e5e5;--gray:#b8b8b8;--darkgray:#4e4e4e;--dark:#2b2b2b;--secondary:#284b63;--tertiary:#84a59d;--highlight:#8f9fa926;--headerFont:"sans-serif",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;--bodyFont:"sans-serif",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;--codeFont:"IBM Plex Mono",ui-monospace,SFMono-Regular,SF Mono,Menlo,monospace}:root[saved-theme=dark]{--light:#000;--lightgray:#393639;--gray:#646464;--darkgray:#d4d4d4;--dark:#ebebec;--secondary:#7b97aa;--tertiary:#84a59d;--highlight:#8f9fa926}