From e6b9ebc198973a84dc9412302e6b98a24b0a2ce3 Mon Sep 17 00:00:00 2001 From: pablodanswer Date: Tue, 29 Oct 2024 20:01:23 -0700 Subject: [PATCH 1/8] ensure functionality --- web/src/app/chat/ChatPage.tsx | 5 +++- .../sessionSidebar/ChatSessionDisplay.tsx | 2 +- .../app/chat/shared_chat_search/FixedLogo.tsx | 14 +++++++-- web/src/components/BasicClickable.tsx | 2 +- web/src/components/header/HeaderTitle.tsx | 8 ++++- web/src/components/header/LogoType.tsx | 14 +++++---- web/src/components/search/SearchSection.tsx | 2 +- web/tailwind-themes/tailwind.config.js | 29 ++++++++++++++----- 8 files changed, 55 insertions(+), 21 deletions(-) diff --git a/web/src/app/chat/ChatPage.tsx b/web/src/app/chat/ChatPage.tsx index 4c4291405f9..1abdf9029c0 100644 --- a/web/src/app/chat/ChatPage.tsx +++ b/web/src/app/chat/ChatPage.tsx @@ -2512,7 +2512,10 @@ export function ChatPage({ )} - +

diff --git a/web/src/app/chat/shared_chat_search/FixedLogo.tsx b/web/src/app/chat/shared_chat_search/FixedLogo.tsx index 717b407c8a4..c36fa8d9ada 100644 --- a/web/src/app/chat/shared_chat_search/FixedLogo.tsx +++ b/web/src/app/chat/shared_chat_search/FixedLogo.tsx @@ -8,7 +8,13 @@ import Link from "next/link"; import { useContext } from "react"; import { FiSidebar } from "react-icons/fi"; -export default function FixedLogo({ chat }: { chat?: boolean }) { +export default function FixedLogo({ + chat, + toggledBackground, +}: { + chat?: boolean; + toggledBackground?: boolean; +}) { const combinedSettings = useContext(SettingsContext); const settings = combinedSettings?.settings; const enterpriseSettings = combinedSettings?.enterpriseSettings; @@ -28,7 +34,7 @@ export default function FixedLogo({ chat }: { chat?: boolean }) {
{enterpriseSettings && enterpriseSettings.application_name ? (
- + {enterpriseSettings.application_name} {!NEXT_PUBLIC_DO_NOT_USE_TOGGLE_OFF_DANSWER_POWERED && ( @@ -36,7 +42,9 @@ export default function FixedLogo({ chat }: { chat?: boolean }) { )}
) : ( - Danswer + + Danswer + )}
diff --git a/web/src/components/BasicClickable.tsx b/web/src/components/BasicClickable.tsx index 44386a9d177..060486f7230 100644 --- a/web/src/components/BasicClickable.tsx +++ b/web/src/components/BasicClickable.tsx @@ -108,7 +108,7 @@ export function BasicSelectable({ ? "bg-background-chat-selected" : "bg-hover" : chat - ? "bg-background-chat-hover" + ? "hover:bg-background-chat-hover" : "hover:bg-hover" } ${fullWidth ? "w-full" : ""}`} diff --git a/web/src/components/header/HeaderTitle.tsx b/web/src/components/header/HeaderTitle.tsx index f7c9d21c47d..29e1033eb57 100644 --- a/web/src/components/header/HeaderTitle.tsx +++ b/web/src/components/header/HeaderTitle.tsx @@ -5,9 +5,11 @@ import React from "react"; export function HeaderTitle({ children, chat, + toggledBackground, }: { children: JSX.Element | string; chat?: boolean; + toggledBackground?: boolean; }) { const isString = typeof children === "string"; const textSize = isString && children.length > 10 ? "text-xl" : "text-2xl"; @@ -15,7 +17,11 @@ export function HeaderTitle({ return (

{children} diff --git a/web/src/components/header/LogoType.tsx b/web/src/components/header/LogoType.tsx index 522aace1861..d5eb22ed37e 100644 --- a/web/src/components/header/LogoType.tsx +++ b/web/src/components/header/LogoType.tsx @@ -37,7 +37,9 @@ export default function LogoType({ return (
{toggleSidebar && page == "chat" ? ( diff --git a/web/src/components/search/SearchSection.tsx b/web/src/components/search/SearchSection.tsx index 454f180bf21..e5827ec713e 100644 --- a/web/src/components/search/SearchSection.tsx +++ b/web/src/components/search/SearchSection.tsx @@ -851,7 +851,7 @@ export const SearchSection = ({
- + ); }; diff --git a/web/tailwind-themes/tailwind.config.js b/web/tailwind-themes/tailwind.config.js index b427e19a3f0..6e6e2826380 100644 --- a/web/tailwind-themes/tailwind.config.js +++ b/web/tailwind-themes/tailwind.config.js @@ -83,7 +83,7 @@ module.exports = { "non-selectable": "var(--non-selectable)", // background - background: "var(--background)", + background: "#EDEDF1", "background-100": "var(--background-100)", "background-125": "var(--background-125)", "background-150": "var(--background-150)", @@ -95,27 +95,38 @@ module.exports = { "background-700": "var(--background-700)", "background-800": "var(--background-800)", "background-900": "var(--background-900)", + "background-toggle": "var(--background-100)", + "toggled-background": "var(--background-500)", + "untoggled-background": "var(--background-300)", "background-inverted": "var(--background-inverted)", "background-emphasis": "var(--background-emphasis)", "background-strong": "var(--background-strong)", "background-search": "var(--white)", + "text-sidebar-toggled-header": "var(--text-200)", + "text-sidebar-header": "var(--text-900)", + "text-sidebar-dark": "var(--text-200)", + + "search-answer-border": "var(--background-300)", + + "background-chat-hover": "#1D4ED8", + "background-chat-selected": "#1D4ED8", // colors for sidebar in chat, search, and manage settings - "background-sidebar": "var(--background-100)", + "background-sidebar": "#0021A5", "background-settings-sidebar": "var(--background-100)", - "background-chatbar": "var(--background-100)", - "text-sidebar": "var(--text-500)", + "background-chatbar": "#FFFFFF", + "text-sidebar": "#FFFFFF", // Settings - "text-sidebar-subtle": "var(--text-500)", + "text-sidebar-subtle": "#A9D4FF", "icon-settings-sidebar": "var(--text-600)", "text-settings-sidebar": "var(--text-600)", "text-settings-sidebar-strong": "var(--text-900)", "background-settings-hover": "var(--background-200)", // Background for chat messages (user bubbles) - user: "var(--user-bubble)", + user: "#0021A5", // Colors for the search toggle buttons "background-agentic-toggled": "var(--light-success)", @@ -129,9 +140,11 @@ module.exports = { "star-indicator": "var(--background-100)", // Backgrounds for submit buttons on search and chat - "submit-background": "var(--background-800)", + "submit-background": "#0021A5", "disabled-submit-background": "var(--background-400)", + "sidebar-toggle": "var(--text-200)", + input: "var(--white)", "text-50": "var(--text-50)", @@ -146,7 +159,7 @@ module.exports = { "text-900": "var(--text-900)", "text-950": "var(--text-950)", - "user-text": "var(--text-800)", + "user-text": "#FFFFFF", description: "var(--text-400)", subtle: "var(--text-500)", From 8210c8930b005cfe6248618373a708b150e412f2 Mon Sep 17 00:00:00 2001 From: pablodanswer Date: Tue, 29 Oct 2024 20:03:08 -0700 Subject: [PATCH 2/8] naming --- web/src/app/chat/ChatPage.tsx | 2 +- .../sessionSidebar/ChatSessionDisplay.tsx | 2 +- .../app/chat/shared_chat_search/FixedLogo.tsx | 8 ++--- web/src/components/header/HeaderTitle.tsx | 6 ++-- web/src/components/header/LogoType.tsx | 2 +- web/src/components/search/SearchSection.tsx | 2 +- web/tailwind-themes/tailwind.config.js | 29 +++++-------------- 7 files changed, 19 insertions(+), 32 deletions(-) diff --git a/web/src/app/chat/ChatPage.tsx b/web/src/app/chat/ChatPage.tsx index 1abdf9029c0..d02126369e6 100644 --- a/web/src/app/chat/ChatPage.tsx +++ b/web/src/app/chat/ChatPage.tsx @@ -2514,7 +2514,7 @@ export function ChatPage({ diff --git a/web/src/app/chat/sessionSidebar/ChatSessionDisplay.tsx b/web/src/app/chat/sessionSidebar/ChatSessionDisplay.tsx index 3c93358abbc..2c35bb43f1f 100644 --- a/web/src/app/chat/sessionSidebar/ChatSessionDisplay.tsx +++ b/web/src/app/chat/sessionSidebar/ChatSessionDisplay.tsx @@ -145,7 +145,7 @@ export function ChatSessionDisplay({ ${ isSelected ? "to-background-chat-hover" - : " to-background-chat-hove group-hover:to-background-chat-selected" + : " to-background-chat-hover group-hover:to-background-chat-selected" } `} />

diff --git a/web/src/app/chat/shared_chat_search/FixedLogo.tsx b/web/src/app/chat/shared_chat_search/FixedLogo.tsx index c36fa8d9ada..1e839f126f3 100644 --- a/web/src/app/chat/shared_chat_search/FixedLogo.tsx +++ b/web/src/app/chat/shared_chat_search/FixedLogo.tsx @@ -10,10 +10,10 @@ import { FiSidebar } from "react-icons/fi"; export default function FixedLogo({ chat, - toggledBackground, + backgroundToggled, }: { chat?: boolean; - toggledBackground?: boolean; + backgroundToggled?: boolean; }) { const combinedSettings = useContext(SettingsContext); const settings = combinedSettings?.settings; @@ -34,7 +34,7 @@ export default function FixedLogo({
{enterpriseSettings && enterpriseSettings.application_name ? (
- + {enterpriseSettings.application_name} {!NEXT_PUBLIC_DO_NOT_USE_TOGGLE_OFF_DANSWER_POWERED && ( @@ -42,7 +42,7 @@ export default function FixedLogo({ )}
) : ( - + Danswer )} diff --git a/web/src/components/header/HeaderTitle.tsx b/web/src/components/header/HeaderTitle.tsx index 29e1033eb57..b14148bb90e 100644 --- a/web/src/components/header/HeaderTitle.tsx +++ b/web/src/components/header/HeaderTitle.tsx @@ -5,11 +5,11 @@ import React from "react"; export function HeaderTitle({ children, chat, - toggledBackground, + backgroundToggled, }: { children: JSX.Element | string; chat?: boolean; - toggledBackground?: boolean; + backgroundToggled?: boolean; }) { const isString = typeof children === "string"; const textSize = isString && children.length > 10 ? "text-xl" : "text-2xl"; @@ -18,7 +18,7 @@ export function HeaderTitle({

- + ); }; diff --git a/web/tailwind-themes/tailwind.config.js b/web/tailwind-themes/tailwind.config.js index 6e6e2826380..b427e19a3f0 100644 --- a/web/tailwind-themes/tailwind.config.js +++ b/web/tailwind-themes/tailwind.config.js @@ -83,7 +83,7 @@ module.exports = { "non-selectable": "var(--non-selectable)", // background - background: "#EDEDF1", + background: "var(--background)", "background-100": "var(--background-100)", "background-125": "var(--background-125)", "background-150": "var(--background-150)", @@ -95,38 +95,27 @@ module.exports = { "background-700": "var(--background-700)", "background-800": "var(--background-800)", "background-900": "var(--background-900)", - "background-toggle": "var(--background-100)", - "toggled-background": "var(--background-500)", - "untoggled-background": "var(--background-300)", "background-inverted": "var(--background-inverted)", "background-emphasis": "var(--background-emphasis)", "background-strong": "var(--background-strong)", "background-search": "var(--white)", - "text-sidebar-toggled-header": "var(--text-200)", - "text-sidebar-header": "var(--text-900)", - "text-sidebar-dark": "var(--text-200)", - - "search-answer-border": "var(--background-300)", - - "background-chat-hover": "#1D4ED8", - "background-chat-selected": "#1D4ED8", // colors for sidebar in chat, search, and manage settings - "background-sidebar": "#0021A5", + "background-sidebar": "var(--background-100)", "background-settings-sidebar": "var(--background-100)", - "background-chatbar": "#FFFFFF", - "text-sidebar": "#FFFFFF", + "background-chatbar": "var(--background-100)", + "text-sidebar": "var(--text-500)", // Settings - "text-sidebar-subtle": "#A9D4FF", + "text-sidebar-subtle": "var(--text-500)", "icon-settings-sidebar": "var(--text-600)", "text-settings-sidebar": "var(--text-600)", "text-settings-sidebar-strong": "var(--text-900)", "background-settings-hover": "var(--background-200)", // Background for chat messages (user bubbles) - user: "#0021A5", + user: "var(--user-bubble)", // Colors for the search toggle buttons "background-agentic-toggled": "var(--light-success)", @@ -140,11 +129,9 @@ module.exports = { "star-indicator": "var(--background-100)", // Backgrounds for submit buttons on search and chat - "submit-background": "#0021A5", + "submit-background": "var(--background-800)", "disabled-submit-background": "var(--background-400)", - "sidebar-toggle": "var(--text-200)", - input: "var(--white)", "text-50": "var(--text-50)", @@ -159,7 +146,7 @@ module.exports = { "text-900": "var(--text-900)", "text-950": "var(--text-950)", - "user-text": "#FFFFFF", + "user-text": "var(--text-800)", description: "var(--text-400)", subtle: "var(--text-500)", From 3472fb27371f59b454a4b27a699e2160b801ab46 Mon Sep 17 00:00:00 2001 From: pablodanswer Date: Wed, 30 Oct 2024 13:31:06 -0700 Subject: [PATCH 3/8] ensure tailwind theme updated --- web/src/app/chat/ChatPage.tsx | 2 +- .../app/chat/sessionSidebar/ChatSessionDisplay.tsx | 11 ++++++++--- web/src/app/chat/shared_chat_search/FixedLogo.tsx | 14 ++++++++++---- web/src/components/BasicClickable.tsx | 8 ++++---- web/src/components/header/HeaderTitle.tsx | 6 +++--- web/src/components/search/SearchSection.tsx | 5 ++++- web/tailwind-themes/tailwind.config.js | 8 ++++++++ 7 files changed, 38 insertions(+), 16 deletions(-) diff --git a/web/src/app/chat/ChatPage.tsx b/web/src/app/chat/ChatPage.tsx index d02126369e6..9e0c0d7b15a 100644 --- a/web/src/app/chat/ChatPage.tsx +++ b/web/src/app/chat/ChatPage.tsx @@ -2513,7 +2513,7 @@ export function ChatPage({ diff --git a/web/src/app/chat/sessionSidebar/ChatSessionDisplay.tsx b/web/src/app/chat/sessionSidebar/ChatSessionDisplay.tsx index 2c35bb43f1f..62a47d37020 100644 --- a/web/src/app/chat/sessionSidebar/ChatSessionDisplay.tsx +++ b/web/src/app/chat/sessionSidebar/ChatSessionDisplay.tsx @@ -122,7 +122,12 @@ export function ChatSessionDisplay({ ); }} > - + <>
{isRenamingChat ? ( @@ -144,8 +149,8 @@ export function ChatSessionDisplay({ className={`absolute right-0 top-0 h-full w-8 bg-gradient-to-r from-transparent ${ isSelected - ? "to-background-chat-hover" - : " to-background-chat-hover group-hover:to-background-chat-selected" + ? "to-background-chat-selected" + : "group-hover:to-background-chat-hover" } `} />

diff --git a/web/src/app/chat/shared_chat_search/FixedLogo.tsx b/web/src/app/chat/shared_chat_search/FixedLogo.tsx index 1e839f126f3..207c87c01af 100644 --- a/web/src/app/chat/shared_chat_search/FixedLogo.tsx +++ b/web/src/app/chat/shared_chat_search/FixedLogo.tsx @@ -9,10 +9,10 @@ import { useContext } from "react"; import { FiSidebar } from "react-icons/fi"; export default function FixedLogo({ - chat, + applicationPage, backgroundToggled, }: { - chat?: boolean; + applicationPage?: boolean; backgroundToggled?: boolean; }) { const combinedSettings = useContext(SettingsContext); @@ -34,7 +34,10 @@ export default function FixedLogo({
{enterpriseSettings && enterpriseSettings.application_name ? (
- + {enterpriseSettings.application_name} {!NEXT_PUBLIC_DO_NOT_USE_TOGGLE_OFF_DANSWER_POWERED && ( @@ -42,7 +45,10 @@ export default function FixedLogo({ )}
) : ( - + Danswer )} diff --git a/web/src/components/BasicClickable.tsx b/web/src/components/BasicClickable.tsx index 060486f7230..2408ab84d38 100644 --- a/web/src/components/BasicClickable.tsx +++ b/web/src/components/BasicClickable.tsx @@ -81,14 +81,14 @@ export function BasicSelectable({ children, selected, hasBorder, - chat, + applicationPage, fullWidth = false, padding = "normal", }: { children: string | JSX.Element; selected: boolean; hasBorder?: boolean; - chat?: boolean; + applicationPage?: boolean; fullWidth?: boolean; padding?: "none" | "normal" | "extra"; }) { @@ -104,10 +104,10 @@ export function BasicSelectable({ ${hasBorder ? "border border-border" : ""} ${ selected - ? chat + ? applicationPage ? "bg-background-chat-selected" : "bg-hover" - : chat + : applicationPage ? "hover:bg-background-chat-hover" : "hover:bg-hover" } diff --git a/web/src/components/header/HeaderTitle.tsx b/web/src/components/header/HeaderTitle.tsx index b14148bb90e..b6d1ec80db1 100644 --- a/web/src/components/header/HeaderTitle.tsx +++ b/web/src/components/header/HeaderTitle.tsx @@ -4,11 +4,11 @@ import React from "react"; export function HeaderTitle({ children, - chat, + applicationPage, backgroundToggled, }: { children: JSX.Element | string; - chat?: boolean; + applicationPage?: boolean; backgroundToggled?: boolean; }) { const isString = typeof children === "string"; @@ -17,7 +17,7 @@ export function HeaderTitle({ return (

- + ); }; diff --git a/web/tailwind-themes/tailwind.config.js b/web/tailwind-themes/tailwind.config.js index b427e19a3f0..d61224cb8a4 100644 --- a/web/tailwind-themes/tailwind.config.js +++ b/web/tailwind-themes/tailwind.config.js @@ -107,6 +107,9 @@ module.exports = { "background-chatbar": "var(--background-100)", "text-sidebar": "var(--text-500)", + "toggled-background": "var(--background-400)", + "untoggled-background": "var(--background-200)", + // Settings "text-sidebar-subtle": "var(--text-500)", "icon-settings-sidebar": "var(--text-600)", @@ -114,9 +117,14 @@ module.exports = { "text-settings-sidebar-strong": "var(--text-900)", "background-settings-hover": "var(--background-200)", + "background-chat-hover": "var(--background-200)", + "background-chat-selected": "var(--background-200)", + // Background for chat messages (user bubbles) user: "var(--user-bubble)", + "background-toggle": "var(--background-100)", + // Colors for the search toggle buttons "background-agentic-toggled": "var(--light-success)", "background-agentic-untoggled": "var(--undo)", From 5c6fc34d6316e033b5e258b9a469fa1bd8ea3167 Mon Sep 17 00:00:00 2001 From: pablodanswer Date: Wed, 30 Oct 2024 13:32:00 -0700 Subject: [PATCH 4/8] add comments --- web/src/app/chat/shared_chat_search/FixedLogo.tsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/web/src/app/chat/shared_chat_search/FixedLogo.tsx b/web/src/app/chat/shared_chat_search/FixedLogo.tsx index 207c87c01af..95a4efafeee 100644 --- a/web/src/app/chat/shared_chat_search/FixedLogo.tsx +++ b/web/src/app/chat/shared_chat_search/FixedLogo.tsx @@ -9,7 +9,9 @@ import { useContext } from "react"; import { FiSidebar } from "react-icons/fi"; export default function FixedLogo({ + // Whether the logo is on the application page or not applicationPage, + // Whether the sidebar is toggled or not backgroundToggled, }: { applicationPage?: boolean; From f92f8e7a73c238fc44ccca746d6fb597c5ad5cb8 Mon Sep 17 00:00:00 2001 From: pablodanswer Date: Wed, 30 Oct 2024 13:33:05 -0700 Subject: [PATCH 5/8] nit --- web/src/app/chat/ChatPage.tsx | 2 +- web/src/app/chat/sessionSidebar/ChatSessionDisplay.tsx | 2 +- web/src/app/chat/shared_chat_search/FixedLogo.tsx | 8 ++++---- web/src/components/BasicClickable.tsx | 8 ++++---- web/src/components/header/HeaderTitle.tsx | 6 +++--- web/src/components/search/SearchSection.tsx | 2 +- 6 files changed, 14 insertions(+), 14 deletions(-) diff --git a/web/src/app/chat/ChatPage.tsx b/web/src/app/chat/ChatPage.tsx index 9e0c0d7b15a..f246e767893 100644 --- a/web/src/app/chat/ChatPage.tsx +++ b/web/src/app/chat/ChatPage.tsx @@ -2513,7 +2513,7 @@ export function ChatPage({ diff --git a/web/src/app/chat/sessionSidebar/ChatSessionDisplay.tsx b/web/src/app/chat/sessionSidebar/ChatSessionDisplay.tsx index 62a47d37020..db82e86369e 100644 --- a/web/src/app/chat/sessionSidebar/ChatSessionDisplay.tsx +++ b/web/src/app/chat/sessionSidebar/ChatSessionDisplay.tsx @@ -123,7 +123,7 @@ export function ChatSessionDisplay({ }} > {enterpriseSettings.application_name} @@ -49,7 +49,7 @@ export default function FixedLogo({ ) : ( Danswer diff --git a/web/src/components/BasicClickable.tsx b/web/src/components/BasicClickable.tsx index 2408ab84d38..eb5aabc26b5 100644 --- a/web/src/components/BasicClickable.tsx +++ b/web/src/components/BasicClickable.tsx @@ -81,14 +81,14 @@ export function BasicSelectable({ children, selected, hasBorder, - applicationPage, + onApplicationPage, fullWidth = false, padding = "normal", }: { children: string | JSX.Element; selected: boolean; hasBorder?: boolean; - applicationPage?: boolean; + onApplicationPage?: boolean; fullWidth?: boolean; padding?: "none" | "normal" | "extra"; }) { @@ -104,10 +104,10 @@ export function BasicSelectable({ ${hasBorder ? "border border-border" : ""} ${ selected - ? applicationPage + ? onApplicationPage ? "bg-background-chat-selected" : "bg-hover" - : applicationPage + : onApplicationPage ? "hover:bg-background-chat-hover" : "hover:bg-hover" } diff --git a/web/src/components/header/HeaderTitle.tsx b/web/src/components/header/HeaderTitle.tsx index b6d1ec80db1..dc13f21059c 100644 --- a/web/src/components/header/HeaderTitle.tsx +++ b/web/src/components/header/HeaderTitle.tsx @@ -4,11 +4,11 @@ import React from "react"; export function HeaderTitle({ children, - applicationPage, + onApplicationPage, backgroundToggled, }: { children: JSX.Element | string; - applicationPage?: boolean; + onApplicationPage?: boolean; backgroundToggled?: boolean; }) { const isString = typeof children === "string"; @@ -17,7 +17,7 @@ export function HeaderTitle({ return (

From 8f2b0eb72d55347091339c9ba39e2c12f238a776 Mon Sep 17 00:00:00 2001 From: pablodanswer Date: Wed, 30 Oct 2024 13:34:30 -0700 Subject: [PATCH 6/8] remove pr --- web/src/app/chat/shared/[chatId]/SharedChatDisplay.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/web/src/app/chat/shared/[chatId]/SharedChatDisplay.tsx b/web/src/app/chat/shared/[chatId]/SharedChatDisplay.tsx index de2d443963f..e633d01ba0b 100644 --- a/web/src/app/chat/shared/[chatId]/SharedChatDisplay.tsx +++ b/web/src/app/chat/shared/[chatId]/SharedChatDisplay.tsx @@ -27,7 +27,6 @@ function BackToDanswerButton() { Back to {enterpriseSettings?.application_name || "Danswer Chat"} - pr ); } From 592394caeae4414bd87108ef9f8de65b77226e37 Mon Sep 17 00:00:00 2001 From: pablodanswer Date: Wed, 30 Oct 2024 14:03:31 -0700 Subject: [PATCH 7/8] enforce colors --- web/src/app/assistants/SidebarWrapper.tsx | 6 ++- web/src/app/chat/ChatPage.tsx | 5 +- .../sessionSidebar/ChatSessionDisplay.tsx | 7 +-- .../app/chat/shared_chat_search/FixedLogo.tsx | 13 +---- web/src/components/BasicClickable.tsx | 10 +--- web/src/components/admin/ClientLayout.tsx | 2 +- .../admin/connectors/AdminSidebar.tsx | 6 +-- web/src/components/header/HeaderTitle.tsx | 10 ++-- web/src/components/search/SearchSection.tsx | 5 +- web/tailwind-themes/tailwind.config.js | 47 +++++++++++-------- 10 files changed, 45 insertions(+), 66 deletions(-) diff --git a/web/src/app/assistants/SidebarWrapper.tsx b/web/src/app/assistants/SidebarWrapper.tsx index 58190228bbd..a5a1cdb4148 100644 --- a/web/src/app/assistants/SidebarWrapper.tsx +++ b/web/src/app/assistants/SidebarWrapper.tsx @@ -153,13 +153,15 @@ export default function SidebarWrapper({ />
{children}
- + ); } diff --git a/web/src/app/chat/ChatPage.tsx b/web/src/app/chat/ChatPage.tsx index f246e767893..a4fcc00e1d9 100644 --- a/web/src/app/chat/ChatPage.tsx +++ b/web/src/app/chat/ChatPage.tsx @@ -2512,10 +2512,7 @@ export function ChatPage({ )} - + - + <>
{isRenamingChat ? ( diff --git a/web/src/app/chat/shared_chat_search/FixedLogo.tsx b/web/src/app/chat/shared_chat_search/FixedLogo.tsx index f20642e6298..921220adbd7 100644 --- a/web/src/app/chat/shared_chat_search/FixedLogo.tsx +++ b/web/src/app/chat/shared_chat_search/FixedLogo.tsx @@ -9,12 +9,9 @@ import { useContext } from "react"; import { FiSidebar } from "react-icons/fi"; export default function FixedLogo({ - // Whether the logo is on the application page or not - onApplicationPage, // Whether the sidebar is toggled or not backgroundToggled, }: { - onApplicationPage?: boolean; backgroundToggled?: boolean; }) { const combinedSettings = useContext(SettingsContext); @@ -36,10 +33,7 @@ export default function FixedLogo({
{enterpriseSettings && enterpriseSettings.application_name ? (
- + {enterpriseSettings.application_name} {!NEXT_PUBLIC_DO_NOT_USE_TOGGLE_OFF_DANSWER_POWERED && ( @@ -47,10 +41,7 @@ export default function FixedLogo({ )}
) : ( - + Danswer )} diff --git a/web/src/components/BasicClickable.tsx b/web/src/components/BasicClickable.tsx index eb5aabc26b5..c7a58d3cb03 100644 --- a/web/src/components/BasicClickable.tsx +++ b/web/src/components/BasicClickable.tsx @@ -81,14 +81,12 @@ export function BasicSelectable({ children, selected, hasBorder, - onApplicationPage, fullWidth = false, padding = "normal", }: { children: string | JSX.Element; selected: boolean; hasBorder?: boolean; - onApplicationPage?: boolean; fullWidth?: boolean; padding?: "none" | "normal" | "extra"; }) { @@ -104,12 +102,8 @@ export function BasicSelectable({ ${hasBorder ? "border border-border" : ""} ${ selected - ? onApplicationPage - ? "bg-background-chat-selected" - : "bg-hover" - : onApplicationPage - ? "hover:bg-background-chat-hover" - : "hover:bg-hover" + ? "bg-background-chat-selected" + : "hover:bg-background-chat-hover" } ${fullWidth ? "w-full" : ""}`} > diff --git a/web/src/components/admin/ClientLayout.tsx b/web/src/components/admin/ClientLayout.tsx index 16500b5e0eb..7ca8eb75283 100644 --- a/web/src/components/admin/ClientLayout.tsx +++ b/web/src/components/admin/ClientLayout.tsx @@ -58,7 +58,7 @@ export function ClientLayout({ return (
-
+
{enterpriseSettings && enterpriseSettings.application_name ? (
- + {enterpriseSettings.application_name} {!NEXT_PUBLIC_DO_NOT_USE_TOGGLE_OFF_DANSWER_POWERED && ( @@ -65,7 +65,7 @@ export function AdminSidebar({ collections }: { collections: Collection[] }) { )}
) : ( - Danswer + Danswer )}
@@ -74,7 +74,7 @@ export function AdminSidebar({ collections }: { collections: Collection[] }) {
-
- + ); }; diff --git a/web/tailwind-themes/tailwind.config.js b/web/tailwind-themes/tailwind.config.js index d61224cb8a4..b6ee8f1d61c 100644 --- a/web/tailwind-themes/tailwind.config.js +++ b/web/tailwind-themes/tailwind.config.js @@ -83,7 +83,7 @@ module.exports = { "non-selectable": "var(--non-selectable)", // background - background: "var(--background)", + background: "#EDEDF1", "background-100": "var(--background-100)", "background-125": "var(--background-125)", "background-150": "var(--background-150)", @@ -95,35 +95,40 @@ module.exports = { "background-700": "var(--background-700)", "background-800": "var(--background-800)", "background-900": "var(--background-900)", + "background-toggle": "var(--background-100)", + "toggled-background": "var(--background-500)", + "untoggled-background": "var(--background-300)", "background-inverted": "var(--background-inverted)", "background-emphasis": "var(--background-emphasis)", "background-strong": "var(--background-strong)", "background-search": "var(--white)", + "text-sidebar-toggled-header": "var(--text-200)", + "text-sidebar-header": "var(--text-900)", + "text-sidebar-dark": "var(--text-200)", + + "search-answer-border": "var(--background-300)", + + "background-chat-hover": "#1D4ED8", + "background-chat-selected": "#1D4ED8", // colors for sidebar in chat, search, and manage settings - "background-sidebar": "var(--background-100)", + "background-sidebar": "#0021A5", "background-settings-sidebar": "var(--background-100)", - "background-chatbar": "var(--background-100)", - "text-sidebar": "var(--text-500)", - - "toggled-background": "var(--background-400)", - "untoggled-background": "var(--background-200)", + "background-chatbar": "#FFFFFF", + "text-sidebar": "#FFFFFF", // Settings - "text-sidebar-subtle": "var(--text-500)", - "icon-settings-sidebar": "var(--text-600)", - "text-settings-sidebar": "var(--text-600)", - "text-settings-sidebar-strong": "var(--text-900)", - "background-settings-hover": "var(--background-200)", - - "background-chat-hover": "var(--background-200)", - "background-chat-selected": "var(--background-200)", + "text-sidebar-subtle": "#A9D4FF", + "icon-settings-sidebar": "var(--text-300)", + "text-settings-sidebar": "var(--text-300)", + "text-settings-sidebar-strong": "var(--text-200)", + "background-settings-hover": "#0026CC", + "background-back-button": "#A9D4FF", + "text-back-button": "var(--text-800)", // Background for chat messages (user bubbles) - user: "var(--user-bubble)", - - "background-toggle": "var(--background-100)", + user: "#0021A5", // Colors for the search toggle buttons "background-agentic-toggled": "var(--light-success)", @@ -137,9 +142,11 @@ module.exports = { "star-indicator": "var(--background-100)", // Backgrounds for submit buttons on search and chat - "submit-background": "var(--background-800)", + "submit-background": "#0021A5", "disabled-submit-background": "var(--background-400)", + "sidebar-toggle": "var(--text-200)", + input: "var(--white)", "text-50": "var(--text-50)", @@ -154,7 +161,7 @@ module.exports = { "text-900": "var(--text-900)", "text-950": "var(--text-950)", - "user-text": "var(--text-800)", + "user-text": "#FFFFFF", description: "var(--text-400)", subtle: "var(--text-500)", From c6556857cceacce98b8a90f9a42c4ddfac3b7884 Mon Sep 17 00:00:00 2001 From: pablodanswer Date: Wed, 30 Oct 2024 14:05:48 -0700 Subject: [PATCH 8/8] update our tailwind config --- web/tailwind-themes/tailwind.config.js | 49 ++++++++++++-------------- 1 file changed, 22 insertions(+), 27 deletions(-) diff --git a/web/tailwind-themes/tailwind.config.js b/web/tailwind-themes/tailwind.config.js index b6ee8f1d61c..c50d77f7073 100644 --- a/web/tailwind-themes/tailwind.config.js +++ b/web/tailwind-themes/tailwind.config.js @@ -83,7 +83,7 @@ module.exports = { "non-selectable": "var(--non-selectable)", // background - background: "#EDEDF1", + background: "var(--background)", "background-100": "var(--background-100)", "background-125": "var(--background-125)", "background-150": "var(--background-150)", @@ -95,40 +95,37 @@ module.exports = { "background-700": "var(--background-700)", "background-800": "var(--background-800)", "background-900": "var(--background-900)", - "background-toggle": "var(--background-100)", - "toggled-background": "var(--background-500)", - "untoggled-background": "var(--background-300)", "background-inverted": "var(--background-inverted)", "background-emphasis": "var(--background-emphasis)", "background-strong": "var(--background-strong)", "background-search": "var(--white)", - "text-sidebar-toggled-header": "var(--text-200)", - "text-sidebar-header": "var(--text-900)", - "text-sidebar-dark": "var(--text-200)", + // colors for sidebar in chat, search, and manage settings + "background-sidebar": "var(--background-100)", + "background-chatbar": "var(--background-100)", + "text-sidebar": "var(--text-500)", - "search-answer-border": "var(--background-300)", + "toggled-background": "var(--background-400)", + "untoggled-background": "var(--background-200)", - "background-chat-hover": "#1D4ED8", - "background-chat-selected": "#1D4ED8", - // colors for sidebar in chat, search, and manage settings - "background-sidebar": "#0021A5", - "background-settings-sidebar": "var(--background-100)", - "background-chatbar": "#FFFFFF", - "text-sidebar": "#FFFFFF", + "background-back-button": "var(--background-200)", + "text-back-button": "var(--text-800)", // Settings - "text-sidebar-subtle": "#A9D4FF", - "icon-settings-sidebar": "var(--text-300)", - "text-settings-sidebar": "var(--text-300)", - "text-settings-sidebar-strong": "var(--text-200)", - "background-settings-hover": "#0026CC", - "background-back-button": "#A9D4FF", - "text-back-button": "var(--text-800)", + "text-sidebar-subtle": "var(--text-500)", + "icon-settings-sidebar": "var(--text-600)", + "text-settings-sidebar": "var(--text-600)", + "text-settings-sidebar-strong": "var(--text-900)", + "background-settings-hover": "var(--background-200)", + + "background-chat-hover": "var(--background-200)", + "background-chat-selected": "var(--background-200)", // Background for chat messages (user bubbles) - user: "#0021A5", + user: "var(--user-bubble)", + + "background-toggle": "var(--background-100)", // Colors for the search toggle buttons "background-agentic-toggled": "var(--light-success)", @@ -142,11 +139,9 @@ module.exports = { "star-indicator": "var(--background-100)", // Backgrounds for submit buttons on search and chat - "submit-background": "#0021A5", + "submit-background": "var(--background-800)", "disabled-submit-background": "var(--background-400)", - "sidebar-toggle": "var(--text-200)", - input: "var(--white)", "text-50": "var(--text-50)", @@ -161,7 +156,7 @@ module.exports = { "text-900": "var(--text-900)", "text-950": "var(--text-950)", - "user-text": "#FFFFFF", + "user-text": "var(--text-800)", description: "var(--text-400)", subtle: "var(--text-500)",