mirror of
https://git.suyu.dev/suyu/website.git
synced 2025-12-25 00:34:38 +01:00
134 lines
2.4 KiB
Text
134 lines
2.4 KiB
Text
@import url("https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap");
|
|
|
|
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
@font-face {
|
|
font-family: "Consolas";
|
|
src: url(./assets/fonts/Consolas.ttf) format("truetype");
|
|
}
|
|
|
|
html,
|
|
body {
|
|
min-height: 100%;
|
|
width: 100%;
|
|
overflow-x: hidden;
|
|
overflow-y: auto;
|
|
background: #131215;
|
|
color: #ffffff;
|
|
font-family: "DM Sans", sans-serif;
|
|
}
|
|
|
|
html {
|
|
scroll-behavior: smooth;
|
|
overflow-x: hidden;
|
|
scrollbar-gutter: stable;
|
|
}
|
|
|
|
h1,
|
|
h2,
|
|
h3 {
|
|
font-family: "Outfit", sans-serif;
|
|
}
|
|
|
|
::selection {
|
|
background: #eee;
|
|
color: #000;
|
|
}
|
|
|
|
:focus-visible {
|
|
@apply outline-none ring-2 ring-sky-400;
|
|
}
|
|
|
|
::-webkit-scrollbar {
|
|
@apply w-[8px];
|
|
}
|
|
|
|
::-webkit-scrollbar-track {
|
|
@apply bg-[var(--page-bg)]
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
@apply rounded-xl bg-[#3c4f7c]
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:hover {
|
|
@apply bg-[#526ca8]
|
|
}
|
|
|
|
.cta-button {
|
|
background: linear-gradient(0deg, rgba(0, 0, 0, 0.06), rgba(0, 0, 0, 0.06)),
|
|
radial-gradient(109.26% 109.26% at 49.83% 13.37%, #ffffff 0%, #babaca 100%);
|
|
color: black;
|
|
@apply flex w-fit shrink-0 select-none flex-row items-center justify-center gap-4 rounded-xl py-3 pl-7 pr-5 font-bold transition;
|
|
}
|
|
|
|
.button,
|
|
.cta-button {
|
|
padding: 0.75rem 1.5rem;
|
|
}
|
|
|
|
.button:disabled,
|
|
.cta-button:disabled {
|
|
opacity: 0.5;
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.button {
|
|
border: 2px solid #46424d;
|
|
@apply flex w-fit shrink-0 select-none flex-row items-center justify-center gap-4 rounded-xl px-6 py-3 font-bold transition;
|
|
}
|
|
|
|
.button:hover {
|
|
border: 2px solid transparent;
|
|
background: #c3c3cd;
|
|
color: black;
|
|
}
|
|
|
|
.button-sm {
|
|
border: 2px solid #46424d;
|
|
@apply flex w-fit shrink-0 select-none flex-row items-center justify-center gap-4 rounded-xl px-4 py-2 text-sm font-bold transition;
|
|
}
|
|
|
|
.button-sm:hover {
|
|
border: 2px solid transparent;
|
|
background: #c3c3cd;
|
|
color: black;
|
|
}
|
|
|
|
.input {
|
|
border: 2px solid #46424d;
|
|
/* @apply w-full rounded-xl px-4 py-3 text-sm font-bold transition; */
|
|
width: 100%;
|
|
border-radius: 0.75rem;
|
|
padding: 0.5rem 1rem;
|
|
font-size: 1rem;
|
|
font-weight: 600;
|
|
transition: all 0.2s;
|
|
background-color: transparent;
|
|
}
|
|
|
|
.link {
|
|
@apply text-blue-300 underline transition-all ease-out hover:text-blue-100;
|
|
}
|
|
|
|
@keyframes contentShow {
|
|
0% {
|
|
opacity: 0;
|
|
transform: translate(-50%, -48%) scale(0.96);
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
transform: translate(-50%, -50%) scale(1);
|
|
}
|
|
}
|
|
|
|
@keyframes overlayShow {
|
|
0% {
|
|
opacity: 0;
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
}
|
|
}
|