mirror of
https://github.com/gabehf/Koito.git
synced 2026-03-08 23:18:15 -07:00
* feat: single SOT for themes + basic custom support * fix: adjust colors for yuu theme * feat: Allow loading of environment variables from file (#20) * feat: allow loading of environment variables from file * Panic if a file for an environment variable cannot be read * Use log.Fatalf + os.Exit instead of panic * fix: remove supurfluous call to os.Exit() --------- Co-authored-by: adaexec <nixos-git.s1pht@simplelogin.com> Co-authored-by: Gabe Farrell <90876006+gabehf@users.noreply.github.com> * chore: add pr test workflow * chore: changelog * feat: make all activity grids configurable * fix: adjust activity grid style * fix: make background gradient consistent size * revert: remove year from activity grid opts * style: adjust top item list min size to 200px * feat: add support for custom themes * fix: stabilized the order of top items * chore: update changelog * feat: native import & export * fix: use correct request body for alias requests * fix: clear input when closing edit modal * chore: changelog * docs: make endpoint clearer for some apps * feat: add ui and handler for export * fix: fix pr test workflow --------- Co-authored-by: adaexec <78047743+adaexec@users.noreply.github.com> Co-authored-by: adaexec <nixos-git.s1pht@simplelogin.com>
200 lines
No EOL
3.8 KiB
CSS
200 lines
No EOL
3.8 KiB
CSS
@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&family=League+Spartan:wght@100..900&display=swap');
|
|
@import "tailwindcss";
|
|
|
|
@theme {
|
|
--font-sans: "Jost", "Inter", ui-sans-serif, system-ui, sans-serif,
|
|
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
|
--animate-fade-in-scale: fade-in-scale 0.1s ease forwards;
|
|
--animate-fade-out-scale: fade-out-scale 0.1s ease forwards;
|
|
|
|
@keyframes fade-in-scale {
|
|
0% {
|
|
opacity: 0;
|
|
transform: scale(0.95);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
transform: scale(1);
|
|
}
|
|
}
|
|
|
|
@keyframes fade-out-scale {
|
|
0% {
|
|
opacity: 1;
|
|
transform: scale(1);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
transform: scale(0.95);
|
|
}
|
|
}
|
|
|
|
--animate-fade-in: fade-in 0.1s ease forwards;
|
|
--animate-fade-out: fade-out 0.1s ease forwards;
|
|
|
|
@keyframes fade-in {
|
|
0% {
|
|
opacity: 0;
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
@keyframes fade-out {
|
|
0% {
|
|
opacity: 1;
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
:root {
|
|
--header-xl: 36px;
|
|
--header-lg: 28px;
|
|
--header-md: 22px;
|
|
--header-sm: 16px;
|
|
--header-xl-weight: 600;
|
|
--header-weight: 600;
|
|
}
|
|
|
|
@media (min-width: 60rem) {
|
|
:root {
|
|
--header-xl: 78px;
|
|
--header-lg: 28px;
|
|
--header-md: 22px;
|
|
--header-sm: 16px;
|
|
--header-xl-weight: 600;
|
|
--header-weight: 600;
|
|
}
|
|
}
|
|
|
|
|
|
html,
|
|
body {
|
|
background-color: var(--color-bg);
|
|
color: var(--color-fg);
|
|
transition: background-color 0.3s ease;
|
|
}
|
|
select option {
|
|
margin: 40px;
|
|
background: var(--color-bg);
|
|
color: var(--color-fg);
|
|
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4);
|
|
}
|
|
select {
|
|
background: var(--color-bg);
|
|
}
|
|
|
|
/* a {
|
|
color: var(--color-fg);
|
|
}
|
|
a:hover {
|
|
color: var(--color-link-hover);
|
|
} */
|
|
|
|
h1 {
|
|
font-family: "League Spartan";
|
|
font-weight: var(--header-weight);
|
|
font-size: var(--header-xl);
|
|
}
|
|
h2 {
|
|
font-family: "League Spartan";
|
|
font-weight: var(--header-weight);
|
|
font-size: var(--header-md);
|
|
margin-bottom: 0.5em;
|
|
}
|
|
h3 {
|
|
font-family: "League Spartan";
|
|
font-size: var(--header-sm);
|
|
font-weight: var(--header-weight);
|
|
}
|
|
h4 {
|
|
font-size: var(--header-md);
|
|
}
|
|
.header-font {
|
|
font-family: "League Spartan";
|
|
}
|
|
|
|
.icon-hover-fill:hover > svg > path {
|
|
fill: var(--color-fg-secondary);
|
|
}
|
|
.icon-hover-stroke:hover > svg > path {
|
|
stroke: var(--color-fg-secondary);
|
|
}
|
|
|
|
.link-underline:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
input[type="text"] {
|
|
border: 1px solid var(--color-bg);
|
|
}
|
|
input[type="text"]:focus {
|
|
outline: none;
|
|
border: 1px solid var(--color-fg-tertiary);
|
|
}
|
|
textarea {
|
|
border: 1px solid var(--color-bg);
|
|
}
|
|
textarea:focus {
|
|
outline: none;
|
|
border: 1px solid var(--color-fg-tertiary);
|
|
}
|
|
input[type="password"] {
|
|
border: 1px solid var(--color-bg);
|
|
}
|
|
input[type="password"]:focus {
|
|
outline: none;
|
|
border: 1px solid var(--color-fg-tertiary);
|
|
}
|
|
input[type="checkbox"]:focus {
|
|
outline: none;
|
|
border: 1px solid var(--color-fg-tertiary);
|
|
}
|
|
|
|
button:hover {
|
|
cursor: pointer;
|
|
}
|
|
button:disabled:hover,
|
|
button[disabled]:hover {
|
|
cursor: default;
|
|
}
|
|
|
|
button.large-button {
|
|
background: var(--color-bg);
|
|
}
|
|
button.large-button:hover {
|
|
background: var(--color-bg-tertiary);
|
|
}
|
|
button.large-button:disabled:hover,
|
|
button.large-button[disabled]:hover {
|
|
background: var(--color-bg);
|
|
}
|
|
|
|
button.period-selector {
|
|
color: var(--color-fg-secondary);
|
|
}
|
|
button.period-selector:disabled,
|
|
button.period-selector[disabled]:hover {
|
|
color: var(--color-fg);
|
|
}
|
|
button.period-selector:hover {
|
|
color: var(--color-fg);
|
|
}
|
|
|
|
button.default {
|
|
color: var(--color-fg);
|
|
}
|
|
button.default:disabled,
|
|
button.default[disabled]:hover {
|
|
color: var(--color-fg-secondary);
|
|
}
|
|
button.default:hover {
|
|
color: var(--color-fg-secondary);
|
|
} |