mirror of
https://github.com/QuivrHQ/quivr.git
synced 2024-12-15 17:43:03 +03:00
b888524dbf
# Description Please include a summary of the changes and the related issue. Please also include relevant motivation and context. ## Checklist before requesting a review Please delete options that are not relevant. - [ ] My code follows the style guidelines of this project - [ ] I have performed a self-review of my code - [ ] I have commented hard-to-understand areas - [ ] I have ideally added tests that prove my fix is effective or that my feature works - [ ] New and existing unit tests pass locally with my changes - [ ] Any dependent changes have been merged ## Screenshots (if appropriate): --------- Co-authored-by: Stan Girard <girard.stanislas@gmail.com>
197 lines
3.9 KiB
CSS
197 lines
3.9 KiB
CSS
@import "tailwindcss/base";
|
|
@import "tailwindcss/components";
|
|
@import "tailwindcss/utilities";
|
|
@import './colors.css';
|
|
|
|
main {
|
|
@apply max-w-screen-xl mx-auto flex flex-col;
|
|
}
|
|
|
|
header,
|
|
section {
|
|
@apply px-5 md:px-10;
|
|
}
|
|
|
|
a {
|
|
@apply hover:text-primary dark:hover:text-gray-200 transition-colors;
|
|
}
|
|
|
|
div:focus {
|
|
@apply outline-none;
|
|
}
|
|
|
|
@layer utilities {
|
|
.scrollbar::-webkit-scrollbar {
|
|
@apply w-2 h-2;
|
|
}
|
|
|
|
.scrollbar::-webkit-scrollbar-track {
|
|
/* border-radius: 5px; */
|
|
/* background: #fff; */
|
|
@apply bg-white dark:bg-black;
|
|
}
|
|
|
|
.scrollbar::-webkit-scrollbar-thumb {
|
|
/* background: #000; */
|
|
/* border-radius: 100vh; */
|
|
/* border: 3px solid #fff; */
|
|
@apply bg-gray-200 dark:bg-gray-600 border border-white rounded-sm;
|
|
}
|
|
|
|
.scrollbar::-webkit-scrollbar-thumb:hover {
|
|
/* background: #000; */
|
|
@apply bg-gray-500;
|
|
}
|
|
|
|
.h-fill-available {
|
|
/* fixes the h-[100vh] issue on mobile */
|
|
/* like height: -webkit-fill-available; but for any device (android and iphone) */
|
|
@apply h-[100vh] supports-[height:100cqh]:h-[100cqh] supports-[height:100svh]:h-[100svh];
|
|
}
|
|
}
|
|
|
|
:root {
|
|
/* Backgrounds */
|
|
--background-0: var(--white-0);
|
|
--background-1: var(--white-1);
|
|
--background-2: var(--grey-6);
|
|
--background-3: var(--grey-4);
|
|
--background-4: var(--grey-0);
|
|
--background-5: var(--black-0);
|
|
--background-primary-0: var(--primary-2);
|
|
--background-primary-1: var(--primary-1);
|
|
--background-blur: rgba(0, 0, 0, 0.9);
|
|
--background-success: var(--success-lightest);
|
|
--background-error: var(--dangerous-lightest);
|
|
|
|
/* Borders */
|
|
--border-0: var(--grey-5);
|
|
--border-1: var(--grey-4);
|
|
--border-2: var(--grey-2);
|
|
|
|
/* Icons */
|
|
--icon-0: var(--white-0);
|
|
--icon-1: var(--grey-2);
|
|
--icon-2: var(--grey-0);
|
|
--icon-3: var(--black-0);
|
|
|
|
/* Text */
|
|
--text-0: var(--white-0);
|
|
--text-1: var(--grey-2);
|
|
--text-2: var(--grey-0);
|
|
--text-3: var(--black-0);
|
|
--text-4: var(--grey-1);
|
|
|
|
/* Box Shadow */
|
|
--box-shadow: rgba(0, 0, 0, 0.25);
|
|
}
|
|
|
|
body.dark_mode {
|
|
/* Backgrounds */
|
|
--background-0: var(--black-1);
|
|
--background-1: var(--black-0);
|
|
--background-2: var(--black-2);
|
|
--background-3: var(--black-3);
|
|
--background-4: var(--black-4);
|
|
--background-5: var(--black-5);
|
|
--background-primary-0: var(--black-5);
|
|
--background-primary-1: var(--black-5);
|
|
--background-opposite: var(--white-0);
|
|
--background-blur: rgba(0, 0, 0, 0.9);
|
|
--background-success: var(--black-5);
|
|
--background-error: var(--black-5);
|
|
|
|
/* Borders */
|
|
--border-0: var(--black-5);
|
|
--border-1: var(--black-6);
|
|
--border-2: var(--black-7);
|
|
|
|
/* Icons */
|
|
--icon-0: var(--black-0);
|
|
--icon-1: var(--grey-0);
|
|
--icon-2: var(--grey-2);
|
|
--icon-3: var(--white-0);
|
|
|
|
/* Text */
|
|
--text-0: var(--black-0);
|
|
--text-1: var(--grey-0);
|
|
--text-2: var(--grey-2);
|
|
--text-3: var(--white-2);
|
|
--text-4: var(--grey-1);
|
|
|
|
/* Box Shadow */
|
|
--box-shadow: rgba(255, 255, 255, 0.25);
|
|
}
|
|
|
|
.token.comment,
|
|
.token.block-comment,
|
|
.token.prolog,
|
|
.token.doctype,
|
|
.token.cdata {
|
|
color: var(--code-very-dark-grey);
|
|
font-style: italic;
|
|
}
|
|
|
|
.token.punctuation {
|
|
color: var(--code-dark-grey);
|
|
}
|
|
|
|
.token.property,
|
|
.token.tag,
|
|
.token.constant,
|
|
.token.symbol,
|
|
.token.deleted {
|
|
color: var(--code-red);
|
|
}
|
|
|
|
.token.boolean,
|
|
.token.number {
|
|
color: var(--code-purple);
|
|
}
|
|
|
|
.token.selector,
|
|
.token.attr-name,
|
|
.token.string,
|
|
.token.char,
|
|
.token.builtin,
|
|
.token.inserted {
|
|
color: var(--code-green);
|
|
}
|
|
|
|
.token.operator,
|
|
.token.entity,
|
|
.token.url,
|
|
.language-css .token.string,
|
|
.style .token.string,
|
|
.token.variable {
|
|
color: var(--code-grey);
|
|
}
|
|
|
|
.token.atrule,
|
|
.token.attr-value,
|
|
.token.function,
|
|
.token.class-name {
|
|
color: var(--code-yellow);
|
|
}
|
|
|
|
.token.keyword {
|
|
color: var(--code-blue);
|
|
}
|
|
|
|
.token.regex,
|
|
.token.important {
|
|
color: var(--code-orange);
|
|
}
|
|
|
|
.token.important,
|
|
.token.bold {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.token.italic {
|
|
font-style: italic;
|
|
}
|
|
|
|
.token.entity {
|
|
cursor: help;
|
|
} |