mirror of
https://github.com/StanGirard/quivr.git
synced 2024-12-13 16:47:43 +03:00
d7d1a0155b
# 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):
118 lines
2.7 KiB
CSS
118 lines
2.7 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-5);
|
|
--background-3: var(--grey-3);
|
|
--background-4: var(--grey-0);
|
|
--background-5: var(--black-0);
|
|
--background-special-0: var(--primary-2);
|
|
--background-special-1: var(--primary-1);
|
|
--background-blur: rgba(0, 0, 0, 0.9);
|
|
|
|
/* Borders */
|
|
--border-0: var(--grey-4);
|
|
--border-1: var(--grey-3);
|
|
--border-2: var(--grey-1);
|
|
|
|
/* Icons */
|
|
--icon-0: var(--white-0);
|
|
--icon-1: var(--grey-1);
|
|
--icon-2: var(--grey-0);
|
|
--icon-3: var(--black-0);
|
|
|
|
/* Text */
|
|
--text-0: var(--white-0);
|
|
--text-1: var(--grey-1);
|
|
--text-2: var(--grey-0);
|
|
--text-3: var(--black-0);
|
|
|
|
/* Box Shadow */
|
|
--box-shadow: rgba(0, 0, 0, 0.25);
|
|
}
|
|
|
|
body.dark_mode {
|
|
/* Backgrounds */
|
|
--background-0: var(--black-0);
|
|
--background-1: var(--black-1);
|
|
--background-2: var(--black-2);
|
|
--background-3: var(--black-3);
|
|
--background-4: var(--black-4);
|
|
--background-5: var(--black-5);
|
|
--background-special-0: var(--black-3);
|
|
--background-special-1: var(--black-5);
|
|
--background-opposite: var(--white-0);
|
|
--background-blur: rgba(0, 0, 0, 0.9);
|
|
|
|
/* Borders */
|
|
--border-0: var(--white-0);
|
|
--border-1: var(--grey-1);
|
|
--border-2: var(--grey-2);
|
|
|
|
/* Icons */
|
|
--icon-0: var(--black-0);
|
|
--icon-1: var(--grey-0);
|
|
--icon-2: var(--grey-1);
|
|
--icon-3: var(--white-0);
|
|
|
|
/* Text */
|
|
--text-0: var(--black-0);
|
|
--text-1: var(--grey-0);
|
|
--text-2: var(--grey-1);
|
|
--text-3: var(--white-0);
|
|
|
|
/* Box Shadow */
|
|
--box-shadow: rgba(255, 255, 255, 0.25);
|
|
} |