2023-12-26 01:25:08 +00:00
|
|
|
:root {
|
2024-01-07 03:04:57 +00:00
|
|
|
/* PUT OVERRIDES HERE */
|
|
|
|
/*--links: #ff0000 !important;*/
|
|
|
|
--elevated: #ffffff0a;
|
2024-01-28 20:06:04 +00:00
|
|
|
--background-transparent: #161b22aa;
|
2024-01-07 03:04:57 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
* {
|
2024-01-28 20:06:04 +00:00
|
|
|
transition: all 0.1s ease-in-out;
|
|
|
|
}
|
|
|
|
|
|
|
|
html {
|
|
|
|
overflow-x: hidden;
|
2024-01-07 03:04:57 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
.flex-row {
|
|
|
|
display: flex;
|
|
|
|
flex-direction: row;
|
|
|
|
width: 100%;
|
|
|
|
flex: 1;
|
|
|
|
}
|
|
|
|
|
|
|
|
.flex-col {
|
|
|
|
display: flex;
|
|
|
|
flex-direction: column;
|
|
|
|
width: 100%;
|
|
|
|
flex: 1;
|
|
|
|
}
|
|
|
|
|
|
|
|
.flex-1 {
|
2024-01-28 20:06:04 +00:00
|
|
|
flex: 1;
|
2024-01-07 03:04:57 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
.wrap {
|
|
|
|
flex-wrap: wrap;
|
|
|
|
}
|
|
|
|
|
2024-01-07 04:00:19 +00:00
|
|
|
.bg-gradient {
|
2024-01-28 20:06:04 +00:00
|
|
|
background: radial-gradient(
|
|
|
|
circle at top right,
|
|
|
|
var(--background) 0%,
|
|
|
|
var(--background-body) 50%,
|
|
|
|
var(--background-body) 90%
|
|
|
|
);
|
2024-01-07 04:00:19 +00:00
|
|
|
}
|
|
|
|
|
2024-01-07 03:04:57 +00:00
|
|
|
/* WIDTH HEIGHT ---------------------------------*/
|
|
|
|
.sm {
|
|
|
|
width: 1rem;
|
|
|
|
height: 1rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
.md {
|
|
|
|
width: 2rem;
|
|
|
|
height: 2rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
.lg {
|
|
|
|
width: 3rem;
|
|
|
|
height: 3rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
.xl {
|
|
|
|
width: 4rem;
|
|
|
|
height: 4rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
.w-full {
|
|
|
|
width: 100dvw;
|
|
|
|
}
|
|
|
|
|
|
|
|
.h-full {
|
|
|
|
height: 100dvh;
|
|
|
|
}
|
|
|
|
|
2024-01-07 04:00:19 +00:00
|
|
|
.h-0 {
|
|
|
|
height: 0;
|
|
|
|
}
|
|
|
|
|
2024-01-07 03:04:57 +00:00
|
|
|
.x-center {
|
|
|
|
align-items: center;
|
|
|
|
}
|
|
|
|
|
|
|
|
.y-center {
|
|
|
|
justify-content: center;
|
|
|
|
}
|
|
|
|
|
|
|
|
.y-bottom {
|
|
|
|
align-items: baseline;
|
|
|
|
}
|
|
|
|
|
|
|
|
.flex-between {
|
|
|
|
justify-content: space-between;
|
|
|
|
}
|
|
|
|
|
|
|
|
.flex {
|
|
|
|
display: flex;
|
|
|
|
}
|
|
|
|
|
|
|
|
.gap-05 {
|
2024-01-28 20:06:04 +00:00
|
|
|
gap: 0.5rem;
|
2024-01-07 03:04:57 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
.gap-1 {
|
|
|
|
gap: 1rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
.bg-grey {
|
|
|
|
background-color: grey;
|
|
|
|
}
|
|
|
|
|
|
|
|
.p-sm {
|
|
|
|
padding: 4px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.p-md {
|
|
|
|
padding: 8px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.p-lg {
|
|
|
|
padding: 1rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
.p-xl {
|
|
|
|
padding: 2rem;
|
|
|
|
}
|
|
|
|
|
2024-01-07 04:00:19 +00:00
|
|
|
/* TEXT ---------------------------------------------*/
|
2024-01-07 03:04:57 +00:00
|
|
|
.text-sm {
|
|
|
|
font-size: 1rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
.text-md {
|
|
|
|
font-size: 1.2rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
.text-lg {
|
|
|
|
font-size: 1.4rem;
|
|
|
|
}
|
|
|
|
|
2024-01-07 04:00:19 +00:00
|
|
|
/* FONT ---------------------------------------------*/
|
2024-01-07 03:04:57 +00:00
|
|
|
.font-muted {
|
|
|
|
color: var(--text-muted);
|
|
|
|
}
|
|
|
|
|
|
|
|
.font-main {
|
|
|
|
color: var(--text-main);
|
|
|
|
}
|
|
|
|
|
|
|
|
.font-bold {
|
|
|
|
font-weight: bold;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* BORDER ---------------------------------- */
|
|
|
|
.border-dashed {
|
|
|
|
border-style: dashed;
|
|
|
|
}
|
|
|
|
|
|
|
|
.border-grey {
|
|
|
|
border-color: grey;
|
|
|
|
}
|
|
|
|
|
|
|
|
.border-1 {
|
|
|
|
border-width: 1px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.rounded {
|
|
|
|
border-radius: 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
.rounded-sm {
|
|
|
|
border-radius: 10px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* MARGIN ----------------------------------*/
|
|
|
|
.mt-4 {
|
|
|
|
margin-top: 4rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
.m-0 {
|
|
|
|
margin: 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* HOVER ----------------------------------*/
|
|
|
|
.hover-scale:hover {
|
|
|
|
transform: scale(1.2);
|
|
|
|
}
|
|
|
|
|
|
|
|
.hover-font-yellow:hover {
|
|
|
|
color: var(--links);
|
|
|
|
}
|
|
|
|
|
|
|
|
.hover-pointer:hover {
|
|
|
|
cursor: pointer;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* BACKGROUND ----------------------------------*/
|
|
|
|
.bg-elevated {
|
|
|
|
background-color: var(--elevated);
|
|
|
|
}
|
|
|
|
|
|
|
|
/* OVERRIDES ----------------------------------*/
|
|
|
|
article {
|
2024-01-28 20:06:04 +00:00
|
|
|
padding-top: 0.8rem;
|
|
|
|
padding-bottom: 0.8rem;
|
2024-01-09 05:29:18 +00:00
|
|
|
background-color: var(--elevated);
|
2024-01-28 20:06:04 +00:00
|
|
|
background: radial-gradient(
|
|
|
|
circle at top right,
|
|
|
|
var(--elevated) 0%,
|
|
|
|
var(--background) 90%
|
|
|
|
);
|
2024-01-07 03:04:57 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
body nav:first-of-type::before {
|
|
|
|
backdrop-filter: unset;
|
|
|
|
-webkit-backdrop-filter: unset;
|
|
|
|
content: unset;
|
|
|
|
position: unset;
|
|
|
|
z-index: unset;
|
|
|
|
top: unset;
|
|
|
|
left: unset;
|
|
|
|
right: unset;
|
|
|
|
bottom: unset;
|
|
|
|
}
|
|
|
|
|
|
|
|
body nav:first-of-type {
|
|
|
|
position: unset;
|
|
|
|
padding: 1rem !important;
|
|
|
|
align-items: unset !important;
|
|
|
|
width: unset !important;
|
|
|
|
min-height: 100dvh !important;
|
|
|
|
flex-direction: column !important;
|
|
|
|
overflow-y: auto !important;
|
|
|
|
-webkit-touch-callout: none;
|
|
|
|
/* iOS Safari */
|
|
|
|
-webkit-user-select: none;
|
|
|
|
/* Safari */
|
|
|
|
-khtml-user-select: none;
|
|
|
|
/* Konqueror HTML */
|
|
|
|
-moz-user-select: none;
|
|
|
|
/* Old versions of Firefox */
|
|
|
|
-ms-user-select: none;
|
|
|
|
/* Internet Explorer/Edge */
|
|
|
|
user-select: none;
|
|
|
|
backdrop-filter: saturate(180%) blur(5px);
|
|
|
|
-webkit-backdrop-filter: saturate(180%) blur(5px);
|
|
|
|
}
|
|
|
|
|
|
|
|
body nav:first-of-type ul {
|
|
|
|
list-style-type: unset !important;
|
|
|
|
margin: unset !important;
|
|
|
|
padding: unset !important;
|
|
|
|
overflow: unset !important;
|
|
|
|
display: unset !important;
|
|
|
|
}
|
|
|
|
|
|
|
|
body nav:first-of-type ul li {
|
|
|
|
float: unset !important;
|
|
|
|
}
|
|
|
|
|
|
|
|
body nav:first-of-type ul li ul {
|
|
|
|
display: unset !important;
|
|
|
|
position: unset !important;
|
|
|
|
background: unset !important;
|
|
|
|
backdrop-filter: unset !important;
|
|
|
|
-webkit-backdrop-filter: unset !important;
|
2023-12-26 01:25:08 +00:00
|
|
|
}
|
2024-01-28 20:06:04 +00:00
|
|
|
|
|
|
|
.frosted {
|
|
|
|
backdrop-filter: blur(20px);
|
|
|
|
border-right: 1px solid #fff1;
|
|
|
|
border-top: 1px solid #fff1;
|
|
|
|
border-left: 1px solid var(--background-transparent);
|
|
|
|
border-bottom: 1px solid var(--background-transparent);
|
|
|
|
}
|
|
|
|
|
|
|
|
.bubble {
|
|
|
|
background-color: white;
|
|
|
|
position: absolute;
|
|
|
|
border-radius: 50%;
|
|
|
|
opacity: 0.3;
|
|
|
|
z-index: -1;
|
|
|
|
background: radial-gradient(
|
|
|
|
circle at top right,
|
|
|
|
white 0%,
|
|
|
|
grey 50%,
|
|
|
|
var(--background-body) 90%
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
div.bubble {
|
|
|
|
width: 400px;
|
|
|
|
height: 400px;
|
|
|
|
bottom: calc(50vh - 220px);
|
|
|
|
right: calc(50vw - 0px);
|
|
|
|
animation: myAnim 5s ease-in-out 0s infinite normal forwards;
|
|
|
|
}
|
|
|
|
div.bubble:nth-of-type(2) {
|
|
|
|
width: 200px;
|
|
|
|
height: 200px;
|
|
|
|
bottom: calc(50vh - -200px);
|
|
|
|
right: calc(50vw - 300px);
|
|
|
|
animation: myAnim 4s ease-in-out 0s infinite normal forwards;
|
|
|
|
}
|
|
|
|
div.bubble:nth-of-type(3) {
|
|
|
|
width: 100px;
|
|
|
|
height: 100px;
|
|
|
|
bottom: calc(50vh - 0px);
|
|
|
|
right: calc(50vw - 200px);
|
|
|
|
animation: myAnim 3s ease-in-out 0s infinite normal forwards;
|
|
|
|
}
|
|
|
|
|
|
|
|
@keyframes myAnim {
|
|
|
|
0% {
|
|
|
|
transform: scale(0.9);
|
|
|
|
}
|
|
|
|
|
|
|
|
50% {
|
|
|
|
transform: scale(1);
|
|
|
|
}
|
|
|
|
|
|
|
|
100% {
|
|
|
|
transform: scale(0.9);
|
|
|
|
}
|
|
|
|
}
|