7x31
/
ChatGPT-Next-Web
mirror of https://github.com/Yidadaa/ChatGPT-Next-Web.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

complete colors in dark mode

This commit is contained in:
butterfly 2024-05-01 22:35:23 +08:00
parent 8a14cb19a9
commit 68f0fa917f
20 changed files with 174 additions and 94 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
app/components/Btn/index.tsx
View File

@ -55,6 +55,7 @@ export default function Btn(props: BtnProps) {
py-2 px-3 flex items-center justify-center gap-1 rounded-action-btn transition-all duration-300 select-none
${disabled ? "cursor-not-allowed" : "cursor-pointer"}
${btnClassName}
follow-parent-svg
`}
onClick={onClick}
title={title}

2
app/components/Card/index.tsx
View File

@ -14,7 +14,7 @@ export default function Card(props: CardProps) {
{title && (
<div
className={`
capitalize !font-semibold text-sm-mobile font-weight-setting-card-title
capitalize !font-semibold text-sm-mobile font-weight-setting-card-title text-text-card-title
mb-3
ml-3

2
app/components/List/index.tsx
View File

@ -81,7 +81,7 @@ export function ListItem(props: ListItemProps) {
onClick={onClick}
>
<div className={`flex-1 flex flex-col justify-start gap-1`}>
<div className=" font-common text-sm-mobile font-weight-[500] line-clamp-1">
<div className=" font-common text-sm-mobile font-weight-[500] line-clamp-1 text-text-list-title">
{title}
</div>
{subTitle && (

6
app/components/Modal/index.tsx
View File

@ -147,7 +147,7 @@ const Modal = (props: ModalProps) => {
</div>
<div
className={`flex flex-col flex-0
bg-moda-panel text-modal-mask
bg-moda-panel text-modal-panel
${modelClassName}
${panelClassName}
`}
@ -165,7 +165,7 @@ const Modal = (props: ModalProps) => {
${titleClassName}
`}
>
<div className="flex gap-3 justify-start flex-1 items-center">
<div className="flex gap-3 justify-start flex-1 items-center text-text-modal-title text-chat-header-title">
{title}
</div>
{closeble && (
@ -180,7 +180,7 @@ const Modal = (props: ModalProps) => {
)}
</AlertDialog.Title>
)}
<div className="flex-1 overflow-hidden">
<div className="flex-1 overflow-hidden text-text-modal-content text-sm-title">
{typeof content === "function"
? content({
close: () => {

14
app/components/Select/index.tsx
View File

@ -58,14 +58,16 @@ const Select = <Value extends number | string>(props: SearchProps<Value>) => {
{options?.map((o) => (
<div
key={o.value}
className={`flex items-center px-3 py-2 gap-3 rounded-action-btn hover:bg-select-option-hovered cursor-pointer`}
className={`
flex items-center px-3 py-2 gap-3 rounded-action-btn hover:bg-select-option-hovered cursor-pointer
`}
onClick={() => {
onSelect?.(o.value);
}}
>
<div className="flex gap-2 flex-1">
{!!o.icon && <div className="">{o.icon}</div>}
<div className={`flex-1`}>{o.label}</div>
<div className="flex gap-2 flex-1 follow-parent-svg text-text-select-option">
{!!o.icon && <div className="flex items-center">{o.icon}</div>}
<div className={`flex-1 text-text-select-option`}>{o.label}</div>
</div>
<div
className={
@ -97,7 +99,9 @@ const Select = <Value extends number | string>(props: SearchProps<Value>) => {
className={`flex items-center gap-3 py-2 px-3 bg-select rounded-action-btn font-time text-sm-title cursor-pointer hover:bg-select-hover transition duration-300 ease-in-out`}
ref={contentRef}
>
<div className={`flex items-center gap-2 flex-1`}>
<div
className={`flex items-center gap-2 flex-1 follow-parent-svg text-text-select`}
>
{!!selectedOption?.icon && (
<div className={``}>{selectedOption?.icon}</div>
)}

6
app/components/SlideRange/index.tsx
View File

@ -62,9 +62,7 @@ export default function SlideRange(props: SlideRangeProps) {
className={`flex flex-col justify-center items-end gap-1 w-[100%] ${className} ${rangeClassName}`}
>
{!!description && (
<div className="text-text-slider-block text-common text-sm ">
{description}
</div>
<div className=" text-common text-sm ">{description}</div>
)}
<div
className="flex my-1.5 relative w-[100%] h-1.5 bg-slider rounded-slide cursor-pointer"
@ -74,7 +72,7 @@ export default function SlideRange(props: SlideRangeProps) {
&nbsp;
</div>
<div
className="cursor-pointer absolute z-1 w-[30px] top-[50%] translate-y-[-50%] left-[var(--slide-value-size)] translate-x-[-50%] h-slide-btn leading-slide-btn text-sm-mobile text-center rounded-slide border border-slider-block bg-slider-block hover:bg-slider-block-hover"
className="cursor-pointer absolute z-1 w-[30px] top-[50%] translate-y-[-50%] left-[var(--slide-value-size)] translate-x-[-50%] h-slide-btn leading-slide-btn text-sm-mobile text-center rounded-slide border border-slider-block bg-slider-block hover:bg-slider-block-hover text-text-slider-block"
// onPointerDown={onPointerDown}
>
{value}

17
app/components/ui-lib.tsx
View File

@ -101,6 +101,7 @@ interface ModalProps {
defaultMax?: boolean;
footer?: React.ReactNode;
onClose?: () => void;
className?: string;
}
export function Modal(props: ModalProps) {
useEffect(() => {
@ -122,14 +123,14 @@ export function Modal(props: ModalProps) {
return (
<div
className={
styles["modal-container"] + ` ${isMax && styles["modal-container-max"]}`
}
className={`${styles["modal-container"]} ${
isMax && styles["modal-container-max"]
} ${props.className ?? ""}`}
>
<div className={styles["modal-header"]}>
<div className={styles["modal-title"]}>{props.title}</div>
<div className={`${styles["modal-header"]} new-header follow-parent-svg`}>
<div className={`${styles["modal-title"]}`}>{props.title}</div>
<div className={styles["modal-header-actions"]}>
<div className={`${styles["modal-header-actions"]}`}>
<div
className={styles["modal-header-action"]}
onClick={() => setMax(!isMax)}
@ -147,11 +148,11 @@ export function Modal(props: ModalProps) {
<div className={styles["modal-content"]}>{props.children}</div>
<div className={styles["modal-footer"]}>
<div className={`${styles["modal-footer"]} new-footer`}>
{props.footer}
<div className={styles["modal-actions"]}>
{props.actions?.map((action, i) => (
<div key={i} className={styles["modal-action"]}>
<div key={i} className={`${styles["modal-action"]} new-btn`}>
{action}
</div>
))}

16
app/containers/Chat/components/ChatActions.tsx
View File

@ -187,7 +187,7 @@ export function ChatActions(props: {
return (
<div
key={act.text}
className={`flex items-center gap-3 p-3 rounded-action-btn leading-6 cursor-pointer`}
className={`flex items-center gap-3 p-3 rounded-action-btn leading-6 cursor-pointer follow-parent-svg default-icon-color`}
onClick={act.onClick}
>
{act.icon}
@ -206,7 +206,7 @@ export function ChatActions(props: {
placement="rt"
noArrow
popoverClassName="border border-chat-actions-popover-mobile rounded-md shadow-chat-actions-popover-mobile w-actions-popover bg-chat-actions-popover-panel-mobile "
className=" cursor-pointer"
className=" cursor-pointer follow-parent-svg default-icon-color"
>
<AddCircleIcon />
</Popover>
@ -236,7 +236,11 @@ export function ChatActions(props: {
className={`${act.className ?? ""}`}
>
<div
className={` cursor-pointer h-[32px] w-[32px] flex items-center justify-center transition duration-300 ease-in-out hover:bg-chat-actions-btn-hovered hover:rounded-action-btn`}
className={`
cursor-pointer h-[32px] w-[32px] flex items-center justify-center transition duration-300 ease-in-out
hover:bg-chat-actions-btn-hovered hover:rounded-action-btn
follow-parent-svg default-icon-color
`}
onClick={act.onClick}
>
{act.icon}
@ -256,7 +260,11 @@ export function ChatActions(props: {
placement={ind === arr.length - 1 ? "rt" : "t"}
>
<div
className=" cursor-pointer h-[32px] w-[32px] flex items-center transition duration-300 ease-in-out justify-center hover:bg-chat-actions-btn-hovered hover:rounded-action-btn"
className={`
cursor-pointer h-[32px] w-[32px] flex items-center transition duration-300 ease-in-out justify-center
hover:bg-chat-actions-btn-hovered hover:rounded-action-btn
follow-parent-svg default-icon-color
`}
onClick={act.onClick}
>
{act.icon}

9
app/containers/Chat/components/ChatHeader.tsx
View File

@ -22,8 +22,6 @@ export default function ChatHeader(props: ChatHeaderProps) {
const chatStore = useChatStore();
const session = chatStore.currentSession();
const currentModel = chatStore.currentSession().mask.modelConfig.model;
return (
<div
className={`
@ -40,7 +38,10 @@ export default function ChatHeader(props: ChatHeaderProps) {
</div>
{isMobileScreen ? (
<div className=" cursor-pointer" onClick={() => navigate(Path.Home)}>
<div
className=" cursor-pointer follow-parent-svg default-icon-color"
onClick={() => navigate(Path.Home)}
>
<GobackIcon />
</div>
) : (
@ -78,7 +79,7 @@ export default function ChatHeader(props: ChatHeaderProps) {
</div>
<div
className=" cursor-pointer hover:bg-hovered-btn p-1.5 rounded-action-btn"
className=" cursor-pointer hover:bg-hovered-btn p-1.5 rounded-action-btn follow-parent-svg default-icon-color"
onClick={() => {
setShowExport(true);
}}

2
app/containers/Chat/components/ChatInputPanel.tsx
View File

@ -277,7 +277,7 @@ export default forwardRef<ChatInputPanelInstance, ChatInputPanelProps>(
id="chat-input"
ref={inputRef}
className={`
leading-[19px] flex-1 focus:outline-none focus:shadow-none focus:border-none resize-none
leading-[19px] flex-1 focus:outline-none focus:shadow-none focus:border-none resize-none bg-inherit text-text-input
max-md:h-chat-input-mobile
md:min-h-chat-input
`}

1
app/containers/Chat/components/EditMessageModal.tsx
View File

@ -42,6 +42,7 @@ export function EditMessageModal(props: { onClose: () => void }) {
}}
/>,
]}
// className="!bg-modal-mask"
>
<List>
<ListItem

11
app/containers/Chat/components/ModelSelect.tsx
View File

@ -80,7 +80,7 @@ const ModelSelect = () => {
}}
ref={currentModel === o.name ? selectedItemRef : undefined}
>
<div className={`flex-1`}>{o.name}</div>
<div className={`flex-1 text-text-select`}>{o.name}</div>
<div
className={currentModel === o.name ? "opacity-100" : "opacity-0"}
>
@ -111,7 +111,10 @@ const ModelSelect = () => {
noFooter
modelClassName="h-model-bottom-drawer"
>
<div className="flex items-center gap-1 cursor-pointer" ref={rootRef}>
<div
className="flex items-center gap-1 cursor-pointer text-text-modal-select"
ref={rootRef}
>
{currentModel}
<BottomArrowMobile />
</div>
@ -127,7 +130,7 @@ const ModelSelect = () => {
placement={
position?.poi.relativePosition[1] !== Orientation.bottom ? "lb" : "lt"
}
popoverClassName="border border-select-popover rounded-lg shadow-select-popover-shadow w-actions-popover bg-select-popover-panel max-h-chat-actions-select-model-popover w-[280px]"
popoverClassName="border border-select-popover rounded-lg shadow-select-popover-shadow w-actions-popover bg-model-select-popover-panel max-h-chat-actions-select-model-popover w-[280px]"
onShow={(e) => {
if (e) {
autoScrollToSelectedModal();
@ -140,7 +143,7 @@ const ModelSelect = () => {
className="flex items-center justify-center gap-1 cursor-pointer rounded-chat-model-select pl-3 pr-2.5 py-2 font-common leading-4 bg-chat-actions-select-model hover:bg-chat-actions-select-model-hover"
ref={rootRef}
>
<div className="line-clamp-1 max-w-chat-actions-select-model text-sm-title">
<div className="line-clamp-1 max-w-chat-actions-select-model text-sm-title text-text-modal-select">
{currentModel}
</div>
<BottomArrow />

1
app/containers/Chat/components/SessionConfigModal.tsx
View File

@ -49,6 +49,7 @@ export default function SessionConfigModel(props: { onClose: () => void }) {
}}
/>,
]}
// className="!bg-modal-mask"
>
<MaskConfig
mask={session.mask}

17
app/containers/Chat/components/SessionItem.tsx
View File

@ -99,13 +99,18 @@ export default function SessionItem(props: {
<Popover
content={
<div
className={`flex items-center gap-3 p-3 rounded-action-btn leading-6 cursor-pointer`}
className={`
flex items-center gap-3 p-3 rounded-action-btn leading-6 cursor-pointer
follow-parent-svg
fill-none
text-text-chat-menu-item-delete
`}
onClickCapture={(e) => {
props.onDelete?.();
}}
>
<DeleteChatIcon />
<div className="flex-1 font-common text-actions-popover-menu-item text-text-chat-menu-item-delete">
<div className="flex-1 font-common text-actions-popover-menu-item ">
{Locale.Chat.Actions.Delete}
</div>
</div>
@ -124,6 +129,7 @@ export default function SessionItem(props: {
md:group-hover/chat-menu-list:opacity-100
md:hover:bg-select-hover
follow-parent-svg
fill-none
text-text-chat-menu-item-time
`}
>
@ -134,7 +140,12 @@ export default function SessionItem(props: {
<HoverPopover
content={
<div
className={`flex items-center gap-3 p-3 rounded-action-btn leading-6 cursor-pointer`}
className={`
flex items-center gap-3 p-3 rounded-action-btn leading-6 cursor-pointer
follow-parent-svg
fill-none
text-text-chat-menu-item-delete
`}
onClickCapture={(e) => {
props.onDelete?.();
e.preventDefault();

2
app/containers/Chat/index.module.scss
View File

@ -527,7 +527,7 @@
.prompt-hints {
.prompt-hint {
color: var(--black);
color:var(--btn-default-text);
padding: 6px 10px;
// animation: slide-in ease 0.3s;
// cursor: pointer;

1
app/containers/Settings/components/SyncConfigModal.tsx
View File

@ -77,6 +77,7 @@ export default function SyncConfigModal(props: { onClose?: () => void }) {
text={Locale.UI.Confirm}
/>,
]}
className="!bg-modal-mask active-new"
>
<List
widgetStyle={{

2
app/containers/Settings/components/UserPromptModal.tsx
View File

@ -32,6 +32,7 @@ function EditPromptModal(props: { id: string; onClose: () => void }) {
bordered
/>,
]}
// className="!bg-modal-mask"
>
<div className={styles["edit-prompt-modal"]}>
<Input
@ -103,6 +104,7 @@ export default function UserPromptModal(props: { onClose?: () => void }) {
text={Locale.Settings.Prompt.Modal.Add}
/>,
]}
// className="!bg-modal-mask"
>
<div className={styles["user-prompt-modal"]}>
<Input

2
app/icons/logIcon.svg
View File

@ -1,6 +1,6 @@
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="32" height="32" rx="8" fill="url(#paint0_linear_460_33855)"/>
<rect width="32" height="32" rx="8" stroke="white"/>
<rect width="32" height="32" rx="8" stroke="url(#paint0_linear_460_33855)"/>
<g filter="url(#filter0_d_460_33855)">
<path d="M9.51146 11.3436C9.86914 9.99625 11.2528 9.19527 12.5993 9.55608C13.9414 9.9157 14.7392 11.2938 14.3827 12.6368L11.9487 21.8055C11.591 23.1529 10.2073 23.9538 8.86082 23.593C7.51868 23.2334 6.72089 21.8553 7.07741 20.5123L9.51146 11.3436Z" fill="url(#paint1_linear_460_33855)"/>
</g>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.9 KiB

After

Width:  |  Height:  |  Size: 3.9 KiB

144
app/styles/base-new.scss
View File

@ -23,11 +23,32 @@ body {
}
.follow-parent-svg {
svg {
*:not(rect) {
fill: currentColor;
}
svg {
fill: inherit;
*:not(rect) {
fill: currentColor;
}
rect {
fill: inherit;
}
}
}
.default-icon-color {
color: var(--default-icon-color);
}
.active-new {
.new-header, .new-footer {
border-color: var(--modal-header-bottom-border) !important;
color: var(--modal-title-text) !important;
}
.new-btn {
button {
background: var(--default-btn-bg);
color: var(--btn-default-text);
}
}
}
--siderbar-mobile-height: 3.125rem;
@ -93,6 +114,7 @@ body {
--slider-block-hover-bg: #F7F7F8;
--chat-menu-session-unselected-mobile-bg:#FFF;
--chat-menu-session-selected-mobile-bg: rgba(0, 0, 0, 0.05);
--model-select-popover-panel-bg: #fff;
--select-popover-border: rgba(0, 0, 0, 0.1);
--slider-block-border: #c9c9d1;
@ -118,7 +140,9 @@ body {
--btn-primary-text: #fff;
--btn-danger-text: #ff5454;
--btn-default-text: #606078;
--card-title-text: #18182A;
--input-text: #18182a;
--select-text: #18182a;
--list-subtitle-text: #a5a5b3;
--slider-block-text: #606078;
--chat-actions-btn-popover-text: #fff;
@ -136,10 +160,15 @@ body {
--settings-menu-title-text: #18182a;
--settings-menu-item-title-text: #18182a;
--settings-panel-header-title-text: #18182a;
--modal-mask-text: #18182a;
--modal-panel-text: #18182a;
--delete-chat-ok-btn-text: #fff;
--delete-chat-cancel-btn-text: #18182a;
--chat-menu-item-delete-text: #FF5454;
--list-title-text: #18182A;
--select-option-text: #18182A;
--modal-select-text: #18182A;
--modal-title-text: #18182A;
--modal-content-text: #18182A;
--btn-shadow: 0px 4px 10px 0px rgba(60, 68, 255, 0.14);
--chat-actions-popover-mobile-shadow: 0px 14px 40px 0px rgba(0, 0, 0, 0.12);
@ -150,6 +179,8 @@ body {
--delete-chat-popover-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.08),
0px 8px 20px 0px rgba(0, 0, 0, 0.08);
--sidebar-btn-shadow: 4px 8px 16px 0px rgba(60, 68, 255, 0.2);
--default-icon-color: #606078;
}
.dark-new {
@ -208,63 +239,72 @@ body {
--select-hover-bg: #303030;
--input-input-ele-hover-bg: rgba(0, 0, 0, 0);
--chat-menu-session-unselected-mobile-bg:#111;
--chat-menu-session-selected-mobile-bg: rgba(0, 0, 0, 0.05);////////////
--chat-menu-session-selected-mobile-bg: #1D1D1D;
--global-mobile-bg: #303030;
--model-select-popover-panel-bg: #111;
--select-popover-border: rgba(0, 0, 0, 0.1);
--slider-block-border: #c9c9d1;
--thumbnail-border: rgba(0, 0, 0, 0.1);
--chat-actions-popover-mobile-border: #f0f0f3;
--chat-header-bottom-border: #e2e2e6;
--chat-input-top-border: #e2e2e6;
--chat-input-hood-border: #fff;
--chat-input-hood-focus-border: #606078;
--chat-menu-session-selected-border: #c9cefc;
--settings-menu-item-selected-border: #c9cefc;
--settings-header-border: #e2e2e6;
--delete-chat-popover-border: rgba(0, 0, 0, 0.1);
--delete-chat-cancel-btn-border: #e2e2e6;
--chat-menu-session-unselected-border: #f0f0f3;
--chat-menu-session-hovered-border: #e2e2e6;
--modal-header-bottom-border: #f0f0f3;
--chat-menu-session-unselected-mobile-border: #FFF;
--chat-menu-session-selected-mobile-border: rgba(0, 0, 0, 0.05);
--select-popover-border: rgba(255, 255, 255, 0.05);
--slider-block-border: #6C6C6C;
--thumbnail-border: rgba(255, 255, 255, 0.05);
--chat-actions-popover-mobile-border: #303030;
--chat-header-bottom-border: #303030;
--chat-input-top-border: #303030;
--chat-input-hood-border: rgba(0,0,0,0);
--chat-input-hood-focus-border: #E3E3E3;
--chat-menu-session-selected-border: #1C2E70;
--settings-menu-item-selected-border: #1C2E70;
--settings-header-border: #404040;
--delete-chat-popover-border: rgba(255, 255, 255, 0.1);
--delete-chat-cancel-btn-border: #303030;
--chat-menu-session-unselected-border: #303030;
--chat-menu-session-hovered-border: #1D1D1D;
--modal-header-bottom-border: #303030;
--chat-menu-session-unselected-mobile-border: rgba(0, 0, 0, 0);
--chat-menu-session-selected-mobile-border: rgba(0, 0, 0, 0);
--sidebar-tab-mobile-active-text: #2e42f3;
--sidebar-tab-mobile-active-text: #384CFC;
--sidebar-tab-mobile-inactive-text: #a5a5b3;
--btn-primary-text: #fff;
--btn-danger-text: #ff5454;
--btn-default-text: #606078;
--input-text: #18182a;
--btn-default-text: #E3E3E3;
--card-title-text: #FAFAFA;
--input-text: #FAFAFA;
--select-text: #FAFAFA;
--list-subtitle-text: #a5a5b3;
--slider-block-text: #606078;
--chat-actions-btn-popover-text: #fff;
--chat-header-title-text: #18182a;
--chat-header-subtitle-text: #88889a;
--chat-input-placeholder-text: #88889a;
--chat-message-date-text: #88889a;
--chat-message-markdown-user-text: #fff;
--chat-message-markdown-bot-text: #18182a;
--chat-panel-message-clear-text: #a5a5b3;
--chat-panel-message-clear-revert-text: #3c44ff;
--chat-menu-item-title-text: #18182a;
--chat-menu-item-time-text: rgba(0, 0, 0, 0.3);
--chat-menu-item-description-text: #88889a;
--settings-menu-title-text: #18182a;
--settings-menu-item-title-text: #18182a;
--settings-panel-header-title-text: #18182a;
--modal-mask-text: #18182a;
--slider-block-text: #E3E3E3;
--chat-actions-btn-popover-text: #111;
--chat-header-title-text: #FAFAFA;
--chat-header-subtitle-text: #B0B0B0;
--chat-input-placeholder-text: #B0B0B0;
--chat-message-date-text: #B0B0B0;
--chat-message-markdown-user-text: #FAFAFA;
--chat-message-markdown-bot-text: #FAFAFA;
--chat-panel-message-clear-text: #a5a5b3; //////////////
--chat-panel-message-clear-revert-text: #3c44ff; ///////////////
--chat-menu-item-title-text: #fff;
--chat-menu-item-time-text: rgba(255, 255, 255, 0.30);
--chat-menu-item-description-text: #B0B0B0;
--settings-menu-title-text: #FAFAFA;
--settings-menu-item-title-text: #FAFAFA;
--settings-panel-header-title-text: #FAFAFA;
--modal-panel-text: #FAFAFA;
--delete-chat-ok-btn-text: #fff;
--delete-chat-cancel-btn-text: #18182a;
--chat-menu-item-delete-text: #FF5454;
--delete-chat-cancel-btn-text: #FAFAFA;
--chat-menu-item-delete-text: #F55151;
--list-title-text: #FAFAFA;
--select-option-text: #FAFAFA;
--modal-select-text: #E3E3E3;
--modal-title-text: #FAFAFA;
--modal-content-text: #FAFAFA;
--btn-shadow: 0px 4px 10px 0px rgba(60, 68, 255, 0.14);
--btn-shadow: 0px 4px 20px 0px rgba(60, 68, 255, 0.13);
--chat-actions-popover-mobile-shadow: 0px 14px 40px 0px rgba(0, 0, 0, 0.12);
--chat-input-hood-focus-shadow: 0px 4px 20px 0px rgba(60, 68, 255, 0.13);
--select-popover-shadow: 0px 14px 40px 0px rgba(0, 0, 0, 0.12);
--message-actions-bar-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.1);
--select-popover-shadow: 0px 8px 30px 0px rgba(0, 0, 0, 0.10);
--message-actions-bar-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0);
--prompt-hint-container-shadow: inset 0 4px 8px 0 rgba(0, 0, 0, 0.1);
--delete-chat-popover-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.08),
0px 8px 20px 0px rgba(0, 0, 0, 0.08);
--sidebar-btn-shadow: 4px 8px 16px 0px rgba(60, 68, 255, 0.2);
--delete-chat-popover-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.08), 0px 8px 20px 0px rgba(0, 0, 0, 0.08);
--sidebar-btn-shadow: 4px 8px 16px 0px rgba(60, 68, 255, 0.20);
--default-icon-color: #E3E3E3;
}

10
tailwind.config.js
View File

@ -140,6 +140,7 @@ module.exports = {
'chat-actions-select-model-hover': 'var(--chat-actions-select-model-hover-bg)',
'select-hover': 'var(--select-hover-bg)',
'input-input-ele-hover': 'var(--input-input-ele-hover-bg)',
'model-select-popover-panel': 'var(--model-select-popover-panel-bg)',
},
backgroundImage: {
// 'chat-panel-message-user': 'linear-gradient(259deg, #9786FF 8.42%, #4A5CFF 90.13%)',
@ -191,7 +192,12 @@ module.exports = {
'text-btn-primary': 'var(--btn-primary-text)',
'text-btn-danger': 'var(--btn-danger-text)',
'text-btn-default': 'var(--btn-default-text)',
'text-card-title': 'var(--card-title-text)',
'text-input': 'var(--input-text)',
'text-select': 'var(--select-text)',
'text-select-option': 'var(--select-option-text)',
'text-modal-select': 'var(--modal-select-text)',
'text-list-title': 'var(--list-title-text)',
'text-list-subtitle': 'var(--list-subtitle-text)',
'text-slider-block': 'var(--slider-block-text)',
'text-chat-actions-btn-popover': 'var(--chat-actions-btn-popover-text)',
@ -210,10 +216,12 @@ module.exports = {
'text-settings-menu-title': 'var(--settings-menu-title-text)',
'text-settings-menu-item-title': 'var(--settings-menu-item-title-text)',
'text-settings-panel-header-title': 'var(--settings-panel-header-title-text)',
'text-modal-mask': 'var(--modal-mask-text)',
'text-modal-panel': 'var(--modal-panel-text)',
'text-delete-chat-ok-btn': 'var(--delete-chat-ok-btn-text)',
'text-delete-chat-cancel-btn': 'var(--delete-chat-cancel-btn-text)',
'text-primary-btn-disabled-dark': 'var(--primary-btn-disabled-dark-text)',
'text-modal-title': 'var(--modal-title-text)',
'text-modal-content': 'var(--modal-content-text)',
},
keyframes: {
mask: {