organise repo
This commit is contained in:
parent
345c1b592e
commit
b03962ec0a
7 changed files with 7 additions and 117 deletions
1
.gitignore
vendored
1
.gitignore
vendored
|
|
@ -1,2 +1,3 @@
|
||||||
bake/
|
bake/
|
||||||
.sass-cache/
|
.sass-cache/
|
||||||
|
sandbox/
|
||||||
|
|
|
||||||
|
|
@ -1,110 +0,0 @@
|
||||||
.centered {
|
|
||||||
position: absolute;
|
|
||||||
inset: 0 0 0 0;
|
|
||||||
margin: auto;
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
|
|
||||||
.heading {
|
|
||||||
font-family: monospace;
|
|
||||||
font-size: 2em;
|
|
||||||
font-weight: bold;
|
|
||||||
color: #ffc0cb; /* #ac4aed */
|
|
||||||
}
|
|
||||||
|
|
||||||
/* =========================================================== *
|
|
||||||
* Type Writer Effect *
|
|
||||||
/* =========================================================== */
|
|
||||||
|
|
||||||
#typing-wrapper {
|
|
||||||
margin: auto auto;
|
|
||||||
width: 71ch; /* prompt + command + cursor length */
|
|
||||||
height: 21ch;
|
|
||||||
text-align: start;
|
|
||||||
|
|
||||||
border: 0.5ch solid #ffc0cb; /* #ac4aed */
|
|
||||||
background-color: #0e0d14;
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: start;
|
|
||||||
align-content: center;
|
|
||||||
align-items: start;
|
|
||||||
}
|
|
||||||
|
|
||||||
#typing-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;
|
|
||||||
overflow: hidden;
|
|
||||||
border-right: 1ch solid;
|
|
||||||
margin-bottom: 0.5ch;
|
|
||||||
}
|
|
||||||
|
|
||||||
#typing-result {
|
|
||||||
/* "4.8s" means the result is shown 1.8s after typing ends */
|
|
||||||
animation: unhide 1s 1.8s forwards;
|
|
||||||
visibility: hidden;
|
|
||||||
white-space: nowrap; /* preserve linebreaks */
|
|
||||||
}
|
|
||||||
|
|
||||||
#typing-prompt-segfault {
|
|
||||||
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;
|
|
||||||
white-space: nowrap;
|
|
||||||
overflow: hidden;
|
|
||||||
border-right: 1ch solid;
|
|
||||||
margin-bottom: 0.5ch;
|
|
||||||
visibility: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
#typing-result-segfault {
|
|
||||||
/* "4.8s" means the result is shown 1.8s after typing ends */
|
|
||||||
animation: unhide 1s 8.3s forwards;
|
|
||||||
visibility: hidden;
|
|
||||||
white-space: nowrap; /* preserve linebreaks */
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes kfs-typing {
|
|
||||||
from {
|
|
||||||
width: 6ch; /* ignore prompt width */
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes kfs-typing-segfault {
|
|
||||||
from {
|
|
||||||
width: 11ch; /* ignore prompt width */
|
|
||||||
visibility: visible;
|
|
||||||
}
|
|
||||||
to {
|
|
||||||
visibility: visible;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes kfs-cursor-blink {
|
|
||||||
from {
|
|
||||||
border-color: transparent;
|
|
||||||
}
|
|
||||||
50% {
|
|
||||||
border-color: currentColor;
|
|
||||||
}
|
|
||||||
to {
|
|
||||||
border-color: transparent;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes cursor-blink-segfault {
|
|
||||||
50% {
|
|
||||||
border-color: transparent;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes unhide {
|
|
||||||
to {
|
|
||||||
visibility: visible;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
@ -1,9 +1,3 @@
|
||||||
html, body {
|
|
||||||
height: 100%;
|
|
||||||
margin: 0;
|
|
||||||
background-color: #0e0d14;
|
|
||||||
}
|
|
||||||
|
|
||||||
.centered {
|
.centered {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
inset: 0 0 0 0;
|
inset: 0 0 0 0;
|
||||||
|
|
@ -30,6 +24,7 @@ html, body {
|
||||||
text-align: start;
|
text-align: start;
|
||||||
|
|
||||||
border: 0.5ch solid #ffc0cb; /* #ac4aed */
|
border: 0.5ch solid #ffc0cb; /* #ac4aed */
|
||||||
|
background-color: #0e0d14;
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
|
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
@ -84,6 +79,9 @@ html, body {
|
||||||
width: 11ch; /* ignore prompt width */
|
width: 11ch; /* ignore prompt width */
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
}
|
}
|
||||||
|
25% {
|
||||||
|
width: 11ch;
|
||||||
|
}
|
||||||
to {
|
to {
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
}
|
}
|
||||||
|
|
@ -112,3 +110,4 @@ html, body {
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -11,7 +11,7 @@
|
||||||
<!-- defer></script> -->
|
<!-- defer></script> -->
|
||||||
<script src="js/webgl-demo.js" type="module"></script>
|
<script src="js/webgl-demo.js" type="module"></script>
|
||||||
<link rel="stylesheet" href="css/shader-style.css">
|
<link rel="stylesheet" href="css/shader-style.css">
|
||||||
<link rel="stylesheet" href="css/typing-merge.css">
|
<link rel="stylesheet" href="css/typing.css">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue