807 lines
27 KiB
CSS
807 lines
27 KiB
CSS
html, body {
|
|
height: 100vh;
|
|
width: 100vw;
|
|
overflow: hidden;
|
|
--dark-bg: #27143f;
|
|
--bar: #804fc9;
|
|
}
|
|
@font-face {
|
|
font-family: c1;
|
|
src: url(/cydn_header.woff2);
|
|
font-variation-settings: "wght" 50;
|
|
}
|
|
body {
|
|
display: grid;
|
|
background-color: var(--dark-bg);
|
|
}
|
|
.files {
|
|
background-color: var(--bg);
|
|
--scroll-bg: var(--dark-bg);
|
|
display: flex;
|
|
flex-direction: row;
|
|
overflow-x: scroll;
|
|
overflow-y: hidden;
|
|
min-height: 100vh;
|
|
border-bottom: 0;
|
|
box-sizing: border-box;
|
|
--tooltip: lch(from var(--bg) calc(l - 2) c h);
|
|
--muted: lch(from var(--dark-bg) 60 20 h / 0.8);
|
|
z-index: 1;
|
|
}
|
|
.ctld {
|
|
--c: 4.5;
|
|
--bg: lch(13 var(--c) var(--hue));
|
|
--dark-bg: lch(10 var(--c) var(--hue));
|
|
--bar: lch(90 96 var(--hue));
|
|
--primary: lch(90 96 var(--hue));
|
|
}
|
|
.ctld-2017 {
|
|
--hue: 120;
|
|
}
|
|
.ctld-2018 {
|
|
--hue: 40;
|
|
}
|
|
.ctld-2019 {
|
|
--hue: 290;
|
|
--c: 10;
|
|
}
|
|
.ctld-2020 {
|
|
--hue: 220;
|
|
--c: 10;
|
|
}
|
|
.ctld-2021 {
|
|
--hue: 70;
|
|
--c: 20;
|
|
}
|
|
.ctld-2022 {
|
|
--hue: 150;
|
|
--c: 20;
|
|
}
|
|
.ctld-2023 {
|
|
--hue: 5;
|
|
--c: 10;
|
|
}
|
|
.ctld-et {
|
|
--hue: 150;
|
|
--c: 0;
|
|
}
|
|
.ctld-2024, .ctld-sb {
|
|
--bg: #191919;
|
|
--dark-bg: #101010;
|
|
--fg: #a7a7a7;
|
|
--bar: white;
|
|
--primary: white;
|
|
.active {
|
|
font-weight: bold;
|
|
}
|
|
}
|
|
.ctld-2024 {
|
|
--dark-bg: #00000080;
|
|
--scroll-bg: #0000004d;
|
|
.content:not(.file-view-image):not(.file-view-video):not(.file-view-audio) {
|
|
background-color: #00000050;
|
|
}
|
|
}
|
|
.ctld-2024 .convo {
|
|
--primary: #ff6c5c;
|
|
}
|
|
.files::-webkit-scrollbar {
|
|
height: 24px;
|
|
background-color: transparent;
|
|
}
|
|
.files::-webkit-scrollbar-thumb {
|
|
background-color: var(--bar);
|
|
border: 6px solid var(--dark-bg);
|
|
border-radius: 12px;
|
|
}
|
|
.files::-webkit-scrollbar-track {
|
|
background-color: var(--dark-bg);
|
|
}
|
|
.files .panel {
|
|
position: relative;
|
|
flex: 0 0 auto;
|
|
min-width: 235px;
|
|
max-width: 235px;
|
|
height: 100%;
|
|
min-height: calc(100vh - 59px); /* safari hack */
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
.files .panel div.header {
|
|
display: none;
|
|
}
|
|
.files .panel .header {
|
|
white-space: nowrap;
|
|
font-size: 1rem;
|
|
font-weight: bold;
|
|
background-color: var(--dark-bg);
|
|
padding: 0.5rem 0.5rem 0.5rem 0.25rem;
|
|
color: var(--primary);
|
|
--color: var(--primary);
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
flex-shrink: 0;
|
|
}
|
|
.actions {
|
|
display: flex;
|
|
gap: 0.5rem;
|
|
height: 19px;
|
|
margin-right: 4px;
|
|
& > * {
|
|
position: relative;
|
|
width: 22px;
|
|
display: flex;
|
|
&::before {
|
|
position: absolute;
|
|
top: -3px;
|
|
width: 24px;
|
|
height: 24px;
|
|
}
|
|
}
|
|
}
|
|
.files .panel .content {
|
|
position: relative;
|
|
flex: 1;
|
|
overflow-y: scroll;
|
|
overflow-x: hidden;
|
|
}
|
|
a.header {
|
|
display: flex;
|
|
}
|
|
.files .panel.last {
|
|
min-width: min(calc(100vw - 255px), calc(90% - 20rem));
|
|
max-width: none;
|
|
div.header {
|
|
display: flex;
|
|
}
|
|
a.header {
|
|
display: none;
|
|
}
|
|
}
|
|
.files .panel.first:not(.last) {
|
|
max-width: 216px;
|
|
min-width: 216px;
|
|
}
|
|
.files .panel.first .content:not(.readme) {
|
|
max-width: 200px;
|
|
min-width: 200px;
|
|
}
|
|
.panel:first-child {
|
|
border-left: 16px solid var(--dark-bg);
|
|
}
|
|
.panel:last-child {
|
|
flex: 1;
|
|
}
|
|
.files .panel .hsplit {
|
|
display: flex;
|
|
flex-direction: row-reverse;
|
|
height: calc(100vh - 59px);
|
|
.content {
|
|
min-width: 235px;
|
|
flex: 0 0 auto;
|
|
}
|
|
.content.readme {
|
|
min-width: 300px;
|
|
flex: 1;
|
|
}
|
|
}
|
|
.content {
|
|
height: calc(100vh - 59px);
|
|
}
|
|
.files .panel ul {
|
|
white-space: nowrap;
|
|
list-style-type: none;
|
|
display: flex;
|
|
flex-direction: column;
|
|
&, li {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
li a {
|
|
&:active {
|
|
--muted: red !important;
|
|
}
|
|
position: relative;
|
|
display: block;
|
|
text-overflow: ellipsis;
|
|
font-size: 0.5rem;
|
|
overflow: hidden;
|
|
color: var(--muted);
|
|
& > * {
|
|
color: var(--fg);
|
|
font-size: 1rem;
|
|
}
|
|
&:hover:not(.active) {
|
|
background-color: rgb(from var(--dark-bg) r g b / 0.5);
|
|
}
|
|
&:active {
|
|
background-color: var(--dark-bg) !important;
|
|
color: red;
|
|
date {
|
|
color: red;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.li, .tooltip {
|
|
padding: 0.5rem 0.2rem 0.5rem 0.2rem;
|
|
color: var(--fg);
|
|
&.active {
|
|
background-color: var(--dark-bg);
|
|
color: var(--primary);
|
|
--color: var(--primary);
|
|
--muted: var(--primary);
|
|
}
|
|
date {
|
|
color: var(--muted);
|
|
letter-spacing: -0.08em;
|
|
padding-right: 0.3rem;
|
|
transform: scaleX(0.95);
|
|
display: inline-block;
|
|
&.inline {
|
|
padding-right: 0;
|
|
}
|
|
}
|
|
}
|
|
pre {
|
|
padding: 1rem;
|
|
font-size: 1rem;
|
|
}
|
|
.files .panel ul a.readme {
|
|
display: flex;
|
|
font-weight: bold;
|
|
align-items: center;
|
|
color: #91fff2;
|
|
&.active {
|
|
--muted: #91fff2;
|
|
}
|
|
.line {
|
|
display: block;
|
|
width: 58px;
|
|
margin-right: 8px;
|
|
margin-left: 2px;
|
|
height: 2px;
|
|
background-color: var(--muted);
|
|
}
|
|
}
|
|
.panel .content::-webkit-scrollbar {
|
|
width: 10px;
|
|
}
|
|
.panel .content::-webkit-scrollbar-thumb {
|
|
background-color: var(--bar);
|
|
border: 2px solid var(--dark-bg);
|
|
border-radius: 8px;
|
|
}
|
|
.panel .content::-webkit-scrollbar-track {
|
|
background-color: var(--scroll-bg);
|
|
}
|
|
.tooltip {
|
|
position: absolute;
|
|
left: 0;
|
|
top: 35px;
|
|
background-color: var(--tooltip);
|
|
pointer-events: none;
|
|
padding-right: 1rem;
|
|
border-bottom-right-radius: 8px;
|
|
border-top-right-radius: 8px;
|
|
white-space: nowrap;
|
|
z-index: 100;
|
|
}
|
|
h3 {
|
|
padding-left: 0.25rem;
|
|
font-size: 1rem;
|
|
margin: 0;
|
|
margin-top: 8px;
|
|
margin-bottom: 2px;
|
|
text-decoration: underline;
|
|
text-underline-offset: 1px;
|
|
text-decoration-thickness: 2px;
|
|
}
|
|
@keyframes fadeIn {
|
|
from {
|
|
opacity: 0;
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
.file-view {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
.bold-slash {
|
|
font-weight: bold;
|
|
text-shadow: 1px 0 0 var(--color);
|
|
}
|
|
.size {
|
|
display: inline-block;
|
|
font-size: 0.9rem;
|
|
color: var(--muted);
|
|
padding-left: 0.4rem;
|
|
}
|
|
.first .size {
|
|
display: inline-block;
|
|
font-size: 0.7rem;
|
|
padding-left: 0.2rem;
|
|
transform: translateY(1px);
|
|
}
|
|
.mobile-back {
|
|
display: none;
|
|
}
|
|
.actions .download::before {
|
|
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjQiIGZpbGw9IiNmZmZmZmYiPjxwYXRoIGQ9Ik00ODAtMzIwIDI4MC01MjBsNTYtNTggMTA0IDEwNHYtMzI2aDgwdjMyNmwxMDQtMTA0IDU2IDU4LTIwMCAyMDBaTTI0MC0xNjBxLTMzIDAtNTYuNS0yMy41VDE2MC0yNDB2LTEyMGg4MHYxMjBoNDgwdi0xMjBoODB2MTIwcTAgMzMtMjMuNSA1Ni41VDcyMC0xNjBIMjQwWiIvPjwvc3ZnPg==);
|
|
transform: scale(1.2);
|
|
}
|
|
.actions .full-screen::before {
|
|
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjRweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyNHB4IiBmaWxsPSIjRkZGRkZGIj48cGF0aCBkPSJNMTIwLTEyMHYtMzIwaDgwdjE4NGw1MDQtNTA0SDUyMHYtODBoMzIwdjMyMGgtODB2LTE4NEwyNTYtMjAwaDE4NHY4MEgxMjBaIi8+PC9zdmc+);
|
|
}
|
|
.ico {
|
|
display: inline-block;
|
|
height: 19px;
|
|
position: relative;
|
|
width: 19px;
|
|
margin-right: 2px;
|
|
&::before {
|
|
content: " ";
|
|
position: absolute;
|
|
transform: translate(-2px, 3px);
|
|
width: 20px;
|
|
height: 20px;
|
|
background-color: var(--muted);
|
|
mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyMHB4IiBmaWxsPSIjRkZGRkZGIj48cGF0aCBkPSJNMjU5LjcyLTY0cS00MC40NSAwLTY5LjA4LTI4Ljc5UTE2Mi0xMjEuNTggMTYyLTE2MnYtNjM2cTAtNDAuNDIgMjguNzktNjkuMjFRMjE5LjU3LTg5NiAyNjAtODk2aDMwNGwyMzQgMjMzdjUwMXEwIDQwLjQyLTI4LjggNjkuMjFRNzQwLjQtNjQgNjk5Ljk2LTY0SDI1OS43MlpNNTA0LTYwMmgxOTZMNTA0LTc5OHYxOTZaIi8+PC9zdmc+);
|
|
}
|
|
}
|
|
.header .ico::before {
|
|
transform: translate(-2px, 0);
|
|
}
|
|
/* file icons alter the mask image. 24x24 */
|
|
.ico-dir::before {
|
|
mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyMHB4IiBmaWxsPSIjRkZGRkZGIj48cGF0aCBkPSJNMTYzLjA0LTEyMC4wOXEtNTEuMyAwLTg3LjEyLTM1LjgzLTM1LjgzLTM1LjgyLTM1LjgzLTg3LjEydi00NzMuOTJxMC01MS4zIDM1LjgzLTg3LjEyIDM1LjgyLTM1LjgzIDg3LjEyLTM1LjgzaDIxMS41M0w0ODAtNzM0LjQ4aDMxNi45NnE1MS4zIDAgODcuMTIgMzUuODMgMzUuODMgMzUuODMgMzUuODMgODcuMTN2MzY4LjQ4cTAgNTEuMy0zNS44MyA4Ny4xMi0zNS44MiAzNS44My04Ny4xMiAzNS44M0gxNjMuMDRabTAtMTIyLjk1aDYzMy45MnYtMzY4LjQ4SDQyOS4yMkwzMjMuNzgtNzE2Ljk2SDE2My4wNHY0NzMuOTJabTAgMHYtNDczLjkyIDQ3My45MloiLz48L3N2Zz4=);
|
|
}
|
|
.active .ico-dir::before, .ico-dir-open::before {
|
|
mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyMHB4IiBmaWxsPSIjRkZGRkZGIj48cGF0aCBkPSJNMTU3LjgzLTEyNC42NXEtNDYuOTMgMC04MC4wNi0zMy4xMi0zMy4xMi0zMy4xMy0zMy4xMi04MC4wNnYtNDg0LjM0cTAtNDcuMTcgMzMuMTItODAuMTggMzMuMTMtMzMgODAuMDYtMzNoMjE2LjQxTDQ4MC03MjkuNTloMzIyLjE3cTQ3LjE3IDAgODAuMTggMzMuMTMgMzMgMzMuMTIgMzMgODAuMDVINDMzLjEzTDMyNy4zNy03MjIuMTdIMTU3LjgzdjQ3NC40NWw4NS40Ny0yODguNjloNzExLjcybC05MS4yOCAzMDYuMTVxLTE2LjY3IDU3LjMtNTAuOTIgODEuNDYtMzQuMjUgMjQuMTUtOTkuMDggMjQuMTVIMTU3LjgzWm0xMTUuODQtMTEzLjE4aDQ3My45NGw1NC42NS0xODUuNDFIMzI4LjA5bC01NC40MiAxODUuNDFabTAgMCA1NC40Mi0xODUuNDEtNTQuNDIgMTg1LjQxWk0xNTcuODMtNjE2LjQxdi0xMDUuNzYgMTA1Ljc2WiIvPjwvc3ZnPg==);
|
|
}
|
|
.ico-webpage::before {
|
|
mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyMHB4IiBmaWxsPSIjRkZGRkZGIj48cGF0aCBkPSJNNDgwLTY0cS04NiAwLTE2Mi0zMi41dC0xMzIuNS04OVExMjktMjQyIDk2LjUtMzE4VDY0LTQ4MHEwLTg2IDMyLjUtMTYydDg5LTEzMi41UTI0Mi04MzEgMzE4LTg2My41VDQ4MC04OTZxODYgMCAxNjIgMzIuNXQxMzIuNSA4OVE4MzEtNzE4IDg2My41LTY0MlQ4OTYtNDgwcTAgODYtMzIuNSAxNjJ0LTg5IDEzMi41UTcxOC0xMjkgNjQyLTk2LjVUNDgwLTY0Wm0wLTEwMnExNS0xNiAzMS02M3QyNS05OUg0MjRxOSA1MiAyNSA5OXQzMSA2M1ptLTEwMS0xMnEtMTMtMjctMjIuNS02NVQzNDAtMzI4SDIwMXEyNyA1NCA3NSA5My41VDM3OS0xNzhabTIwMiAwcTU1LTE3IDEwMy01Ni41dDc1LTkzLjVINjIwcS03IDQ3LTE2LjUgODVUNTgxLTE3OFpNMTcwLTQxMGgxNTlxLTEtMTctMS41LTM1LjVUMzI3LTQ4MnEwLTE4IC41LTM1LjVUMzI5LTU1MEgxNzBxLTUgMTctNi41IDM0LjVUMTYyLTQ4MHEwIDE4IDEuNSAzNS41VDE3MC00MTBabTI0MyAwaDEzNHEyLTE4IDIuNS0zNS41dC41LTM0LjVxMC0xNy0uNS0zNXQtMi41LTM1SDQxM3EtMiAxNy0yLjUgMzV0LS41IDM1cTAgMTcgLjUgMzV0Mi41IDM1Wm0yMTggMGgxNTlxNS0xNyA2LjUtMzQuNVQ3OTgtNDgwcTAtMTgtMS41LTM2dC02LjUtMzRINjMxcTEgMTcgMS41IDM1LjV0LjUgMzYuNXEwIDE4LS41IDM1LjVUNjMxLTQxMFptLTExLTIyMmgxMzlxLTI3LTU0LTc1LTkzLjVUNTgxLTc4MnExMyAyNyAyMi41IDY1dDE2LjUgODVabS0xOTYgMGgxMTJxLTktNTItMjUtOTguNVQ0ODAtNzk5cS0xNSAyMi0zMSA2OC41VDQyNC02MzJabS0yMjMgMGgxMzlxNy00NyAxNi41LTg1dDIyLjUtNjVxLTU1IDE3LTEwMyA1Ni41VDIwMS02MzJaIi8+PC9zdmc+);
|
|
}
|
|
.ico-image::before {
|
|
mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyMHB4IiBmaWxsPSIjRkZGRkZGIj48cGF0aCBkPSJNMjEyLTc2cS01Ny4xMiAwLTk2LjU2LTM5LjQ0UTc2LTE1NC44OCA3Ni0yMTJ2LTUzNnEwLTU3LjEzIDM5LjQ0LTk2LjU2UTE1NC44OC04ODQgMjEyLTg4NGg1MzZxNTcuMTMgMCA5Ni41NiAzOS40NFE4ODQtODA1LjEzIDg4NC03NDh2NTM2cTAgNTcuMTItMzkuNDQgOTYuNTZRODA1LjEzLTc2IDc0OC03NkgyMTJabTQtMTg2aDUyOEw1NzEtNTAyIDQ1MC0zNDFsLTkxLTEyMS0xNDMgMjAwWm0xMjQuMjQtMjcwcTM3LjE4IDAgNjIuNDctMjUuNTNRNDI4LTU4My4wNSA0MjgtNjIwLjI0cTAtMzcuMTgtMjUuNTMtNjIuNDdRMzc2Ljk1LTcwOCAzMzkuNzYtNzA4cS0zNy4xOCAwLTYyLjQ3IDI1LjUzUTI1Mi02NTYuOTUgMjUyLTYxOS43NnEwIDM3LjE4IDI1LjUzIDYyLjQ3UTMwMy4wNS01MzIgMzQwLjI0LTUzMloiLz48L3N2Zz4=);
|
|
}
|
|
.ico-video::before {
|
|
mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyMHB4IiBmaWxsPSIjRkZGRkZGIj48cGF0aCBkPSJNMTk4LTE2MnEtMzkuNzMgMC02OC44Ni0yOS4xNFExMDAtMjIwLjI3IDEwMC0yNjB2LTQ0MHEwLTQwLjQyIDI5LjE0LTY5LjIxUTE1OC4yNy03OTggMTk4LTc5OGg0NDBxNDAuNDIgMCA2OS4yMSAyOC43OVE3MzYtNzQwLjQyIDczNi03MDB2MTU0bDE3Mi0xNzJ2NDc2TDczNi00MTR2MTU0cTAgMzkuNzMtMjguNzkgNjguODZRNjc4LjQyLTE2MiA2MzgtMTYySDE5OFoiLz48L3N2Zz4=);
|
|
}
|
|
.ico-blend::before {
|
|
mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiNmZmYiIHZpZXdCb3g9IjAgMCAyMCAyMCI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNi4zNiAxNC4xYy0uMTItLjM5LS4yLS45LS4yLTEuMTZsLS4wMi0uMDFjMC0uMjYuMDUtLjcuMDUtLjdsLTMuOSAzLjIxYy0uNy41Ni0xLjYxLjU1LTIuMDQgMC0uNDMtLjU0LS4yMS0xLjQuNDYtMS45MmwuMDMtLjAyIDcuMTktNS42LTQuMDIuMDFjLS42OCAwLTEuMTMtLjQ2LTEtMS4wMS4xMy0uNTUuNzYtLjk4IDEuNDEtLjk4aDcuOTRzLS42OC0xLjAzLTEuMzItMS41Yy0uNDctLjM1LTEuMi0uNzgtMS4yLS43OHMtLjQ2LS4xNy0xLjI4LS42OGMtLjgyLS41MS0uMi0xLjcuNTktMS45LjUgMCAxLjM4LjQzIDIuMjEuODMgMi44NCAxLjQgNS43IDQuMiA2LjMgNC44Mi41OS42MiAxLjEzIDEuMjUgMS41NCAxLjlhNS45IDUuOSAwIDAgMS0uNyA3LjE3IDcuNyA3LjcgMCAwIDEtMi4zIDEuOTUgNy40MyA3LjQzIDAgMCAxLTYuMS4wMWMtLjktLjQtMi4yMi0xLjU4LTIuMjItMS41OHMtMS4xNS0xLjIyLTEuNDItMi4wNVptNi44MiAxLjg4YzIuMyAwIDQuMTYtMS44IDQuMTYtNCAwLTIuMjEtMS44Ni00LTQuMTYtNFM5IDkuNzcgOSAxMS45OGMwIDIuMiAxLjg3IDQgNC4xNyA0WiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PGVsbGlwc2UgY3g9IjEzLjI3IiBjeT0iMTIuMDYiIHJ4PSIxLjgxIiByeT0iMS45NSIvPjwvc3ZnPg==);
|
|
}
|
|
.ico-fusion::before {
|
|
mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9IjAgMCAyMCAyMCI+PGNpcmNsZSBjeD0iOS4yMiIgY3k9IjE3LjU4IiByPSIxLjUiIGZpbGw9IiNEOUQ5RDkiLz48cGF0aCBmaWxsPSIjRDlEOUQ5IiBkPSJNMTYuNDMgMi45NUEyLjk1IDIuOTUgMCAwIDEgMTEuNyA1LjNhMi45NCAyLjk0IDAgMCAwLTQuMDEgMS4xMSAyLjk1IDIuOTUgMCAxIDEtLjg1LTMuNDMgMi43NiAyLjc2IDAgMCAwIDMuOS0xLjEyIDIuOTUgMi45NSAwIDAgMSA1LjY5IDEuMDlabS0uNjkgNy40NWEyLjE4IDIuMTggMCAwIDEtMy41IDEuNzMgMi4xNyAyLjE3IDAgMCAwLTIuOTYuODIgMi4xOCAyLjE4IDAgMSAxLS42Mi0yLjU0IDIuMDQgMi4wNCAwIDAgMCAyLjg3LS44MiAyLjE4IDIuMTggMCAwIDEgNC4yMS44WiIvPjwvc3ZnPg==);
|
|
}
|
|
.ico-audio::before {
|
|
mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyMHB4IiBmaWxsPSIjRkZGRkZGIj48cGF0aCBkPSJNNTM2LTc4di0xMDFxMTA2LTIzIDE3My0xMDguNVQ3NzYtNDgxcTAtMTA3LTY4LTE5MC41VDUzNi03ODF2LTEwMXExNDcgMjMgMjQyLjUgMTM3VDg3NC00ODJxMCAxNTAtOTUgMjY1LjVUNTM2LTc4Wk04Ni0zNjV2LTIzMmgxNThsMjIwLTIyMnY2NzZMMjQ0LTM2NUg4NlptNDUwIDQ3di0zMjRxNDkgMjEgNzguNSA2NC41VDY0NC00ODFxMCA1NC0yOS41IDk3LjVUNTM2LTMxOFoiLz48L3N2Zz4=);
|
|
}
|
|
.ico-archive::before {
|
|
mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyMHB4IiBmaWxsPSIjRkZGRkZGIj48cGF0aCBkPSJNNDQ0LjQzLTU3Ljk2di00MDMuNDNMMTA0LjA5LTY1NC4yMnYzMzMuNTdxMCAzMC45NSAxNS4yNiA1Ny42OXQ0Mi4yMiA0MmwyODIuODYgMTYzWm03Mi0xIDI4MS41Ny0xNjJxMjYuOTYtMTUuMjYgNDIuMjItNDIgMTUuMjYtMjYuNzQgMTUuMjYtNTcuNjl2LTMzNS43TDUxNi40My00NjMuODN2NDA0Ljg3Wm0xNzQuMTQtNTg3Ljg3IDEzNC42NS03NS4zOS0yODguMTgtMTY1LjNxLTI2LjUyLTE1LjI2LTU3LjA0LTE1LjI2dC01Ny40OCAxNS4yNmwtNzQuNjEgNDMuMyAzNDIuNjYgMTk3LjM5Wk00NzgtNTI1LjI2bDE0MC04MC0zNDQuMjItMTk3Ljk2LTE0MC41NiA4MS41N0w0NzgtNTI1LjI2WiIvPjwvc3ZnPg==);
|
|
}
|
|
.ico-text::before {
|
|
mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyMHB4IiBmaWxsPSIjRkZGRkZGIj48cGF0aCBkPSJNOTgtMjA4di0xMjhoNTI0djEyOEg5OFptMC0yMDh2LTEyOGg3NjR2MTI4SDk4Wm0wLTIwOXYtMTI4aDc2NHYxMjhIOThaIi8+PC9zdmc+);
|
|
}
|
|
.ico-link::before {
|
|
transform: translate(-2px, 3px);
|
|
mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyMHB4IiBmaWxsPSIjRkZGRkZGIj48cGF0aCBkPSJNNDMyLTI4OEgyODhxLTc5LjY4IDAtMTM1Ljg0LTU2LjIzUTk2LTQwMC40NSA5Ni00ODAuMjMgOTYtNTYwIDE1Mi4xNi02MTZxNTYuMTYtNTYgMTM1Ljg0LTU2aDE0NHY3MkgyODhxLTUwIDAtODUgMzV0LTM1IDg1cTAgNTAgMzUgODV0ODUgMzVoMTQ0djcyWm0tOTYtMTU2di03MmgyODh2NzJIMzM2Wm0xOTIgMTU2di03MmgxNDRxNTAgMCA4NS0zNXQzNS04NXEwLTUwLTM1LTg1dC04NS0zNUg1Mjh2LTcyaDE0NHE3OS42OCAwIDEzNS44NCA1Ni4yMyA1Ni4xNiA1Ni4yMiA1Ni4xNiAxMzZRODY0LTQwMCA4MDcuODQtMzQ0IDc1MS42OC0yODggNjcyLTI4OEg1MjhaIi8+PC9zdmc+);
|
|
}
|
|
.ico-readme::before {
|
|
mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyMHB4IiBmaWxsPSIjRkZGRkZGIj48cGF0aCBkPSJNNDI0LTI2N2gxMTJ2LTI2MUg0MjR2MjYxWm01NS42MS0zMTlxMjUuODkgMCA0My4xNC0xNi44NlE1NDAtNjE5LjczIDU0MC02NDUuNjFxMC0yNS44OS0xNi44Ni00My4xNFE1MDYuMjctNzA2IDQ4MC4zOS03MDZxLTI1Ljg5IDAtNDMuMTQgMTYuODZRNDIwLTY3Mi4yNyA0MjAtNjQ2LjM5cTAgMjUuODkgMTYuODYgNDMuMTRRNDUzLjczLTU4NiA0NzkuNjEtNTg2Wm0uNjcgNTM2cS04OC45MiAwLTE2Ny43NS0zMy4xLTc4LjgyLTMzLjExLTEzNy41Ny05MS44NlQ4My4xLTMxMi40OVE1MC0zOTEuMjggNTAtNDgwLjQ2cTAtODkuNDQgMzMuMTYtMTY3LjQ5IDMzLjE3LTc4LjA1IDkyLjE4LTEzNi45NCA1OS4wMS01OC44OSAxMzcuNTMtOTJRMzkxLjM5LTkxMCA0ODAuNDYtOTEwcTg5LjQzIDAgMTY3LjUyIDMzLjA5IDc4LjA5IDMzLjEgMTM2Ljk2IDkxLjk3IDU4Ljg3IDU4Ljg3IDkxLjk3IDEzNy4yMVE5MTAtNTY5LjM4IDkxMC00ODAuMTl0LTMzLjExIDE2Ny41MnEtMzMuMTEgNzguMzItOTIgMTM3LjMzUTcyNi0xMTYuMzMgNjQ3LjcyLTgzLjE2IDU2OS40NS01MCA0ODAuMjgtNTBaIi8+PC9zdmc+);
|
|
}
|
|
.ico-chat::before {
|
|
mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyMHB4IiBmaWxsPSIjRkZGRkZGIj48cGF0aCBkPSJNNTAtNDZ2LTc0MXEwLTUzLjgzIDM3LjA5LTkwLjkxUTEyNC4xOC05MTUgMTc4LTkxNWg2MDRxNTMuODMgMCA5MC45MSAzNy4wOVE5MTAtODQwLjgzIDkxMC03ODd2NDU5cTAgNTMuODMtMzcuMDkgOTAuOTFRODM1LjgzLTIwMCA3ODItMjAwSDIwNEw1MC00NlptMTg0LTMzOGgzNDd2LTcySDIzNHY3MlptMC0xMzhoNDkydi03MkgyMzR2NzJabTAtMTM4aDQ5MnYtNzJIMjM0djcyWiIvPjwvc3ZnPg);
|
|
}
|
|
.ico-snow::before {
|
|
mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyMHB4IiBmaWxsPSIjRkZGRkZGIj48cGF0aCBkPSJNNDU2LTI4MyAzMzYtMTYxcS04IDgtMTYuNSA4dC0xNy41LTdxLTgtOS04LTE4dDgtMTdsMTU0LTE1M3YtMTA4SDM1MEwxOTQtMzAycS04IDktMTcgOC41dC0xNy04LjVxLTgtOS04LTE3LjV0OS0xNy41bDEyNC0xMTlIMTI4cS03IDAtMTQuNS02LjVUMTA2LTQ3OXEwLTcgNi41LTE1dDE2LjUtOGgxNTZMMTYxLTYyM3EtOC04LTgtMTYuNXQ3LTE2LjVxOS05IDE4LTl0MTcgOWwxNTUgMTU0aDEwNnYtMTEwTDMwMi03NjRxLTgtOC04LTE3dDgtMTdxOS04IDE3LjUtOHQxNy41IDlsMTE5IDEyMHYtMTU0cTAtNyA2LjUtMTV0MTYuNS04cTcgMCAxNSA4dDggMTV2MTU0bDEyMS0xMjJxOC04IDE2LjUtOHQxNi41IDhxOSA4IDkgMTd0LTkgMTdMNTAyLTYxMnYxMTBoMTA4bDE1NC0xNTVxOC04IDE3LTh0MTcgOHE4IDkgOCAxNy41dC05IDE3LjVMNjc1LTUwMmgxNTZxNyAwIDE1IDh0OCAxNXEwIDEwLTggMTYuNXQtMTUgNi41SDY3NWwxMjMgMTIwcTkgOCA5IDE2LjV0LTggMTcuNXEtOCA4LTE3IDguNXQtMTgtNy41TDYxMC00NTZINTAydjEwOGwxNTQgMTU0cTkgOCA5IDE3LjV0LTggMTYuNXEtOSA4LTE3LjUgOHQtMTYuNS04TDUwMi0yODN2MTU1cTAgNy04IDE0LjV0LTE1IDcuNXEtMTAgMC0xNi41LTYuNVQ0NTYtMTI5di0xNTRaIi8+PC9zdmc+);
|
|
}
|
|
.ico-code::before {
|
|
mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyMHB4IiBmaWxsPSIjRkZGRkZGIj48cGF0aCBkPSJNMzE5LTIwMCAzOC00ODBsMjgyLTI4MiA5MSA5MC0xOTAgMTkxIDE5MCAxODktOTIgOTJabTMyMiAxLTkxLTkxIDE5MC0xOTAtMTkwLTE5MCA5MS05MCAyODEgMjgwLTI4MSAyODFaIi8+PC9zdmc+);
|
|
}
|
|
.ico-json::before {
|
|
mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyMHB4IiBmaWxsPSIjRkZGRkZGIj48cGF0aCBkPSJNNjE0LjA0LTE1Ni42NXYtMTAzLjk0aDM1LjE4cTIwLjc4IDAgMzUuNDgtMTQuODMgMTQuNzEtMTQuODIgMTQuNzEtMzUuNnYtNDkuNDZxMC00Ni41MiAzMC4yNi04MC4xNiAzMC4yNi0zMy42NCA3Ni41NS00MC42NHYtMi4yNHEtNDYuNTItMy45Ni03Ni42Ny0zNi43Mi0zMC4xNC0zMi43Ni0zMC4xNC03OS4yOHYtNDkuN3EwLTIwLjc4LTE0LjcxLTM1LjQ4LTE0LjctMTQuNzEtMzUuNDgtMTQuNzFoLTM1LjE4di0xMDMuOTRINjc1cTUzLjQzIDAgOTAuODkgMzcuOTZ0MzcuNDYgOTEuNjN2NDkuNDZxMCAyMC43NyAxNC4zMyAzNS42IDE0LjMyIDE0LjgzIDMyLjgyIDE0LjgzaDQ4Ljg1djE4Ny43NEg4NTAuNXEtMTguNSAwLTMyLjgyIDE0LjcxLTE0LjMzIDE0LjcxLTE0LjMzIDM1LjQ5djQ5LjY5cTAgNTMuNjctMzcuNDYgOTEuNjMtMzcuNDYgMzcuOTYtOTAuODkgMzcuOTZoLTYwLjk2Wm0tMzI5LjA0IDBxLTUzLjQzIDAtOTAuODktMzcuOTZ0LTM3LjQ2LTkxLjYzdi00OS42OXEwLTIwLjc4LTE0LjcxLTM1LjQ5dC0zNi40OC0xNC43MUg2MC42NXYtMTg3Ljc0aDQ0LjgxcTIxLjc3IDAgMzYuNDgtMTQuODMgMTQuNzEtMTQuODMgMTQuNzEtMzUuNnYtNDkuNDZxMC01My42NyAzNy40Ni05MS42MyAzNy40Ni0zNy45NiA5MC44OS0zNy45Nmg2MC45NnYxMDMuOTRoLTM0Ljk0cS0yMC43OCAwLTM1LjYgMTQuNzEtMTQuODMgMTQuNy0xNC44MyAzNS40OHY0OS43cTAgNDcuNTItMzAuMTQgODAuNzgtMzAuMTUgMzMuMjYtNzYuNDMgMzQuMjJ2Mi4zOXE0Ni4yOCA1Ljg1IDc2LjQzIDM5Ljk5IDMwLjE0IDM0LjE0IDMwLjE0IDgxLjY2djQ5LjQ2cTAgMjAuNzggMTQuODMgMzUuNiAxNC44MiAxNC44MyAzNS42IDE0LjgzaDM0Ljk0djEwMy45NEgyODVaIi8+PC9zdmc+);
|
|
}
|
|
.loading {
|
|
animation: loading 2s linear infinite;
|
|
background-color: hsl(from var(--bg) h s calc(l + 20) / 50%) !important;
|
|
}
|
|
@keyframes loading {
|
|
from {
|
|
opacity: 0.4;
|
|
}
|
|
50% {
|
|
opacity: 0.7;
|
|
}
|
|
to {
|
|
opacity: 0.4;
|
|
}
|
|
}
|
|
.mobile {
|
|
display: none !important;
|
|
}
|
|
.file-view-image, .file-view-video, .file-view-audio {
|
|
background-color: lch(from var(--dark-bg) calc(l - 3) calc(c - 15) h);
|
|
}
|
|
.file-view-video, .file-view-audio {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
& > * {
|
|
max-width: 100%;
|
|
max-height: 100%;
|
|
object-fit: contain;
|
|
}
|
|
}
|
|
.file-view-download {
|
|
p:first-child {
|
|
margin-top: 2rem;
|
|
}
|
|
p {
|
|
margin: 0.5rem 2rem;
|
|
max-width: 60ch;
|
|
}
|
|
code {
|
|
background-color: lch(from var(--dark-bg) calc(l - 5) calc(c - 5) h);
|
|
padding: 0.3rem 0.5rem;
|
|
border-radius: 0.3rem;
|
|
}
|
|
}
|
|
.speedbump {
|
|
z-index: 1;
|
|
position: relative;
|
|
canvas {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
z-index: -1;
|
|
}
|
|
header {
|
|
font-family: c1;
|
|
height: max(min(40vh, 400px), 100px);
|
|
color: #00ff80;
|
|
letter-spacing: 0.8ch;
|
|
margin-right: -0.8ch;
|
|
font-size: 6vw;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-variation-settings: "wght" 50;
|
|
text-shadow: 0 0 20px #00ff8022, 0 0 10px #00ff8033;
|
|
margin-bottom: 2rem;
|
|
h1 {
|
|
flex: 1;
|
|
margin: 0;
|
|
padding: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
}
|
|
p {
|
|
max-width: 50ch;
|
|
margin: 0 auto 1rem auto;
|
|
color: #ecffea88;
|
|
line-height: 1.5;
|
|
letter-spacing: 0.01em;
|
|
word-spacing: 0.3em;
|
|
text-align: center;
|
|
font-size: 1.2rem;
|
|
}
|
|
button {
|
|
background-color: #00ff80bb;
|
|
color: #111318;
|
|
border: none;
|
|
padding: 0.5rem 1rem;
|
|
border-radius: 0.3rem;
|
|
font-size: 1.2rem;
|
|
font-weight: 400;
|
|
cursor: pointer;
|
|
letter-spacing: 0.5rem;
|
|
padding-right: 0.5rem;
|
|
}
|
|
.enter-container {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin-top: 1rem;
|
|
}
|
|
.image-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(3, 1fr);
|
|
grid-template-rows: repeat(3, 1fr);
|
|
gap: 0.5rem;
|
|
margin: 0 auto;
|
|
background-color: #050d06;
|
|
padding: 0.5rem;
|
|
border-radius: 0.75rem;
|
|
button {
|
|
background-color: #0c1f0e;
|
|
width: 100%;
|
|
max-width: 100px;
|
|
aspect-ratio: 1/1;
|
|
padding: 0;
|
|
margin: 0;
|
|
cursor: pointer;
|
|
border-radius: 0.5rem;
|
|
img {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: block;
|
|
opacity: 0.75;
|
|
border-radius: 0.5rem;
|
|
}
|
|
&:hover {
|
|
img {
|
|
opacity: 0.85;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.lyrics {
|
|
align-self: flex-start;
|
|
}
|
|
.fullscreen-canvas {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100vw;
|
|
height: 100vh;
|
|
z-index: -1;
|
|
pointer-events: none;
|
|
user-select: none;
|
|
touch-action: none;
|
|
}
|
|
.cotyledon-link {
|
|
position: absolute;
|
|
bottom: 0;
|
|
right: 0;
|
|
color: #27143f;
|
|
padding: 0.5rem 1rem;
|
|
border-radius: 0.3rem;
|
|
}
|
|
.convo {
|
|
padding: 1rem;
|
|
.line {
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
/* different colors for different ppl */
|
|
.s-other_a {
|
|
padding-left: 4rem;
|
|
color: var(--primary);
|
|
}
|
|
.s-other_b {
|
|
padding-left: 8rem;
|
|
color: hsl(from var(--primary) calc(h + 200) s l);
|
|
}
|
|
.s-other_b2 {
|
|
padding-left: 4rem;
|
|
color: hsl(from var(--primary) calc(h + 200) s l);
|
|
}
|
|
.s-other_c {
|
|
padding-left: 12rem;
|
|
color: hsl(from var(--primary) calc(h + 100) s l);
|
|
}
|
|
.s-other_d {
|
|
padding-left: 4rem;
|
|
color: hsl(from var(--primary) calc(h + 50) s l);
|
|
}
|
|
.s-other_e {
|
|
padding-left: 4rem;
|
|
color: hsl(from var(--primary) calc(h + 80) s l);
|
|
}
|
|
.s-other_f {
|
|
padding-left: 4rem;
|
|
color: #00ff80;
|
|
}
|
|
hr {
|
|
margin-top: 2rem;
|
|
margin-bottom: 2rem;
|
|
border: none;
|
|
border-top: 2px solid var(--muted);
|
|
}
|
|
}
|
|
:not(.active) .ext {
|
|
font-size: 80%;
|
|
color: var(--muted);
|
|
}
|
|
.file-view-code {
|
|
color: lch(from var(--primary) 90 10 h / 0.88);
|
|
|
|
.comment {
|
|
color: var(--muted);
|
|
}
|
|
.keyword {
|
|
font-weight: bold;
|
|
color: lch(from var(--primary) 100 20 h / 1);
|
|
}
|
|
.string {
|
|
color: lch(from var(--primary) calc(l + 30) calc(c + 30) h);
|
|
}
|
|
.constant {
|
|
color: lch(from var(--primary) calc(l + 30) calc(c - 30) h);
|
|
}
|
|
.method {
|
|
color: lch(from var(--primary) l c calc(h - 25));
|
|
}
|
|
.class {
|
|
color: lch(from var(--primary) l c calc(h + 25));
|
|
}
|
|
.builtin {
|
|
color: var(--primary);
|
|
font-weight: bold;
|
|
}
|
|
.parameter {
|
|
font-style: italic;
|
|
}
|
|
.variable {
|
|
color: lch(from var(--primary) 90 30 h / 0.88);
|
|
}
|
|
}
|
|
.for_everyone {
|
|
max-width: 69ch;
|
|
padding: 1rem 3rem;
|
|
font-family: rmo, monospace;
|
|
line-height: 1;
|
|
&:last-child {
|
|
padding-bottom: 3rem;
|
|
}
|
|
&:first-child {
|
|
padding-top: 3rem;
|
|
}
|
|
p {
|
|
/* line */
|
|
margin: 0;
|
|
min-height: 1rem;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
p.normal {
|
|
line-height: 1.5;
|
|
}
|
|
blockquote {
|
|
margin-left: 0;
|
|
padding-left: 1rem;
|
|
border-left: 2px solid #f66244;
|
|
color: #ffbfb2;
|
|
line-height: 1.5;
|
|
p {
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
}
|
|
}
|
|
.fade-slide-in {
|
|
animation: fadeSlideIn 0.4s cubic-bezier(0.3, 0.8, 0.3, 1);
|
|
}
|
|
@keyframes fadeSlideIn {
|
|
from {
|
|
opacity: 0.5;
|
|
transform: translateY(12px);
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
.notfound {
|
|
p {
|
|
text-align: center;
|
|
}
|
|
a {
|
|
text-decoration: underline;
|
|
}
|
|
}
|
|
|
|
/* MOBILE */
|
|
@media (max-width: 1000px) {
|
|
html, body {
|
|
overflow: unset;
|
|
width: unset;
|
|
height: unset;
|
|
}
|
|
.mobile {
|
|
display: inline !important;
|
|
}
|
|
.desktop {
|
|
display: none !important;
|
|
}
|
|
h3 {
|
|
padding-left: 1rem;
|
|
font-size: 1.2rem;
|
|
}
|
|
body {
|
|
overflow-y: auto;
|
|
}
|
|
.files {
|
|
overflow-x: unset;
|
|
overflow-y: unset;
|
|
border-bottom: 16px solid var(--dark-bg);
|
|
min-height: 100vh;
|
|
.panel {
|
|
overflow-x: hidden;
|
|
border: none !important;
|
|
}
|
|
.panel, .panel .hsplit {
|
|
height: unset;
|
|
min-height: unset;
|
|
}
|
|
.panel .header {
|
|
padding: 0.75rem;
|
|
gap: 1rem;
|
|
align-items: center;
|
|
}
|
|
.mobile-back {
|
|
margin-left: -0.75rem;
|
|
display: block;
|
|
width: 48px;
|
|
height: 48px;
|
|
&::before {
|
|
display: block;
|
|
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjRweCIgdmlld0JveD0iMCAtOTYwIDk2MCA5NjAiIHdpZHRoPSIyNHB4IiBmaWxsPSIjRkZGRkZGIj48cGF0aCBkPSJtMzEzLTQ0MCAyMjQgMjI0LTU3IDU2LTMyMC0zMjAgMzIwLTMyMCA1NyA1Ni0yMjQgMjI0aDQ4N3Y4MEgzMTNaIi8+PC9zdmc+);
|
|
transform: scale(2);
|
|
transform-origin: top left;
|
|
}
|
|
}
|
|
.full-screen, .download {
|
|
width: 48px;
|
|
height: 48px;
|
|
&::before {
|
|
transform: scale(2);
|
|
}
|
|
}
|
|
.panel ul li a {
|
|
display: flex;
|
|
flex-direction: column-reverse;
|
|
padding: 0.5rem 1rem;
|
|
text-overflow: unset;
|
|
white-space: wrap;
|
|
date {
|
|
font-size: 0.9rem;
|
|
padding-right: 0;
|
|
}
|
|
.size {
|
|
padding-left: 0;
|
|
}
|
|
.size:not(:first-child) {
|
|
padding-left: 0.5rem;
|
|
}
|
|
}
|
|
.first .size {
|
|
font-size: 0.9rem;
|
|
&::before {
|
|
content: "(";
|
|
}
|
|
&::after {
|
|
content: ")";
|
|
}
|
|
}
|
|
}
|
|
.panel:not(.last) {
|
|
display: none;
|
|
}
|
|
.panel {
|
|
position: relative;
|
|
min-width: unset !important;
|
|
max-width: unset !important;
|
|
border-left-width: 10px !important;
|
|
}
|
|
.content {
|
|
height: unset !important;
|
|
min-width: unset !important;
|
|
max-width: unset !important;
|
|
overflow: unset !important;
|
|
}
|
|
.hsplit {
|
|
display: block !important;
|
|
}
|
|
.li.readme {
|
|
display: none !important;
|
|
}
|
|
.tooltip {
|
|
display: none !important;
|
|
}
|
|
}
|