Something went wrong. Try again.
Monorepo for Aesthetic.Computer aesthetic.computer
Something went wrong. Try again.
CSS
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104/* Dark theme (default) - aesthetic.computer inspired */:root { --bg: rgb(0, 0, 0); --fg: rgb(166, 201, 208); --wrapper-bg: rgba(0, 0, 0, 0.8); --link: rgb(100, 180, 255); --link-visited: rgb(140, 120, 180); --link-hover: rgb(255, 200, 100); --link-active: rgb(255, 150, 200); --mark-color: rgb(166, 201, 208); --mark-bg: black; --hr-bg: rgb(20, 30, 40); --hr-border: rgb(100, 150, 180);}
/* Light theme */@media (prefers-color-scheme: light) { :root { --bg: rgb(250, 248, 245); --fg: rgb(30, 30, 30); --wrapper-bg: rgba(250, 248, 245, 0.9); --link: rgb(0, 80, 180); --link-visited: rgb(80, 40, 120); --link-hover: rgb(200, 80, 0); --link-active: rgb(180, 0, 0); --mark-color: rgb(0, 100, 120); --mark-bg: rgb(220, 240, 245); --hr-bg: rgb(220, 215, 210); --hr-border: rgb(180, 175, 170); }}
#aesthetic { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; border: 0;}
html { height: 100%;}
body { font-size: 100%; margin: 0; font-family: monospace; background-color: var(--bg); color: var(--fg); -webkit-text-size-adjust: none;}
#wrapper { background: var(--wrapper-bg); padding: 0.5em 0.5em 0.05em 0.5em;}
a,a:visited:hover { color: var(--link);}
a:active,a:visited:active { color: var(--link-active);}
a:visited { color: var(--link-visited);}
a:hover { color: var(--link-hover);}
h1,h2 { font-size: 1em;}
mark { color: var(--mark-color); background: var(--mark-bg);}
hr { margin-top: 0.5em; width: calc(100% + 1em); margin-left: -0.5em; height: 6px; border-left: none; border-right: none; border-width: 2px; background-color: var(--hr-bg); border-color: var(--hr-border);}
ol { padding-left: 1.8em; list-style-type: lower-alpha;}