use theme classes

This commit is contained in:
Emile Clark-Boman 2026-02-03 14:06:11 +10:00
parent 0210e00c68
commit dc2ec07b0a
2 changed files with 18 additions and 10 deletions

View file

@ -19,22 +19,25 @@
#typing-wrapper {
margin: auto auto;
width: 71ch; /* prompt + command + cursor length */
height: 21ch;
/* width: 71ch; /* prompt + command + cursor length */
/* height: 21ch; */
text-align: start;
border: 0.5ch solid #ffc0cb; /* #ac4aed */
background-color: #0e0d14;
background-color: var(--theme-bg);
padding: 20px;
overflow: hidden;
display: flex;
flex-direction: column;
justify-content: start;
align-content: center;
align-items: start;
animation: kfs-ending 2s 10s forwards;
}
#typing-prompt {
color: var(--theme-tty-prompt);
width: 10ch; /* prompt + command length */
animation: kfs-typing 0.5s steps(4), kfs-cursor-blink 1.2s steps(1, start) 0.6s forwards;
white-space: nowrap;
@ -44,6 +47,7 @@
}
#typing-result {
color: var(--theme-tty-warning);
/* "4.8s" means the result is shown 1.8s after typing ends */
animation: unhide 1s 1.8s forwards;
visibility: hidden;
@ -51,6 +55,7 @@
}
#typing-prompt-segfault {
color: var(--theme-tty-prompt);
width: 47ch; /* prompt + command length */
/* animation: kfs-typing-segfault 3s steps(36) 2.6s, cursor-blink 0.6s steps(1, start) 3s infinite alternate; */
animation: kfs-typing-segfault 3s steps(36) 4s forwards, cursor-blink-segfault 0.6s steps(1, start) 7.1s infinite alternate;