feat: chat panel header absolute
This commit is contained in:
parent
37cc87531c
commit
4a5465f884
|
@ -17,7 +17,7 @@ export interface MenuWrapperInspectProps {
|
|||
showPanel?: boolean;
|
||||
}
|
||||
|
||||
export default function MenuWrapper<
|
||||
export default function MenuLayout<
|
||||
ListComponentProps extends MenuWrapperInspectProps,
|
||||
PanelComponentProps extends MenuWrapperInspectProps,
|
||||
>(
|
|
@ -44,7 +44,7 @@ export default function ChatHeader(props: ChatHeaderProps) {
|
|||
|
||||
return (
|
||||
<div
|
||||
className={`flex flex-0 justify-between items-center px-6 py-4 gap-chat-header-gap border-b-[1px] border-gray-200 ${containerClassName}`}
|
||||
className={`absolute w-[100%] bg-gray-50 z-10 flex flex-0 justify-between items-center px-6 py-4 gap-chat-header-gap border-b-[1px] border-gray-200 ${containerClassName}`}
|
||||
data-tauri-drag-region
|
||||
>
|
||||
{isMobileScreen ? (
|
||||
|
|
|
@ -141,7 +141,7 @@ export default function ChatMessagePanel(props: ChatMessagePanelProps) {
|
|||
|
||||
return (
|
||||
<div
|
||||
className={`relative flex-1 overscroll-y-none overflow-y-auto overflow-x-hidden px-3 pb-6`}
|
||||
className={`pt-[80px] relative flex-1 overscroll-y-none overflow-y-auto overflow-x-hidden px-3 pb-6`}
|
||||
ref={scrollRef}
|
||||
onScroll={(e) => onChatBodyScroll(e.currentTarget)}
|
||||
onMouseDown={() => inputRef.current?.blur()}
|
||||
|
|
|
@ -263,7 +263,7 @@ function _Chat() {
|
|||
|
||||
return (
|
||||
<div
|
||||
className={`flex flex-col ${
|
||||
className={`relative flex flex-col ${
|
||||
isMobileScreen
|
||||
? "absolute h-[100vh] w-[100%]"
|
||||
: "h-[calc(100%-1.25rem)]"
|
||||
|
|
|
@ -22,9 +22,9 @@ import { getTime } from "@/app/utils";
|
|||
import DeleteIcon from "@/app/icons/deleteIcon.svg";
|
||||
import LogIcon from "@/app/icons/logIcon.svg";
|
||||
|
||||
import MenuWrapper, {
|
||||
import MenuLayout, {
|
||||
MenuWrapperInspectProps,
|
||||
} from "@/app/components/MenuWrapper";
|
||||
} from "@/app/components/MenuLayout";
|
||||
import Panel from "./ChatPanel";
|
||||
|
||||
export function SessionItem(props: {
|
||||
|
@ -108,7 +108,7 @@ export function SessionItem(props: {
|
|||
);
|
||||
}
|
||||
|
||||
export default MenuWrapper(function SessionList(props) {
|
||||
export default MenuLayout(function SessionList(props) {
|
||||
const { setShowPanel } = props;
|
||||
|
||||
const [sessions, selectedIndex, selectSession, moveSession] = useChatStore(
|
||||
|
|
|
@ -72,7 +72,7 @@ import { useMaskStore } from "@/app/store/mask";
|
|||
import { ProviderType } from "@/app/utils/cloud";
|
||||
import SettingHeader from "./SettingHeader";
|
||||
import useMobileScreen from "@/app/hooks/useMobileScreen";
|
||||
import { MenuWrapperInspectProps } from "@/app/components/MenuWrapper";
|
||||
import { MenuWrapperInspectProps } from "@/app/components/MenuLayout";
|
||||
|
||||
function EditPromptModal(props: { id: string; onClose: () => void }) {
|
||||
const promptStore = usePromptStore();
|
||||
|
|
|
@ -1,12 +1,12 @@
|
|||
import Locale from "@/app/locales";
|
||||
import useMobileScreen from "@/app/hooks/useMobileScreen";
|
||||
import MenuWrapper from "@/app/components/MenuWrapper";
|
||||
import MenuLayout from "@/app/components/MenuLayout";
|
||||
|
||||
import Panel from "./SettingPanel";
|
||||
|
||||
import GotoIcon from "@/app/icons/goto.svg";
|
||||
|
||||
export default MenuWrapper(function SettingList(props) {
|
||||
export default MenuLayout(function SettingList(props) {
|
||||
const { setShowPanel } = props;
|
||||
const isMobileScreen = useMobileScreen();
|
||||
|
||||
|
|
Loading…
Reference in New Issue