mirror of
https://github.com/TheRealOwenRees/chess-scribe-website.git
synced 2026-07-23 09:56:57 +00:00
106 lines
1.9 KiB
CSS
106 lines
1.9 KiB
CSS
@import "tailwindcss";
|
|
@plugin "@tailwindcss/typography";
|
|
|
|
/* inter-latin-wght-normal */
|
|
@font-face {
|
|
font-family: 'Inter Variable';
|
|
font-style: normal;
|
|
font-display: swap;
|
|
font-weight: 100 900;
|
|
src: url('@fontsource-variable/inter/files/inter-latin-wght-normal.woff2') format('woff2-variations');
|
|
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
|
|
}
|
|
|
|
@theme {
|
|
--font-sans: "Inter Variable", sans-serif;
|
|
}
|
|
|
|
:root {
|
|
--base-content: #1f2937;
|
|
--neutral-content: #4b5563;
|
|
--accent: #6f884d;
|
|
--bg-base: #e7f3ec;
|
|
--header-bg: rgba(251, 255, 248, 0.84);
|
|
}
|
|
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
html,
|
|
body,
|
|
#app {
|
|
min-height: 100%;
|
|
background-color: var(--bg-base);
|
|
}
|
|
|
|
body {
|
|
margin: 0;
|
|
font-family: var(--font-sans), sans-serif;
|
|
background-color: var(--bg-base);
|
|
overflow-x: hidden;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
|
|
.nav-container {
|
|
background-color: var(--header-bg);
|
|
}
|
|
|
|
.nav-title {
|
|
color: var(--accent);
|
|
}
|
|
|
|
.nav-item {
|
|
color: var(--neutral-content);
|
|
|
|
&:hover {
|
|
color: var(--accent);
|
|
text-decoration: underline;
|
|
text-decoration-thickness: 2px;
|
|
text-underline-offset: 8px;
|
|
}
|
|
}
|
|
|
|
/*a {*/
|
|
/* text-decoration-thickness: 1px;*/
|
|
/* text-underline-offset: 2px;*/
|
|
/*}*/
|
|
|
|
/*a:hover {*/
|
|
/* color: #246f76;*/
|
|
/*}*/
|
|
|
|
/*.page-wrap {*/
|
|
/* width: min(1080px, calc(100% - 2rem));*/
|
|
/* margin-inline: auto;*/
|
|
/*}*/
|
|
|
|
/*button,*/
|
|
/*a {*/
|
|
/* transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease,*/
|
|
/* transform 180ms ease;*/
|
|
/*}*/
|
|
|
|
/*@media (max-width: 640px) {*/
|
|
/* .nav-link::after {*/
|
|
/* bottom: -4px;*/
|
|
/* }*/
|
|
/*}*/
|
|
|
|
.rise-in {
|
|
animation: rise-in 700ms cubic-bezier(0.16, 1, 0.3, 1) both;
|
|
}
|
|
|
|
@keyframes rise-in {
|
|
from {
|
|
opacity: 0;
|
|
transform: translateY(12px);
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
|