127 lines
2.2 KiB
CSS
127 lines
2.2 KiB
CSS
/* global CSS file, imported in every page, defines commonly used color, effects
|
|
* etc. also defines styles for commonly used elements */
|
|
|
|
:root {
|
|
/* randomly selected colors */
|
|
--yellow: #d3b910;
|
|
--cyan: #0dd2e8;
|
|
--green: #06e00a;
|
|
--pinkish: #d506e0;
|
|
--red: #e8180d;
|
|
--blue: #3768fc;
|
|
|
|
/* white tones */
|
|
--white-1: #ffffff;
|
|
--white-2: #bfbfbf;
|
|
--white-3: #5f5f5f;
|
|
|
|
/* black tones */
|
|
--black-1: #000000;
|
|
--black-2: #111;
|
|
--black-3: #3a3b3c;
|
|
|
|
/* different sizes */
|
|
--size-1: 8px;
|
|
--size-2: 16px;
|
|
--size-3: 18px;
|
|
--size-4: 20px;
|
|
--size-5: 24px;
|
|
--size-6: 30px;
|
|
|
|
/* shadows */
|
|
--box-shadow: rgb(38, 57, 77) 0px 20px 30px -10px;
|
|
--text-shadow: 0 1px 5px rgba(255, 255, 255, 0.15);
|
|
|
|
/* backgrounds */
|
|
--transparent: linear-gradient(rgba(11, 11, 11, 0.808), rgba(1, 1, 1, 0.96));
|
|
--glass: rgba(1, 1, 1, 0.93);
|
|
|
|
/* fonts */
|
|
--monospace:
|
|
ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono,
|
|
monospace;
|
|
--sans-serif:
|
|
-apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica,
|
|
Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
|
|
--emoji: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
|
}
|
|
|
|
/* cursor blink animation */
|
|
@keyframes blink {
|
|
0% {
|
|
opacity: 0;
|
|
}
|
|
}
|
|
|
|
/* typing animation */
|
|
@keyframes typing {
|
|
from {
|
|
width: 0;
|
|
}
|
|
to {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
* {
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
html {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
body {
|
|
font-family: var(--sans-serif);
|
|
background-image: url("/assets/banner.png");
|
|
overflow-x: hidden;
|
|
height: 100vh;
|
|
width: 100vw;
|
|
|
|
line-height: 1.5;
|
|
font-size: var(--size-3);
|
|
}
|
|
|
|
::selection {
|
|
background: rgba(100, 100, 100, 0.5);
|
|
}
|
|
|
|
::-webkit-scrollbar {
|
|
border-radius: 5px;
|
|
width: 1px;
|
|
}
|
|
|
|
::-webkit-scrollbar-track {
|
|
border-radius: 10px;
|
|
background: var(--black-1);
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
border-radius: 10px;
|
|
background: var(--black-2);
|
|
}
|
|
|
|
a {
|
|
color: var(--white-2);
|
|
font-weight: 600;
|
|
cursor: pointer;
|
|
|
|
text-decoration: underline;
|
|
text-decoration-color: var(--white-2);
|
|
}
|
|
|
|
a:hover {
|
|
color: var(--white-1);
|
|
text-shadow: var(--text-shadow);
|
|
}
|
|
|
|
ul {
|
|
list-style: inside;
|
|
}
|
|
|
|
br {
|
|
display: block;
|
|
margin: 5px 0;
|
|
}
|