sitix doesn't erase huge amounts of data unless you do something dumb. but I have done dumb things before. so I'm backing this up, rather than losing it.

2024-03-09 15:07:24 -05:00
commit daefcaf567
45 changed files with 1015 additions and 0 deletions
--- a/output/res/main.css
+++ b/output/res/main.css
@@ -0,0 +1,200 @@
+*, body, html {
+    margin: 0px;
+    padding: 0px;
+    font-family: Lato, Arial, Helvetica, sans-serif;
+}
+
+img {
+    max-width: 100%;
+    max-height: 100%;
+}
+
+#nav {
+    position: sticky;
+    top: 0px;
+    box-shadow: 0px 0px 5px black;
+    padding: 3px;
+    background-color: white;
+    z-index: 2;
+}
+
+#nav > div {
+    padding-top: 0px;
+    padding-bottom: 0px;
+    transition: padding 0.5s;
+    text-align: center;
+}
+
+#nav > a {
+    top: 0px;
+    position: absolute;
+    height: 100%;
+}
+
+#nav:hover > div {
+    padding-top: 10px;
+    padding-bottom: 10px;
+}
+
+div.text {
+    padding-top: 50px;
+    padding-bottom: 50px;
+    padding-left: 15vw;
+    padding-right: 15vw;
+}
+
+#bottom {
+    box-shadow: 0px 0px 5px black;
+    padding: 50px;
+    display: grid;
+    grid-template-areas: 'top top top'
+    'line1 line2 line3';
+    margin-top: 50px;
+}
+
+#bottom > div:first-child {
+    grid-area: top;
+    text-align: center;
+}
+
+#bottom > div:first-child > a {
+    display: inline-block;
+    height: 2em;
+}
+
+#bottom > div:first-child > span {
+    transform: translateY(-1em);
+}
+
+#bottom > div:first-child > a > img {
+    height: 100%;
+}
+
+#bottom > div:first-child > * {
+    margin: 10px;
+}
+
+a {
+    text-decoration: none;
+    color: #666666;
+}
+
+a:hover {
+    color: #999999;
+}
+
+#main {
+    min-height: 100vh;
+}
+
+.text.scrolly {
+    transform: translateX(-200px);
+    opacity: 0%;
+    transition: transform 0.5s, opacity 0.5s;
+}
+
+.text.scrolly.scrolly-entered {
+    opacity: 100%;
+    transform: none;
+}
+
+#toppybit {
+    display: flex;
+    flex-direction: row;
+    padding: 10%;
+    box-sizing: border-box;
+}
+
+.huge {
+    font-size: 6em;
+}
+
+span.big {
+    font-size: 4em;
+}
+
+#imagine {
+    position: sticky;
+    top: 50vh;
+    transform: translateY(-50%);
+    display: inline-block;
+}
+
+#switchybit > div > span {
+    display: inline-block;
+    background-color: #000044;
+    padding: 10px;
+    font-family: monospace;
+    color: white;
+    position: sticky;
+    top: 50vh;
+    transform: translateY(-50%);
+}
+
+#switchybit > div {
+    height: 100vh;
+    opacity: 0%;
+    transition: opacity 0.1s;
+}
+
+#switchybit > div.scrolly-center {
+    opacity: 100%;
+}
+
+i.highlight {
+    color: red;
+    font-size: 3rem;
+    text-shadow: 0px 0px 2px red, 0px 0px 4px blue;
+}
+
+#actualbottom {
+    background-color: black;
+    text-align: center;
+    color: white;
+    font-size: 0.7em;
+    padding: 5px;
+}
+
+h1, h2, h3, h4, h5, h6 {
+    text-align: right;
+    padding-right: 10vw;
+}
+
+h1 {
+    font-size: 6em;
+}
+
+div.toptext {
+    padding-left: 35vw;
+    padding-right: 15vw;
+    font-size: 1.3em;
+}
+
+.textimage {
+    display: flex;
+    padding-left: 10vw;
+    padding-right: 10vw;
+}
+
+.textimage > .textimage-text {
+    flex: 2;
+    padding: 100px;
+    font-size: 1.2em;
+}
+
+.textimage:nth-child(2n + 1) {
+    flex-direction: row-reverse;
+}
+
+.textimage.scrolly {
+    justify-content: space-between;
+    width: 200vw;
+    transform: translate(-50vw);
+    overflow: hidden;
+    transition: width 5s, transform 5s;
+}
+
+.textimage.scrolly.scrolly-entered {
+    width: auto;
+    transform: none;
+}