7x31/ChatGPT-Next-Web
1
0
Fork 0
mirror of https://github.com/Yidadaa/ChatGPT-Next-Web.git synced 2025-09-04 22:46:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: complete the missing UI

Browse Source
This commit is contained in:
butterfly
2024-04-30 12:37:28 +08:00
parent 996537d262
commit c3d91bf0cd
21 changed files with 381 additions and 284 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -5,6 +5,7 @@ export type ButtonType = "primary" | "danger" | null;
export interface BtnProps {
onClick?: () => void;
icon?: JSX.Element;
prefixIcon?: JSX.Element;
type?: ButtonType;
text?: React.ReactNode;
bordered?: boolean;
@@ -27,6 +28,7 @@ export default function Btn(props: BtnProps) {
disabled,
tabIndex,
autoFocus,
prefixIcon,
} = props;
let btnClassName;
@@ -61,6 +63,9 @@ export default function Btn(props: BtnProps) {
tabIndex={tabIndex}
autoFocus={autoFocus}
>
{prefixIcon && (
<div className={`flex items-center justify-center`}>{prefixIcon}</div>
)}
{text && (
<div className={`font-common text-sm-title leading-4 line-clamp-1`}>
{text}

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

@@ -8,7 +8,7 @@ import {
useLayoutEffect,
useState,
} from "react";
import List from "@/app/components/List";
import List, { ListContext } from "@/app/components/List";
export interface CommonInputProps
extends Omit<
@@ -45,6 +45,8 @@ export default function Input(props: CommonInputProps & InputProps) {
const { value, type = "text", onChange, className, ...rest } = props;
const [show, setShow] = useState(false);
const { inputClassName } = useContext(ListContext);
const internalType = (show && "text") || type;
const { update } = useContext(List.ListContext);
@@ -55,7 +57,7 @@ export default function Input(props: CommonInputProps & InputProps) {
return (
<div
className={` group/input w-[100%] rounded-chat-input bg-input flex gap-3 items-center px-3 py-2 ${className} hover:bg-select-hover`}
className={` group/input w-[100%] rounded-chat-input bg-input flex gap-3 items-center px-3 py-2 ${className} hover:bg-select-hover ${inputClassName}`}
>
<input
{...rest}

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

@@ -215,7 +215,18 @@ const Modal = (props: ModalProps) => {
</div>
)}
</div>
{type === "modal" && <div className="flex-1">&nbsp;</div>}
{type === "modal" && (
<div
className="flex-1"
onClick={() => {
if (maskCloseble) {
handleClose();
}
}}
>
&nbsp;
</div>
)}
</AlertDialog.Content>
</AlertDialog.Portal>
</AlertDialog.Root>

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

@@ -74,7 +74,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"
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"
// onPointerDown={onPointerDown}
>
{value}