1 line
5.1 KiB
CSS
1 line
5.1 KiB
CSS
|
:root{--sans-font:-apple-system,BlinkMacSystemFont,"Avenir Next",Avenir,"Nimbus Sans L",Roboto,Noto,"Segoe UI",Arial,Helvetica,"Helvetica Neue",sans-serif;--mono-font:Consolas,Menlo,Monaco,"Andale Mono","Ubuntu Mono",monospace;--base-fontsize:1.15rem;--header-scale:1.25;--line-height:1.618;--bg:#FFF;--accent-bg:#F5F7FF;--text:#212121;--text-light:#585858;--border:#D8DAE1;--accent:#0D47A1;--accent-light:#90CAF9;--code:#D81B60;--preformatted:#444;--marked:#FFDD33;--disabled:#EFEFEF}@media (prefers-color-scheme:dark){:root{--bg:#212121;--accent-bg:#2B2B2B;--text:#DCDCDC;--text-light:#ABABAB;--border:#666;--accent:#FFB300;--accent-light:#FFECB3;--code:#F06292;--preformatted:#CCC;--disabled:#111}img,video{opacity:.6}}*{font-family:var(--sans-font)}html{font-size:16px}body{color:var(--text);background:var(--bg);font-size:var(--base-fontsize);line-height:var(--line-height);margin:0}main{margin:1rem auto 0;max-width:45rem;padding:0 .5rem}header{background:var(--accent-bg);border-bottom:1px solid var(--border);padding:1.5rem 15rem;margin-bottom:3rem}@media only screen and (max-width:1200px){header{padding:1rem}nav{text-align:center}}header h1,header p{margin:0}header h1{line-height:1.1}nav{font-size:1rem;line-height:2;padding:1rem 0}nav a{margin:1rem 1rem 0 0;border:1px solid var(--border);border-radius:5px;color:var(--text)!important;display:inline-block;padding:.1rem 1rem;text-decoration:none;transition:.4s}nav a:hover{color:var(--accent)!important;border-color:var(--accent)}nav a.current:hover{text-decoration:none}footer{margin-top:4rem;padding:2rem 1rem 1.5rem 1rem;color:var(--text-light);font-size:.9rem;text-align:center;border-top:1px solid var(--border)}h1{font-size:calc(var(--base-fontsize) * var(--header-scale) * var(--header-scale) * var(--header-scale) * var(--header-scale));margin-top:calc(var(--line-height) * 1.5rem)}h2{font-size:calc(var(--base-fontsize) * var(--header-scale) * var(--header-scale) * var(--header-scale));margin-top:calc(var(--line-height) * 1.5rem)}h3{font-size:calc(var(--base-fontsize) * var(--header-scale) * var(--header-scale));margin-top:calc(var(--line-height) * 1.5rem)}h4{font-size:calc(var(--base-fontsize) * var(--header-scale));margin-top:calc(var(--line-height) * 1.5rem)}h5{font-size:var(--base-fontsize);margin-top:calc(var(--line-height) * 1.5rem)}h6{font-size:calc(var(--base-fontsize)/ var(--header-scale));margin-top:calc(var(--line-height) * 1.5rem)}a,a:visited{color:var(--accent)}a:hover{text-decoration:none}a button,button,input[type=button],input[type=reset],input[type=submit]{border:none;border-radius:5px;background:var(--accent);font-size:1rem;color:var(--bg);padding:.7rem .9rem;margin:.5rem 0;transition:.4s}a button[disabled],button[disabled],input[type=button][disabled],input[type=reset][disabled],input[type=submit][disabled]{cursor:default;opacity:.5;cursor:not-allowed}input:disabled,textarea:disabled{cursor:not-allowed;background:var(--disabled)}input[type=range]{padding:0}abbr{cursor:help}button:enabled:hover,button:focus,input[type=button]:enabled:hover,input[type=button]:focus,input[type=reset]:enabled:hover,input[type=reset]:focus,input[type=submit]:enabled:hover,input[type=submit]:focus{opacity:.8}details{padding:.6rem 1rem;background:var(--accent-bg);border:1px solid var(--border);border-radius:5px;margin-bottom:1rem}summary{cursor:pointer;font-weight:700}details[open]{padding-bottom:.75rem}details[open] summary{margin-bottom:.5rem}details[open]>:last-child{margin-bottom:0}table{border-collapse:collapse;width:100%}td,th{border:1px solid var(--border);text-align:left;padding:.5rem}th{background:var(--accent-bg);font-weight:700}tr:nth-child(even){background:var(--accent-bg)}table caption{font-weight:700;margin-bottom:.5rem}ol,ul{padding-left:3rem}input,select,textarea{font-size:inherit;font-family:inherit;padding:.5rem;margin-bottom:.5rem;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:5px;box-shadow:none;box-sizing:border-box;width:60%;appearance:none;-moz-appearance:none;-webkit-appearance:none}textarea{width:80%}@media only screen and (
|