/**
* Theme Definitions
*/
:root {
--body-bg: #3f3f3f;
--bg: #1f1f1f;
--fg: #d4d4d4;
--directory: #83a06c;
--prompt: #83a06c;
--cursor: var(--fg);
--listItem: var(--fg);
--listTitle: var(--fg);
--link: var(--fg);
--tree: var(--fg);
--fontSize: 13px;
--fontFamily: "Source Code Pro Light", monospace;
}
/*
'#000000', // black
'#cd0000', // red3
'#00cd00', // green3
'#cdcd00', // yellow3
'#0000ee', // blue2
'#cd00cd', // magenta3
'#00cdcd', // cyan3
'#e5e5e5', // gray90
*/
terminal.dark {
--body-bg: #f3f3f3;
--bg: #fefefe;
--fg: #1e1e1e;
--dir: #526e39;
--prompt: #526e39;
--cursor: var(--fg);
--listItem: var(--fg);
--listTitle: var(--fg);
--link: var(--fg);
--tree: var(--fg);
--selection: #999;
--cursor: var(--prompt);
--dir: #ffcb8b;
--path: #D86C74;
--host: #CD9A61;
--user: #CD9A61;
--success: #25cc3e;
--warn: #ffbf2f;
--error: #ff6159;
--info: #00d2ff;
--at: #ccc;
--cmd: #f4bf75;
--parameter: #6a9fb5;
--file: #5ed7ff;
}
terminal.light {
--body-bg: #f3f3f3;
--bg: #fefefe;
--fg: #1e1e1e;
--dir: #526e39;
--prompt: #526e39;
--cursor: var(--fg);
--listItem: var(--fg);
--listTitle: var(--fg);
--link: var(--fg);
--tree: var(--fg);
--selection: #999;
--cursor: var(--prompt);
--dir: #ffcb8b;
--path: #D86C74;
--host: #CD9A61;
--user: #CD9A61;
--success: #25cc3e;
--warn: #ffbf2f;
--error: #ff6159;
--info: #00d2ff;
--at: #ccc;
--cmd: #f4bf75;
--parameter: #6a9fb5;
--file: #5ed7ff;
}
terminal.laserwave {
--body-bg: #1c1720;
--bg: #27212e;
--fg: #ffffff;
--dir: #40b4c4;
--prompt: #eb64b9;
--cursor: var(--prompt);
--listItem: var(--fg);
--listTitle: var(--fg);
--link: var(--fg);
--tree: var(--fg);
--selection: #999;
--cursor: var(--prompt);
--dir: #ffcb8b;
--path: #aa759f;
--host: #61d6d6;
--user: #90a959;
--success: #25cc3e;
--warn: #ffbf2f;
--error: #ff6159;
--info: #00d2ff;
--at: #ccc;
--cmd: #f4bf75;
--parameter: #6a9fb5;
--file: #5ed7ff;
}
terminal.nord {
--body-bg: #2e3440;
--bg: #2E3440;
--fg: #E5E9F0;
--dir: #EBCB8B;
--prompt: #E5E9F0;
--cursor: #88c0d0;
--listItem: var(--fg);
--listTitle: var(--fg);
--link: var(--fg);
--tree: var(--fg);
--selection: #999;
--cursor: var(--prompt);
--dir: #ffcb8b;
--path: #EBCB8B;
--host: #D08770;
--user: #BF616A;
--success: #25cc3e;
--warn: #ffbf2f;
--error: #ff6159;
--info: #88C0D0;
--at: #A3BE8C;
--cmd: #f4bf75;
--parameter: #6a9fb5;
--file: #5ed7ff;
}
terminal.dracula {
--body-bg: #191a20;
--bg: #282936;
--fg: #E9E9F4;
--dir: #8be9fd;
--prompt: #e97fc0;
--cursor: #6272a4;
--listItem: var(--fg);
--listTitle: var(--fg);
--link: var(--fg);
--tree: var(--fg);
--selection: #999;
--cursor: var(--prompt);
--dir: #ffcb8b;
--path: #62D6E8;
--host: #00F769;
--user: #EBFF87;
--success: #25cc3e;
--warn: #ffbf2f;
--error: #ff6159;
--info: #00d2ff;
--at: #ccc;
--cmd: #f4bf75;
--parameter: #6a9fb5;
--file: #5ed7ff;
}
terminal.greyscale {
--body-bg: #2a2a2a;
--bg: #1d1d1d;
--fg: #fff;
--dir: #888;
--prompt: #7a7a7a;
--cursor: var(--prompt);
--listItem: var(--fg);
--listTitle: var(--fg);
--link: var(--fg);
--tree: var(--fg);
--selection: #999;
--cursor: var(--prompt);
--dir: #ffcb8b;
--path: #aa759f;
--host: #61d6d6;
--user: #90a959;
--success: #25cc3e;
--warn: #ffbf2f;
--error: #ff6159;
--info: #00d2ff;
--at: #ccc;
--cmd: #f4bf75;
--parameter: #6a9fb5;
--file: #5ed7ff;
}
terminal.nightowl {
--body-bg: #00101d;
--bg: #011627;
--fg: #d6deeb;
--listItem: var(--fg);
--listTitle: var(--fg);
--link: var(--fg);
--tree: var(--fg);
--prompt: #c792ea;
--selection: #999;
--cursor: var(--prompt);
--dir: #ffcb8b;
--path: #aa759f;
--host: #61d6d6;
--user: #90a959;
--success: #25cc3e;
--warn: #ffbf2f;
--error: #ff6159;
--info: #00d2ff;
--at: #ccc;
--cmd: #f4bf75;
--parameter: #6a9fb5;
--file: #5ed7ff;
}
terminal.onedark {
--body-bg: #00101d;
--bg: #282C34;
--fg: #ABB2BF;
--listItem: var(--fg);
--listTitle: var(--fg);
--link: var(--fg);
--tree: var(--fg);
--prompt: #528BFF;
--selection: #ABB2BF;
--cursor: var(--prompt);
--dir: #D86C74;
--path: var(--prompt);
--host: #CD9A61;
--user: #D86C74;
--success: #98C379;
--warn: #D19A66;
--error: red;
--info: #667689;
--at: #ABB2BF;
--cmd: #D86C74;
--parameter: #ABB2BF;
--file: #D86C74;
}
/**
* Terminal Default Styling
*/
body {
width: 100vw;
height: 100vh;
overflow: hidden;
background-color: var(--body-bg);
color: var(--fg);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-family: var(--fontFamily);
font-size: var(--fontSize);
}
terminal {
background-color: var(--bg);
box-sizing: border-box;
width: 700px;
height: 450px;
box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.6);
border-radius: 4px;
padding-top: 0.5em;
padding-bottom: 0.5em;
padding-left: 1.5em;
padding-right: 0.25em;
margin: 0;
line-height: 1.15;
font-size: var(--fontSize);
}
::-webkit-scrollbar {
width: 22px;
}
::-webkit-scrollbar-track {
background: var(--bg);
}
::-webkit-scrollbar-thumb {
background-color: var(--fg) ;
border-radius: 10px;
border: 8px solid var(--bg);
}
::-webkit-scrollbar-thumb:window-inactive {
background: rgba(100,100,100,0.4);
}
terminal .container {
box-sizing: border-box;
width: 100%;
height: 415px;
overflow-y: scroll;
overflow-x: hidden;
scrollbar-width: thin;
cursor: default;
scrollbar-color: var(--fg) var(--bg);
}
terminal .container a {
color: var(--path);
text-decoration-line: underline;
text-decoration-thickness: from-font;
text-decoration-style: dotted;
}
terminal .container a:hover {
color: var(--path);
text-decoration: none;
}
/**
* Prompt Styling
*/
.prompt {
display: flex;
}
terminal ::selection {
background: var(--selection);
text-shadow: none !important;
}
terminal .container .cursor {
color: var(--cursor);
}
terminal .container .path {
color: var(--path);
}
terminal .container .host {
color: var(--host);
}
terminal .container .user {
color: var(--user);
}
terminal .container .success {
color: var(--success);
}
terminal .container .warn {
color: var(--warn);
}
terminal .container .error {
color: var(--error);
}
terminal .container .info {
color: var(--info);
}
terminal .container .at {
color: var(--at);
}
terminal .container .cmd {
color: var(--cmd);
}
terminal .container .parameter {
color: var(--parameter);
}
terminal .container .dir {
color: var(--dir);
}
terminal .container .file {
color: var(--file);
}
terminal .container.blink::after {
content: "|";
animation: blink 1.25s steps(1) infinite;
}
@keyframes blink {
50% {
color: transparent;
}
}
#scsaver main {
display: flex;
}
#scsaver p {
line-height: 1;
}
#scsaver span {
display: block;
width: 2vmax;
height: 2vmax;
font-size: 2vmax;
color: #9bff9b11;
text-align: center;
font-family: monospace;
}