156 lines
3.5 KiB
CSS
156 lines
3.5 KiB
CSS
@import "tailwindcss";
|
|
|
|
@theme inline {
|
|
--breakpoint-xs: 350px;
|
|
|
|
--color-background-light: #ffffff;
|
|
--color-foreground-light: #171717;
|
|
--color-background-dark: #0a0a0a;
|
|
--color-foreground-dark: #ededed;
|
|
|
|
--color-dark: #000000;
|
|
|
|
--color-primary: #000000;
|
|
--color-primary-hover: #29292b;
|
|
--color-primary-outline: #29292b;
|
|
--color-primary-text: #29292b;
|
|
--color-primary-dark: #29292b;
|
|
--color-primary-dark-hover: #4b4b4b;
|
|
--color-primary-dark-outline: #4b4b4b;
|
|
--color-primary-dark-text: #ffffff;
|
|
|
|
--color-secondary: #000000;
|
|
--color-secondary-hover: #dddddd;
|
|
--color-secondary-outline: #dddddd;
|
|
--color-secondary-text: #dddddd;
|
|
--color-secondary-dark: #000000;
|
|
--color-secondary-dark-hover: #dddddd;
|
|
--color-secondary-dark-outline: #dddddd;
|
|
--color-secondary-dark-text: #dddddd;
|
|
|
|
--color-accent: #000000;
|
|
--color-accent-hover: #dddddd;
|
|
--color-accent-outline: #dddddd;
|
|
--color-accent-text: #dddddd;
|
|
--color-accent-dark: #000000;
|
|
--color-accent-dark-hover: #dddddd;
|
|
--color-accent-dark-outline: #dddddd;
|
|
--color-accent-dark-text: #dddddd;
|
|
|
|
--color-gray: #dfe6ef;
|
|
--color-gray-hover: #dfe6ef;
|
|
--color-gray-dark: #1d2b3f;
|
|
--color-gray-dark-hover: #132033;
|
|
|
|
--color-success: #0aa156;
|
|
--color-success-dark: #0aa156;
|
|
|
|
--color-error: #e5484d;
|
|
--color-error-dark: #e5484d;
|
|
|
|
--color-warning: #ff6900;
|
|
|
|
--color-link: #0051c9;
|
|
--color-link-dark: #548adb;
|
|
|
|
--radius-default: 5px;
|
|
--radius-default-sm: 3px;
|
|
--radius-default-xs: 1px;
|
|
--radius-default-lg: 7px;
|
|
--radius-default-xl: 10px;
|
|
}
|
|
|
|
@custom-variant dark (&:where(.dark, .dark *));
|
|
|
|
body {
|
|
@apply bg-background-light dark:bg-background-dark;
|
|
@apply text-foreground-light dark:text-foreground-dark;
|
|
font-family: Arial, Helvetica, sans-serif;
|
|
}
|
|
|
|
.tox-tinymce {
|
|
@apply w-full !rounded-default !border-slate-300 dark:!border-white/20;
|
|
}
|
|
|
|
/* .moving-object {
|
|
@apply !bg-green-500;
|
|
} */
|
|
|
|
option {
|
|
@apply dark:bg-background-dark;
|
|
}
|
|
|
|
.mobile-paper-hidden {
|
|
@apply max-md:p-0 max-md:border-none max-md:bg-transparent;
|
|
}
|
|
|
|
::-webkit-scrollbar {
|
|
@apply w-2;
|
|
}
|
|
|
|
::-webkit-scrollbar-track {
|
|
@apply bg-gray rounded-full dark:bg-gray;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
@apply bg-foreground-light/40 rounded-full hover:bg-foreground-light/60;
|
|
@apply dark:bg-foreground-dark/40 rounded-full hover:bg-foreground-dark/60;
|
|
}
|
|
|
|
* {
|
|
scrollbar-width: thin;
|
|
scrollbar-color: theme("colors.gray.400") theme("colors.gray.100");
|
|
}
|
|
|
|
@supports (selector(:where(*))) {
|
|
:where(*) {
|
|
scrollbar-width: thin;
|
|
scrollbar-color: theme("colors.gray.400") theme("colors.gray.100");
|
|
}
|
|
|
|
.dark :where(*) {
|
|
scrollbar-color: theme("colors.gray.500") theme("colors.gray.800");
|
|
}
|
|
}
|
|
|
|
.ace_editor {
|
|
@apply dark:bg-background-dark;
|
|
}
|
|
|
|
.tox-editor-header,
|
|
.tox-toolbar-overlord,
|
|
.tox .tox-toolbar,
|
|
.tox .tox-toolbar__overflow,
|
|
.tox .tox-toolbar__primary,
|
|
.tox .tox-tbtn,
|
|
.tox .tox-sidebar,
|
|
.tox .tox-statusbar,
|
|
.tox .tox-view-wrap,
|
|
.tox .tox-view-wrap__slot-container,
|
|
.tox .tox-editor-container,
|
|
.tox .tox-edit-area__iframe,
|
|
.twui-tinymce {
|
|
@apply dark:!bg-background-dark;
|
|
}
|
|
|
|
.twui-tinymce *:focus {
|
|
@apply !outline-white/10;
|
|
}
|
|
|
|
.tox .tox-tbtn:hover {
|
|
@apply dark:!bg-white/10;
|
|
}
|
|
|
|
.ace_gutter {
|
|
@apply dark:!bg-background-dark;
|
|
}
|
|
|
|
.ace_active-line,
|
|
.ace_gutter-active-line {
|
|
@apply dark:!bg-white/5;
|
|
}
|
|
|
|
.normal-text {
|
|
@apply text-foreground-light dark:text-foreground-dark;
|
|
}
|