kamp/anything-llm
1
0
Fork 0
mirror of https://github.com/Mintplex-Labs/anything-llm.git synced 2024-11-10 17:00:11 +01:00
Code Issues Packages Projects Releases Wiki Activity

[CHORE] Clean up text and bg hex colors (#1685)

Browse Source 
clean up text and bg hex colors

Co-authored-by: Timothy Carambat <rambat1010@gmail.com>
This commit is contained in:
Sean Hatfield 2024-06-17 14:55:56 -07:00 committed by GitHub
parent c5ba2d73d0
commit c8c618137f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
36 changed files with 94 additions and 86 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/components/ContextualSaveBar/index.jsx
View File

@ -8,7 +8,7 @@ export default function ContextualSaveBar({
if (!showing) return null;
return (
<div className="fixed top-0 left-0 right-0 h-14 bg-[#18181B] flex items-center justify-end px-4 z-[999]">
<div className="fixed top-0 left-0 right-0 h-14 bg-dark-input flex items-center justify-end px-4 z-[999]">
<div className="absolute ml-4 left-0 md:left-1/2 transform md:-translate-x-1/2 flex items-center gap-x-2">
<Warning size={18} className="text-white" />
<p className="text-white font-medium text-xs">Unsaved Changes</p>
@ -21,7 +21,7 @@ export default function ContextualSaveBar({
Cancel
</button>
<button
className="border-none text-[#222628] font-medium text-sm px-[10px] py-[6px] rounded-md bg-[#46C8FF] hover:bg-[#3DB5E8]"
className="border-none text-dark-text font-medium text-sm px-[10px] py-[6px] rounded-md bg-primary-button hover:bg-[#3DB5E8]"
onClick={onSave}
>
Save

2
frontend/src/components/EmbeddingSelection/EmbedderItem/index.jsx
View File

@ -29,7 +29,7 @@ export default function EmbedderItem({
/>
<div className="flex flex-col">
<div className="text-sm font-semibold text-white">{name}</div>
<div className="mt-1 text-xs text-[#D2D5DB]">{description}</div>
<div className="mt-1 text-xs text-description">{description}</div>
</div>
</div>
</div>

2
frontend/src/components/LLMSelection/LLMItem/index.jsx
View File

@ -29,7 +29,7 @@ export default function LLMItem({
/>
<div className="flex flex-col">
<div className="text-sm font-semibold text-white">{name}</div>
<div className="mt-1 text-xs text-[#D2D5DB]">{description}</div>
<div className="mt-1 text-xs text-description">{description}</div>
</div>
</div>
</div>

6
frontend/src/components/Modals/DisplayRecoveryCodeModal/index.jsx
View File

@ -32,7 +32,7 @@ export default function RecoveryCodeModal({
};
return (
<div className="inline-block bg-[#2C2F36] rounded-lg text-left overflow-hidden shadow-xl transform transition-all border-2 border-[#BCC9DB]/10 w-[600px] mx-4">
<div className="inline-block bg-secondary rounded-lg text-left overflow-hidden shadow-xl transform transition-all border-2 border-[#BCC9DB]/10 w-[600px] mx-4">
<div className="md:py-[35px] md:px-[50px] py-[28px] px-[20px]">
<div className="flex gap-x-2">
<Key size={24} className="text-white" weight="bold" />
@ -51,7 +51,7 @@ export default function RecoveryCodeModal({
<b className="mt-4">These recovery codes are only shown once!</b>
</p>
<div
className="bg-[#1C1E21] text-white hover:text-[#46C8FF]
className="bg-dark-highlight text-white hover:text-primary-button
flex items-center justify-center rounded-md mt-6 cursor-pointer"
onClick={handleCopyToClipboard}
>
@ -68,7 +68,7 @@ export default function RecoveryCodeModal({
<div className="flex w-full justify-center items-center p-3 space-x-2 rounded-b border-gray-500/50 -mt-4 mb-4">
<button
type="button"
className="transition-all duration-300 text-xs md:w-[500px] md:h-[34px] h-[48px] w-full m-2 font-semibold rounded-lg bg-[#46C8FF] hover:bg-[#2C2F36] border-2 border-transparent hover:border-[#46C8FF] hover:text-white whitespace-nowrap shadow-[0_4px_14px_rgba(0,0,0,0.25)] flex justify-center items-center gap-x-2"
className="transition-all duration-300 text-xs md:w-[500px] md:h-[34px] h-[48px] w-full m-2 font-semibold rounded-lg bg-primary-button hover:bg-secondary border-2 border-transparent hover:border-[#46C8FF] hover:text-white whitespace-nowrap shadow-[0_4px_14px_rgba(0,0,0,0.25)] flex justify-center items-center gap-x-2"
onClick={downloadClicked ? handleClose : downloadRecoveryCodes}
>
{downloadClicked ? (

2
frontend/src/components/Modals/ManageWorkspace/DataConnectors/Connectors/Confluence/index.jsx
View File

@ -146,7 +146,7 @@ export default function ConfluenceOptions() {
<button
type="submit"
disabled={loading}
className="mt-2 w-full justify-center border border-slate-200 px-4 py-2 rounded-lg text-[#222628] text-sm font-bold items-center flex gap-x-2 bg-slate-200 hover:bg-slate-300 hover:text-slate-800 disabled:bg-slate-300 disabled:cursor-not-allowed"
className="mt-2 w-full justify-center border border-slate-200 px-4 py-2 rounded-lg text-dark-text text-sm font-bold items-center flex gap-x-2 bg-slate-200 hover:bg-slate-300 hover:text-slate-800 disabled:bg-slate-300 disabled:cursor-not-allowed"
>
{loading ? "Collecting pages..." : "Submit"}
</button>

2
frontend/src/components/Modals/ManageWorkspace/DataConnectors/Connectors/Github/index.jsx
View File

@ -146,7 +146,7 @@ export default function GithubOptions() {
<button
type="submit"
disabled={loading}
className="mt-2 w-full justify-center border border-slate-200 px-4 py-2 rounded-lg text-[#222628] text-sm font-bold items-center flex gap-x-2 bg-slate-200 hover:bg-slate-300 hover:text-slate-800 disabled:bg-slate-300 disabled:cursor-not-allowed"
className="mt-2 w-full justify-center border border-slate-200 px-4 py-2 rounded-lg text-dark-text text-sm font-bold items-center flex gap-x-2 bg-slate-200 hover:bg-slate-300 hover:text-slate-800 disabled:bg-slate-300 disabled:cursor-not-allowed"
>
{loading ? "Collecting files..." : "Submit"}
</button>

2
frontend/src/components/Modals/ManageWorkspace/DataConnectors/Connectors/WebsiteDepth/index.jsx
View File

@ -116,7 +116,7 @@ export default function WebsiteDepthOptions() {
disabled={loading}
className={`mt-2 w-full ${
loading ? "cursor-not-allowed animate-pulse" : ""
} justify-center border border-slate-200 px-4 py-2 rounded-lg text-[#222628] text-sm font-bold items-center flex gap-x-2 bg-slate-200 hover:bg-slate-300 hover:text-slate-800 disabled:bg-slate-300 disabled:cursor-not-allowed`}
} justify-center border border-slate-200 px-4 py-2 rounded-lg text-dark-text text-sm font-bold items-center flex gap-x-2 bg-slate-200 hover:bg-slate-300 hover:text-slate-800 disabled:bg-slate-300 disabled:cursor-not-allowed`}
>
{loading ? "Scraping website..." : "Submit"}
</button>

2
frontend/src/components/Modals/ManageWorkspace/DataConnectors/Connectors/Youtube/index.jsx
View File

@ -73,7 +73,7 @@ export default function YoutubeOptions() {
<button
type="submit"
disabled={loading}
className="mt-2 w-full justify-center border border-slate-200 px-4 py-2 rounded-lg text-[#222628] text-sm font-bold items-center flex gap-x-2 bg-slate-200 hover:bg-slate-300 hover:text-slate-800 disabled:bg-slate-300 disabled:cursor-not-allowed"
className="mt-2 w-full justify-center border border-slate-200 px-4 py-2 rounded-lg text-dark-text text-sm font-bold items-center flex gap-x-2 bg-slate-200 hover:bg-slate-300 hover:text-slate-800 disabled:bg-slate-300 disabled:cursor-not-allowed"
>
{loading ? "Collecting transcript..." : "Collect transcript"}
</button>

2
frontend/src/components/Modals/ManageWorkspace/Documents/Directory/FolderRow/index.jsx
View File

@ -22,7 +22,7 @@ export default function FolderRow({
<>
<tr
onClick={onRowClick}
className={`text-white/80 text-xs grid grid-cols-12 py-2 pl-3.5 pr-8 bg-[#1C1E21] hover:bg-sky-500/20 cursor-pointer w-full file-row ${
className={`text-white/80 text-xs grid grid-cols-12 py-2 pl-3.5 pr-8 bg-dark-highlight hover:bg-sky-500/20 cursor-pointer w-full file-row ${
selected ? "selected" : ""
}`}
>

6
frontend/src/components/Modals/ManageWorkspace/Documents/Directory/index.jsx
View File

@ -256,9 +256,9 @@ function Directory({
onClick={() =>
setShowFolderSelection(!showFolderSelection)
}
className="border-none text-sm font-semibold bg-white h-[32px] w-[32px] rounded-lg text-[#222628] hover:bg-neutral-800/80 flex justify-center items-center group"
className="border-none text-sm font-semibold bg-white h-[32px] w-[32px] rounded-lg text-dark-text hover:bg-neutral-800/80 flex justify-center items-center group"
>
<MoveToFolderIcon className="text-[#222628] group-hover:text-white" />
<MoveToFolderIcon className="text-dark-text group-hover:text-white" />
</button>
{showFolderSelection && (
<FolderSelectionPopup
@ -272,7 +272,7 @@ function Directory({
</div>
<button
onClick={deleteFiles}
className="border-none text-sm font-semibold bg-white h-[32px] w-[32px] rounded-lg text-[#222628] hover:text-white hover:bg-neutral-800/80 flex justify-center items-center"
className="border-none text-sm font-semibold bg-white h-[32px] w-[32px] rounded-lg text-dark-text hover:text-white hover:bg-neutral-800/80 flex justify-center items-center"
>
<Trash size={18} weight="bold" />
</button>

10
frontend/src/components/Modals/Password/MultiUserAuth.jsx
View File

@ -81,13 +81,13 @@ const RecoveryForm = ({ onSubmit, setShowRecoveryForm }) => {
<div className="flex items-center md:p-12 md:px-0 px-6 mt-12 md:mt-0 space-x-2 border-gray-600 w-full flex-col gap-y-8">
<button
type="submit"
className="md:text-[#46C8FF] md:bg-transparent md:w-[300px] text-[#222628] text-sm font-bold focus:ring-4 focus:outline-none rounded-md border-[1.5px] border-[#46C8FF] md:h-[34px] h-[48px] md:hover:text-white md:hover:bg-[#46C8FF] bg-[#46C8FF] focus:z-10 w-full"
className="md:text-primary-button md:bg-transparent md:w-[300px] text-dark-text text-sm font-bold focus:ring-4 focus:outline-none rounded-md border-[1.5px] border-[#46C8FF] md:h-[34px] h-[48px] md:hover:text-white md:hover:bg-primary-button bg-primary-button focus:z-10 w-full"
>
Reset Password
</button>
<button
type="button"
className="text-white text-sm flex gap-x-1 hover:text-[#46C8FF] hover:underline -mb-8"
className="text-white text-sm flex gap-x-1 hover:text-primary-button hover:underline -mb-8"
onClick={() => setShowRecoveryForm(false)}
>
Back to Login
@ -150,7 +150,7 @@ const ResetPasswordForm = ({ onSubmit }) => {
<div className="flex items-center md:p-12 md:px-0 px-6 mt-12 md:mt-0 space-x-2 border-gray-600 w-full flex-col gap-y-8">
<button
type="submit"
className="md:text-[#46C8FF] md:bg-transparent md:w-[300px] text-[#222628] text-sm font-bold focus:ring-4 focus:outline-none rounded-md border-[1.5px] border-[#46C8FF] md:h-[34px] h-[48px] md:hover:text-white md:hover:bg-[#46C8FF] bg-[#46C8FF] focus:z-10 w-full"
className="md:text-primary-button md:bg-transparent md:w-[300px] text-dark-text text-sm font-bold focus:ring-4 focus:outline-none rounded-md border-[1.5px] border-[#46C8FF] md:h-[34px] h-[48px] md:hover:text-white md:hover:bg-primary-button bg-primary-button focus:z-10 w-full"
>
Reset Password
</button>
@ -319,13 +319,13 @@ export default function MultiUserAuth() {
<button
disabled={loading}
type="submit"
className="md:text-[#46C8FF] md:bg-transparent text-[#222628] text-sm font-bold focus:ring-4 focus:outline-none rounded-md border-[1.5px] border-[#46C8FF] md:h-[34px] h-[48px] md:hover:text-white md:hover:bg-[#46C8FF] bg-[#46C8FF] focus:z-10 w-full"
className="md:text-primary-button md:bg-transparent text-dark-text text-sm font-bold focus:ring-4 focus:outline-none rounded-md border-[1.5px] border-[#46C8FF] md:h-[34px] h-[48px] md:hover:text-white md:hover:bg-primary-button bg-primary-button focus:z-10 w-full"
>
{loading ? "Validating..." : "Login"}
</button>
<button
type="button"
className="text-white text-sm flex gap-x-1 hover:text-[#46C8FF] hover:underline"
className="text-white text-sm flex gap-x-1 hover:text-primary-button hover:underline"
onClick={handleResetPassword}
>
Forgot password?<b>Reset</b>

2
frontend/src/components/Modals/Password/SingleUserAuth.jsx
View File

@ -104,7 +104,7 @@ export default function SingleUserAuth() {
<button
disabled={loading}
type="submit"
className="md:text-[#46C8FF] md:bg-transparent text-[#222628] text-sm font-bold focus:ring-4 focus:outline-none rounded-md border-[1.5px] border-[#46C8FF] md:h-[34px] h-[48px] md:hover:text-white md:hover:bg-[#46C8FF] bg-[#46C8FF] focus:z-10 w-full"
className="md:text-primary-button md:bg-transparent text-dark-text text-sm font-bold focus:ring-4 focus:outline-none rounded-md border-[1.5px] border-[#46C8FF] md:h-[34px] h-[48px] md:hover:text-white md:hover:bg-primary-button bg-primary-button focus:z-10 w-full"
>
{loading ? "Validating..." : "Login"}
</button>

2
frontend/src/components/VectorDBSelection/VectorDBItem/index.jsx
View File

@ -29,7 +29,7 @@ export default function VectorDBItem({
/>
<div className="flex flex-col">
<div className="text-sm font-semibold text-white">{name}</div>
<div className="mt-1 text-xs text-[#D2D5DB]">{description}</div>
<div className="mt-1 text-xs text-description">{description}</div>
</div>
</div>
</div>

2
frontend/src/components/lib/CTAButton/index.jsx
View File

@ -8,7 +8,7 @@ export default function CTAButton({
<button
disabled={disabled}
onClick={() => onClick?.()}
className={`text-xs px-4 py-1 font-semibold rounded-lg bg-[#46C8FF] hover:bg-[#2C2F36] hover:text-white h-[34px] -mr-8 whitespace-nowrap shadow-[0_4px_14px_rgba(0,0,0,0.25)] w-fit ${className}`}
className={`text-xs px-4 py-1 font-semibold rounded-lg bg-primary-button hover:bg-secondary hover:text-white h-[34px] -mr-8 whitespace-nowrap shadow-[0_4px_14px_rgba(0,0,0,0.25)] w-fit ${className}`}
>
<div className="flex items-center justify-center gap-2">{children}</div>
</button>

2
frontend/src/index.css
View File

@ -616,7 +616,7 @@ dialog::backdrop {
}
.file-row:nth-child(even) {
@apply bg-[#1C1E21];
@apply bg-dark-highlight;
}
.file-row:nth-child(odd) {

2
frontend/src/pages/Admin/Agents/SQLConnectorSelection/DBConnection.jsx
View File

@ -33,7 +33,7 @@ export default function DBConnection({ connection, onRemove, setHasChanges }) {
<div className="flex w-full items-center justify-between">
<div className="flex flex-col">
<div className="text-sm font-semibold text-white">{database_id}</div>
<div className="mt-1 text-xs text-[#D2D5DB]">{engine}</div>
<div className="mt-1 text-xs text-description">{engine}</div>
</div>
<button
type="button"

2
frontend/src/pages/Admin/Agents/SQLConnectorSelection/NewConnectionModal.jsx
View File

@ -239,7 +239,7 @@ export default function NewSQLConnection({ isOpen, closeModal, onSubmit }) {
<button
type="submit"
form="sql-connection-form"
className="border-none text-xs px-2 py-1 font-semibold rounded-lg bg-[#46C8FF] hover:bg-[#2C2F36] border-2 border-transparent hover:border-[#46C8FF] hover:text-white h-[32px] w-fit -mr-8 whitespace-nowrap shadow-[0_4px_14px_rgba(0,0,0,0.25)]"
className="border-none text-xs px-2 py-1 font-semibold rounded-lg bg-primary-button hover:bg-secondary border-2 border-transparent hover:border-[#46C8FF] hover:text-white h-[32px] w-fit -mr-8 whitespace-nowrap shadow-[0_4px_14px_rgba(0,0,0,0.25)]"
>
Save connection
</button>

2
frontend/src/pages/Admin/Agents/WebSearchSelection/SearchProviderItem/index.jsx
View File

@ -19,7 +19,7 @@ export default function SearchProviderItem({ provider, checked, onClick }) {
<img src={logo} alt={`${name} logo`} className="w-10 h-10 rounded-md" />
<div className="flex flex-col">
<div className="text-sm font-semibold text-white">{name}</div>
<div className="mt-1 text-xs text-[#D2D5DB]">{description}</div>
<div className="mt-1 text-xs text-description">{description}</div>
</div>
</div>
</div>

10
frontend/src/pages/Admin/Agents/WebSearchSelection/index.jsx
View File

@ -149,9 +149,9 @@ export default function AgentWebSearchSelection({
/>
)}
{searchMenuOpen ? (
<div className="absolute top-0 left-0 w-full max-w-[640px] max-h-[310px] overflow-auto white-scrollbar min-h-[64px] bg-[#18181B] rounded-lg flex flex-col justify-between cursor-pointer border-2 border-[#46C8FF] z-20">
<div className="absolute top-0 left-0 w-full max-w-[640px] max-h-[310px] overflow-auto white-scrollbar min-h-[64px] bg-dark-input rounded-lg flex flex-col justify-between cursor-pointer border-2 border-[#46C8FF] z-20">
<div className="w-full flex flex-col gap-y-1">
<div className="flex items-center sticky top-0 border-b border-[#9CA3AF] mx-4 bg-[#18181B]">
<div className="flex items-center sticky top-0 border-b border-[#9CA3AF] mx-4 bg-dark-input">
<MagnifyingGlass
size={20}
weight="bold"
@ -172,7 +172,7 @@ export default function AgentWebSearchSelection({
<X
size={20}
weight="bold"
className="cursor-pointer text-white hover:text-[#9CA3AF]"
className="cursor-pointer text-white hover:text-x-button"
onClick={handleXButton}
/>
</div>
@ -192,7 +192,7 @@ export default function AgentWebSearchSelection({
</div>
) : (
<button
className="w-full max-w-[640px] h-[64px] bg-[#18181B] rounded-lg flex items-center p-[14px] justify-between cursor-pointer border-2 border-transparent hover:border-[#46C8FF] transition-all duration-300"
className="w-full max-w-[640px] h-[64px] bg-dark-input rounded-lg flex items-center p-[14px] justify-between cursor-pointer border-2 border-transparent hover:border-[#46C8FF] transition-all duration-300"
type="button"
onClick={() => setSearchMenuOpen(true)}
>
@ -206,7 +206,7 @@ export default function AgentWebSearchSelection({
<div className="text-sm font-semibold text-white">
{selectedSearchProviderObject.name}
</div>
<div className="mt-1 text-xs text-[#D2D5DB]">
<div className="mt-1 text-xs text-description">
{selectedSearchProviderObject.description}
</div>
</div>

2
frontend/src/pages/GeneralSettings/Appearance/CustomMessages/index.jsx
View File

@ -62,7 +62,7 @@ export default function CustomMessages() {
Customize the automatic messages displayed to your users.
</p>
</div>
<div className="mt-3 flex flex-col gap-y-6 bg-[#1C1E21] rounded-lg pr-[31px] pl-[12px] pt-4 max-w-[700px]">
<div className="mt-3 flex flex-col gap-y-6 bg-dark-highlight rounded-lg pr-[31px] pl-[12px] pt-4 max-w-[700px]">
{messages.map((message, index) => (
<div key={index} className="flex flex-col gap-y-2">
{message.user && (

4
frontend/src/pages/GeneralSettings/Appearance/FooterCustomization/NewIconForm/index.jsx
View File

@ -56,7 +56,7 @@ export default function NewIconForm({ icon, url, onSave, onRemove }) {
<form onSubmit={handleSubmit} className="flex items-center gap-x-1.5">
<div className="relative" ref={dropdownRef}>
<div
className="h-[34px] w-[34px] bg-[#1C1E21] rounded-full flex items-center justify-center cursor-pointer"
className="h-[34px] w-[34px] bg-dark-highlight rounded-full flex items-center justify-center cursor-pointer"
onClick={() => setIsDropdownOpen(!isDropdownOpen)}
>
{React.createElement(ICON_COMPONENTS[selectedIcon] || Plus, {
@ -70,7 +70,7 @@ export default function NewIconForm({ icon, url, onSave, onRemove }) {
<button
key={iconName}
type="button"
className="flex justify-center items-center border border-transparent hover:bg-[#1C1E21] hover:border-slate-100 rounded-full p-2"
className="flex justify-center items-center border border-transparent hover:bg-dark-highlight hover:border-slate-100 rounded-full p-2"
onClick={() => handleIconChange(iconName)}
>
{React.createElement(ICON_COMPONENTS[iconName], {

10
frontend/src/pages/GeneralSettings/AudioPreference/stt.jsx
View File

@ -109,9 +109,9 @@ export default function SpeechToTextProvider({ settings }) {
/>
)}
{searchMenuOpen ? (
<div className="absolute top-0 left-0 w-full max-w-[640px] max-h-[310px] overflow-auto white-scrollbar min-h-[64px] bg-[#18181B] rounded-lg flex flex-col justify-between cursor-pointer border-2 border-[#46C8FF] z-20">
<div className="absolute top-0 left-0 w-full max-w-[640px] max-h-[310px] overflow-auto white-scrollbar min-h-[64px] bg-dark-input rounded-lg flex flex-col justify-between cursor-pointer border-2 border-[#46C8FF] z-20">
<div className="w-full flex flex-col gap-y-1">
<div className="flex items-center sticky top-0 border-b border-[#9CA3AF] mx-4 bg-[#18181B]">
<div className="flex items-center sticky top-0 border-b border-[#9CA3AF] mx-4 bg-dark-input">
<MagnifyingGlass
size={20}
weight="bold"
@ -132,7 +132,7 @@ export default function SpeechToTextProvider({ settings }) {
<X
size={20}
weight="bold"
className="cursor-pointer text-white hover:text-[#9CA3AF]"
className="cursor-pointer text-white hover:text-x-button"
onClick={handleXButton}
/>
</div>
@ -153,7 +153,7 @@ export default function SpeechToTextProvider({ settings }) {
</div>
) : (
<button
className="w-full max-w-[640px] h-[64px] bg-[#18181B] rounded-lg flex items-center p-[14px] justify-between cursor-pointer border-2 border-transparent hover:border-[#46C8FF] transition-all duration-300"
className="w-full max-w-[640px] h-[64px] bg-dark-input rounded-lg flex items-center p-[14px] justify-between cursor-pointer border-2 border-transparent hover:border-[#46C8FF] transition-all duration-300"
type="button"
onClick={() => setSearchMenuOpen(true)}
>
@ -167,7 +167,7 @@ export default function SpeechToTextProvider({ settings }) {
<div className="text-sm font-semibold text-white">
{selectedProviderObject.name}
</div>
<div className="mt-1 text-xs text-[#D2D5DB]">
<div className="mt-1 text-xs text-description">
{selectedProviderObject.description}
</div>
</div>

10
frontend/src/pages/GeneralSettings/AudioPreference/tts.jsx
View File

@ -124,9 +124,9 @@ export default function TextToSpeechProvider({ settings }) {
/>
)}
{searchMenuOpen ? (
<div className="absolute top-0 left-0 w-full max-w-[640px] max-h-[310px] overflow-auto white-scrollbar min-h-[64px] bg-[#18181B] rounded-lg flex flex-col justify-between cursor-pointer border-2 border-[#46C8FF] z-20">
<div className="absolute top-0 left-0 w-full max-w-[640px] max-h-[310px] overflow-auto white-scrollbar min-h-[64px] bg-dark-input rounded-lg flex flex-col justify-between cursor-pointer border-2 border-[#46C8FF] z-20">
<div className="w-full flex flex-col gap-y-1">
<div className="flex items-center sticky top-0 border-b border-[#9CA3AF] mx-4 bg-[#18181B]">
<div className="flex items-center sticky top-0 border-b border-[#9CA3AF] mx-4 bg-dark-input">
<MagnifyingGlass
size={20}
weight="bold"
@ -147,7 +147,7 @@ export default function TextToSpeechProvider({ settings }) {
<X
size={20}
weight="bold"
className="cursor-pointer text-white hover:text-[#9CA3AF]"
className="cursor-pointer text-white hover:text-x-button"
onClick={handleXButton}
/>
</div>
@ -168,7 +168,7 @@ export default function TextToSpeechProvider({ settings }) {
</div>
) : (
<button
className="w-full max-w-[640px] h-[64px] bg-[#18181B] rounded-lg flex items-center p-[14px] justify-between cursor-pointer border-2 border-transparent hover:border-[#46C8FF] transition-all duration-300"
className="w-full max-w-[640px] h-[64px] bg-dark-input rounded-lg flex items-center p-[14px] justify-between cursor-pointer border-2 border-transparent hover:border-[#46C8FF] transition-all duration-300"
type="button"
onClick={() => setSearchMenuOpen(true)}
>
@ -182,7 +182,7 @@ export default function TextToSpeechProvider({ settings }) {
<div className="text-sm font-semibold text-white">
{selectedProviderObject.name}
</div>
<div className="mt-1 text-xs text-[#D2D5DB]">
<div className="mt-1 text-xs text-description">
{selectedProviderObject.description}
</div>
</div>

4
frontend/src/pages/GeneralSettings/Chats/index.jsx
View File

@ -128,7 +128,7 @@ export default function WorkspaceChats() {
<button
ref={openMenuButton}
onClick={toggleMenu}
className="flex items-center gap-x-2 px-4 py-1 rounded-lg bg-[#46C8FF] hover:text-white text-xs font-semibold hover:bg-[#2C2F36] shadow-[0_4px_14px_rgba(0,0,0,0.25)] h-[34px] w-fit"
className="flex items-center gap-x-2 px-4 py-1 rounded-lg bg-primary-button hover:text-white text-xs font-semibold hover:bg-secondary shadow-[0_4px_14px_rgba(0,0,0,0.25)] h-[34px] w-fit"
>
<Download size={18} weight="bold" />
Export
@ -138,7 +138,7 @@ export default function WorkspaceChats() {
ref={menuRef}
className={`${
showMenu ? "slide-down" : "slide-up hidden"
} z-20 w-fit rounded-lg absolute top-full right-0 bg-[#2C2F36] mt-2 shadow-md`}
} z-20 w-fit rounded-lg absolute top-full right-0 bg-secondary mt-2 shadow-md`}
>
<div className="py-2">
{Object.entries(exportOptions).map(([key, data]) => (

10
frontend/src/pages/GeneralSettings/EmbeddingPreference/index.jsx
View File

@ -257,9 +257,9 @@ export default function GeneralEmbeddingPreference() {
/>
)}
{searchMenuOpen ? (
<div className="absolute top-0 left-0 w-full max-w-[640px] max-h-[310px] overflow-auto white-scrollbar min-h-[64px] bg-[#18181B] rounded-lg flex flex-col justify-between cursor-pointer border-2 border-[#46C8FF] z-20">
<div className="absolute top-0 left-0 w-full max-w-[640px] max-h-[310px] overflow-auto white-scrollbar min-h-[64px] bg-dark-input rounded-lg flex flex-col justify-between cursor-pointer border-2 border-[#46C8FF] z-20">
<div className="w-full flex flex-col gap-y-1">
<div className="flex items-center sticky top-0 border-b border-[#9CA3AF] mx-4 bg-[#18181B]">
<div className="flex items-center sticky top-0 border-b border-[#9CA3AF] mx-4 bg-dark-input">
<MagnifyingGlass
size={20}
weight="bold"
@ -280,7 +280,7 @@ export default function GeneralEmbeddingPreference() {
<X
size={20}
weight="bold"
className="cursor-pointer text-white hover:text-[#9CA3AF]"
className="cursor-pointer text-white hover:text-x-button"
onClick={handleXButton}
/>
</div>
@ -301,7 +301,7 @@ export default function GeneralEmbeddingPreference() {
</div>
) : (
<button
className="w-full max-w-[640px] h-[64px] bg-[#18181B] rounded-lg flex items-center p-[14px] justify-between cursor-pointer border-2 border-transparent hover:border-[#46C8FF] transition-all duration-300"
className="w-full max-w-[640px] h-[64px] bg-dark-input rounded-lg flex items-center p-[14px] justify-between cursor-pointer border-2 border-transparent hover:border-[#46C8FF] transition-all duration-300"
type="button"
onClick={() => setSearchMenuOpen(true)}
>
@ -315,7 +315,7 @@ export default function GeneralEmbeddingPreference() {
<div className="text-sm font-semibold text-white">
{selectedEmbedderObject.name}
</div>
<div className="mt-1 text-xs text-[#D2D5DB]">
<div className="mt-1 text-xs text-description">
{selectedEmbedderObject.description}
</div>
</div>

10
frontend/src/pages/GeneralSettings/LLMPreference/index.jsx
View File

@ -341,9 +341,9 @@ export default function GeneralLLMPreference() {
/>
)}
{searchMenuOpen ? (
<div className="absolute top-0 left-0 w-full max-w-[640px] max-h-[310px] overflow-auto white-scrollbar min-h-[64px] bg-[#18181B] rounded-lg flex flex-col justify-between cursor-pointer border-2 border-[#46C8FF] z-20">
<div className="absolute top-0 left-0 w-full max-w-[640px] max-h-[310px] overflow-auto white-scrollbar min-h-[64px] bg-dark-input rounded-lg flex flex-col justify-between cursor-pointer border-2 border-[#46C8FF] z-20">
<div className="w-full flex flex-col gap-y-1">
<div className="flex items-center sticky top-0 border-b border-[#9CA3AF] mx-4 bg-[#18181B]">
<div className="flex items-center sticky top-0 border-b border-[#9CA3AF] mx-4 bg-dark-input">
<MagnifyingGlass
size={20}
weight="bold"
@ -364,7 +364,7 @@ export default function GeneralLLMPreference() {
<X
size={20}
weight="bold"
className="cursor-pointer text-white hover:text-[#9CA3AF]"
className="cursor-pointer text-white hover:text-x-button"
onClick={handleXButton}
/>
</div>
@ -388,7 +388,7 @@ export default function GeneralLLMPreference() {
</div>
) : (
<button
className="w-full max-w-[640px] h-[64px] bg-[#18181B] rounded-lg flex items-center p-[14px] justify-between cursor-pointer border-2 border-transparent hover:border-[#46C8FF] transition-all duration-300"
className="w-full max-w-[640px] h-[64px] bg-dark-input rounded-lg flex items-center p-[14px] justify-between cursor-pointer border-2 border-transparent hover:border-[#46C8FF] transition-all duration-300"
type="button"
onClick={() => setSearchMenuOpen(true)}
>
@ -402,7 +402,7 @@ export default function GeneralLLMPreference() {
<div className="text-sm font-semibold text-white">
{selectedLLMObject?.name || "None selected"}
</div>
<div className="mt-1 text-xs text-[#D2D5DB]">
<div className="mt-1 text-xs text-description">
{selectedLLMObject?.description ||
"You need to select an LLM"}
</div>

10
frontend/src/pages/GeneralSettings/TranscriptionPreference/index.jsx
View File

@ -149,9 +149,9 @@ export default function TranscriptionModelPreference() {
/>
)}
{searchMenuOpen ? (
<div className="absolute top-0 left-0 w-full max-w-[640px] max-h-[310px] overflow-auto white-scrollbar min-h-[64px] bg-[#18181B] rounded-lg flex flex-col justify-between cursor-pointer border-2 border-[#46C8FF] z-20">
<div className="absolute top-0 left-0 w-full max-w-[640px] max-h-[310px] overflow-auto white-scrollbar min-h-[64px] bg-dark-input rounded-lg flex flex-col justify-between cursor-pointer border-2 border-[#46C8FF] z-20">
<div className="w-full flex flex-col gap-y-1">
<div className="flex items-center sticky top-0 border-b border-[#9CA3AF] mx-4 bg-[#18181B]">
<div className="flex items-center sticky top-0 border-b border-[#9CA3AF] mx-4 bg-dark-input">
<MagnifyingGlass
size={20}
weight="bold"
@ -172,7 +172,7 @@ export default function TranscriptionModelPreference() {
<X
size={20}
weight="bold"
className="cursor-pointer text-white hover:text-[#9CA3AF]"
className="cursor-pointer text-white hover:text-x-button"
onClick={handleXButton}
/>
</div>
@ -193,7 +193,7 @@ export default function TranscriptionModelPreference() {
</div>
) : (
<button
className="w-full max-w-[640px] h-[64px] bg-[#18181B] rounded-lg flex items-center p-[14px] justify-between cursor-pointer border-2 border-transparent hover:border-[#46C8FF] transition-all duration-300"
className="w-full max-w-[640px] h-[64px] bg-dark-input rounded-lg flex items-center p-[14px] justify-between cursor-pointer border-2 border-transparent hover:border-[#46C8FF] transition-all duration-300"
type="button"
onClick={() => setSearchMenuOpen(true)}
>
@ -207,7 +207,7 @@ export default function TranscriptionModelPreference() {
<div className="text-sm font-semibold text-white">
{selectedProviderObject.name}
</div>
<div className="mt-1 text-xs text-[#D2D5DB]">
<div className="mt-1 text-xs text-description">
{selectedProviderObject.description}
</div>
</div>

10
frontend/src/pages/GeneralSettings/VectorDatabase/index.jsx
View File

@ -224,9 +224,9 @@ export default function GeneralVectorDatabase() {
/>
)}
{searchMenuOpen ? (
<div className="absolute top-0 left-0 w-full max-w-[640px] max-h-[310px] overflow-auto white-scrollbar min-h-[64px] bg-[#18181B] rounded-lg flex flex-col justify-between cursor-pointer border-2 border-[#46C8FF] z-20">
<div className="absolute top-0 left-0 w-full max-w-[640px] max-h-[310px] overflow-auto white-scrollbar min-h-[64px] bg-dark-input rounded-lg flex flex-col justify-between cursor-pointer border-2 border-[#46C8FF] z-20">
<div className="w-full flex flex-col gap-y-1">
<div className="flex items-center sticky top-0 border-b border-[#9CA3AF] mx-4 bg-[#18181B]">
<div className="flex items-center sticky top-0 border-b border-[#9CA3AF] mx-4 bg-dark-input">
<MagnifyingGlass
size={20}
weight="bold"
@ -247,7 +247,7 @@ export default function GeneralVectorDatabase() {
<X
size={20}
weight="bold"
className="cursor-pointer text-white hover:text-[#9CA3AF]"
className="cursor-pointer text-white hover:text-x-button"
onClick={handleXButton}
/>
</div>
@ -268,7 +268,7 @@ export default function GeneralVectorDatabase() {
</div>
) : (
<button
className="w-full max-w-[640px] h-[64px] bg-[#18181B] rounded-lg flex items-center p-[14px] justify-between cursor-pointer border-2 border-transparent hover:border-[#46C8FF] transition-all duration-300"
className="w-full max-w-[640px] h-[64px] bg-dark-input rounded-lg flex items-center p-[14px] justify-between cursor-pointer border-2 border-transparent hover:border-[#46C8FF] transition-all duration-300"
type="button"
onClick={() => setSearchMenuOpen(true)}
>
@ -282,7 +282,7 @@ export default function GeneralVectorDatabase() {
<div className="text-sm font-semibold text-white">
{selectedVDBObject.name}
</div>
<div className="mt-1 text-xs text-[#D2D5DB]">
<div className="mt-1 text-xs text-description">
{selectedVDBObject.description}
</div>
</div>

2
frontend/src/pages/OnboardingFlow/Steps/Home/index.jsx
View File

@ -8,7 +8,7 @@ export default function OnboardingHome() {
const navigate = useNavigate();
return (
<>
<div className="relative w-screen h-screen flex overflow-hidden bg-[#2C2F35] md:bg-main-gradient">
<div className="relative w-screen h-screen flex overflow-hidden bg-mobile-onboarding md:bg-main-gradient">
<div
className="hidden md:block fixed bottom-10 left-10 w-[320px] h-[320px] bg-no-repeat bg-contain"
style={{ backgroundImage: `url(${LGroupImg})` }}

4
frontend/src/pages/OnboardingFlow/Steps/index.jsx
View File

@ -37,7 +37,7 @@ export function OnboardingLayout({ children }) {
if (isMobile) {
return (
<div className="w-screen h-screen overflow-y-auto bg-[#2C2F35] overflow-hidden">
<div className="w-screen h-screen overflow-y-auto bg-mobile-onboarding overflow-hidden">
<div className="flex flex-col">
<div className="w-full relative py-10 px-2">
<div className="flex flex-col w-fit mx-auto gap-y-1 mb-[55px]">
@ -87,7 +87,7 @@ export function OnboardingLayout({ children }) {
}
return (
<div className="w-screen overflow-y-auto bg-[#2C2F35] md:bg-main-gradient flex justify-center overflow-hidden">
<div className="w-screen overflow-y-auto bg-mobile-onboarding md:bg-main-gradient flex justify-center overflow-hidden">
<div className="flex w-1/5 h-screen justify-center items-center">
{backBtn.showing && (
<button

4
frontend/src/pages/WorkspaceSettings/AgentConfig/AgentLLMSelection/AgentLLMItem/index.jsx
View File

@ -55,7 +55,7 @@ export default function WorkspaceLLM({
/>
<div className="flex flex-col">
<div className="text-sm font-semibold text-white">{name}</div>
<div className="mt-1 text-xs text-[#D2D5DB]">{description}</div>
<div className="mt-1 text-xs text-description">{description}</div>
</div>
</div>
</div>
@ -137,7 +137,7 @@ function SetupProvider({
<button
type="submit"
form="provider-form"
className="border-none text-xs px-2 py-1 font-semibold rounded-lg bg-[#46C8FF] hover:bg-[#2C2F36] border-2 border-transparent hover:border-[#46C8FF] hover:text-white h-[32px] w-fit -mr-8 whitespace-nowrap shadow-[0_4px_14px_rgba(0,0,0,0.25)]"
className="border-none text-xs px-2 py-1 font-semibold rounded-lg bg-primary-button hover:bg-secondary border-2 border-transparent hover:border-[#46C8FF] hover:text-white h-[32px] w-fit -mr-8 whitespace-nowrap shadow-[0_4px_14px_rgba(0,0,0,0.25)]"
>
Save {LLMOption.name} settings
</button>

10
frontend/src/pages/WorkspaceSettings/AgentConfig/AgentLLMSelection/index.jsx
View File

@ -124,9 +124,9 @@ export default function AgentLLMSelection({
/>
)}
{searchMenuOpen ? (
<div className="absolute top-0 left-0 w-full max-w-[640px] max-h-[310px] overflow-auto white-scrollbar min-h-[64px] bg-[#18181B] rounded-lg flex flex-col justify-between cursor-pointer border-2 border-[#46C8FF] z-20">
<div className="absolute top-0 left-0 w-full max-w-[640px] max-h-[310px] overflow-auto white-scrollbar min-h-[64px] bg-dark-input rounded-lg flex flex-col justify-between cursor-pointer border-2 border-[#46C8FF] z-20">
<div className="w-full flex flex-col gap-y-1">
<div className="flex items-center sticky top-0 border-b border-[#9CA3AF] mx-4 bg-[#18181B]">
<div className="flex items-center sticky top-0 border-b border-[#9CA3AF] mx-4 bg-dark-input">
<MagnifyingGlass
size={20}
weight="bold"
@ -147,7 +147,7 @@ export default function AgentLLMSelection({
<X
size={20}
weight="bold"
className="cursor-pointer text-white hover:text-[#9CA3AF]"
className="cursor-pointer text-white hover:text-x-button"
onClick={handleXButton}
/>
</div>
@ -169,7 +169,7 @@ export default function AgentLLMSelection({
</div>
) : (
<button
className="w-full max-w-[640px] h-[64px] bg-[#18181B] rounded-lg flex items-center p-[14px] justify-between cursor-pointer border-2 border-transparent hover:border-[#46C8FF] transition-all duration-300"
className="w-full max-w-[640px] h-[64px] bg-dark-input rounded-lg flex items-center p-[14px] justify-between cursor-pointer border-2 border-transparent hover:border-[#46C8FF] transition-all duration-300"
type="button"
onClick={() => setSearchMenuOpen(true)}
>
@ -183,7 +183,7 @@ export default function AgentLLMSelection({
<div className="text-sm font-semibold text-white">
{selectedLLMObject.name}
</div>
<div className="mt-1 text-xs text-[#D2D5DB]">
<div className="mt-1 text-xs text-description">
{selectedLLMObject.description}
</div>
</div>

4
frontend/src/pages/WorkspaceSettings/ChatSettings/WorkspaceLLMSelection/WorkspaceLLMItem/index.jsx
View File

@ -55,7 +55,7 @@ export default function WorkspaceLLM({
/>
<div className="flex flex-col">
<div className="text-sm font-semibold text-white">{name}</div>
<div className="mt-1 text-xs text-[#D2D5DB]">{description}</div>
<div className="mt-1 text-xs text-description">{description}</div>
</div>
</div>
</div>
@ -137,7 +137,7 @@ function SetupProvider({
<button
type="submit"
form="provider-form"
className="text-xs px-2 py-1 font-semibold rounded-lg bg-[#46C8FF] hover:bg-[#2C2F36] border-2 border-transparent hover:border-[#46C8FF] hover:text-white h-[32px] w-fit -mr-8 whitespace-nowrap shadow-[0_4px_14px_rgba(0,0,0,0.25)]"
className="text-xs px-2 py-1 font-semibold rounded-lg bg-primary-button hover:bg-secondary border-2 border-transparent hover:border-[#46C8FF] hover:text-white h-[32px] w-fit -mr-8 whitespace-nowrap shadow-[0_4px_14px_rgba(0,0,0,0.25)]"
>
Save {LLMOption.name} settings
</button>

10
frontend/src/pages/WorkspaceSettings/ChatSettings/WorkspaceLLMSelection/index.jsx
View File

@ -80,9 +80,9 @@ export default function WorkspaceLLMSelection({
/>
)}
{searchMenuOpen ? (
<div className="absolute top-0 left-0 w-full max-w-[640px] max-h-[310px] overflow-auto white-scrollbar min-h-[64px] bg-[#18181B] rounded-lg flex flex-col justify-between cursor-pointer border-2 border-[#46C8FF] z-20">
<div className="absolute top-0 left-0 w-full max-w-[640px] max-h-[310px] overflow-auto white-scrollbar min-h-[64px] bg-dark-input rounded-lg flex flex-col justify-between cursor-pointer border-2 border-[#46C8FF] z-20">
<div className="w-full flex flex-col gap-y-1">
<div className="flex items-center sticky top-0 border-b border-[#9CA3AF] mx-4 bg-[#18181B]">
<div className="flex items-center sticky top-0 border-b border-[#9CA3AF] mx-4 bg-dark-input">
<MagnifyingGlass
size={20}
weight="bold"
@ -103,7 +103,7 @@ export default function WorkspaceLLMSelection({
<X
size={20}
weight="bold"
className="cursor-pointer text-white hover:text-[#9CA3AF]"
className="cursor-pointer text-white hover:text-x-button"
onClick={handleXButton}
/>
</div>
@ -125,7 +125,7 @@ export default function WorkspaceLLMSelection({
</div>
) : (
<button
className="w-full max-w-[640px] h-[64px] bg-[#18181B] rounded-lg flex items-center p-[14px] justify-between cursor-pointer border-2 border-transparent hover:border-[#46C8FF] transition-all duration-300"
className="w-full max-w-[640px] h-[64px] bg-dark-input rounded-lg flex items-center p-[14px] justify-between cursor-pointer border-2 border-transparent hover:border-[#46C8FF] transition-all duration-300"
type="button"
onClick={() => setSearchMenuOpen(true)}
>
@ -139,7 +139,7 @@ export default function WorkspaceLLMSelection({
<div className="text-sm font-semibold text-white">
{selectedLLMObject.name}
</div>
<div className="mt-1 text-xs text-[#D2D5DB]">
<div className="mt-1 text-xs text-description">
{selectedLLMObject.description}
</div>
</div>

2
frontend/src/pages/WorkspaceSettings/Members/AddMemberModal/index.jsx
View File

@ -152,7 +152,7 @@ export default function AddMemberModal({ closeModal, workspace, users }) {
</div>
<button
type="submit"
className="transition-all duration-300 text-xs px-2 py-1 font-semibold rounded-lg bg-[#46C8FF] hover:bg-[#2C2F36] border-2 border-transparent hover:border-[#46C8FF] hover:text-white h-[32px] w-[68px] -mr-8 whitespace-nowrap shadow-[0_4px_14px_rgba(0,0,0,0.25)]"
className="transition-all duration-300 text-xs px-2 py-1 font-semibold rounded-lg bg-primary-button hover:bg-secondary border-2 border-transparent hover:border-[#46C8FF] hover:text-white h-[32px] w-[68px] -mr-8 whitespace-nowrap shadow-[0_4px_14px_rgba(0,0,0,0.25)]"
>
Save
</button>

10
frontend/tailwind.config.js
View File

@ -27,7 +27,15 @@ export default {
sidebar: "#25272C",
"historical-msg-system": "rgba(255, 255, 255, 0.05);",
"historical-msg-user": "#2C2F35",
outline: "#4E5153"
outline: "#4E5153",
"primary-button": "#46C8FF",
secondary: "#2C2F36",
"dark-input": "#18181B",
"mobile-onboarding": "#2C2F35",
"dark-highlight": "#1C1E21",
"dark-text": "#222628",
description: "#D2D5DB",
"x-button": "#9CA3AF"
},
backgroundImage: {
"preference-gradient":