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: ui optiminize

Browse Source
This commit is contained in:
butterfly
2024-04-28 19:58:59 +08:00
parent 9f4813326c
commit c34b8ab919
20 changed files with 381 additions and 193 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -79,7 +79,7 @@ export default function ActionsBar(props: ActionsBarProps) {
key={action.id}
className={` cursor-pointer shrink-1 grow-0 basis-[${
(100 - 1) / arr.length
}%] flex flex-col items-center justify-center gap-0.5
}%] flex flex-col items-center justify-around gap-0.5 py-1.5
${
selected === action.id
? "text-text-sidebar-tab-mobile-active"

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

@@ -32,7 +32,9 @@ export default function Btn(props: {
switch (type) {
case "primary":
btnClassName = `${
disabled ? "bg-primary-btn-disabled" : "bg-primary-btn shadow-btn"
disabled
? "bg-primary-btn-disabled dark:opacity-30 dark:text-primary-btn-disabled-dark"
: "bg-primary-btn shadow-btn"
} text-text-btn-primary `;
break;
case "danger":

26
app/components/MenuLayout/index.tsx
View File

@@ -84,20 +84,20 @@ export default function MenuLayout<
setShowPanel={setShowPanel}
showPanel={showPanel}
/>
{!isMobileScreen && (
<div
className={`group/menu-dragger absolute right-0 h-[100%] flex items-center`}
onPointerDown={(e) => {
startDragWidth.current = config.sidebarWidth;
onDragStart(e as any);
}}
>
<div className="opacity-0 group-hover/menu-dragger:bg-[rgba($color: #000000, $alpha: 0.01)] group-hover/menu-dragger:opacity-20">
<DragIcon />
</div>
</div>
)}
</div>
{!isMobileScreen && (
<div
className={`group/menu-dragger h-[100%] cursor-col-resize w-[0.25rem] flex items-center justify-center`}
onPointerDown={(e) => {
startDragWidth.current = config.sidebarWidth;
onDragStart(e as any);
}}
>
<div className="w-[1px] opacity-0 group-hover/menu-dragger:opacity-100 bg-menu-dragger">
&nbsp;
</div>
</div>
)}
<div
className={`
md:flex-1 md:h-[100%] md:w-page

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

@@ -39,7 +39,7 @@ if (!popoverRoot) {
popoverRoot.style.width = "100%";
popoverRoot.style.position = "fixed";
popoverRoot.style.bottom = "0";
popoverRoot.style.zIndex = "100";
popoverRoot.style.zIndex = "10000";
popoverRoot.id = "popover-root";
}

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

@@ -52,9 +52,9 @@ export default function Screen(props: ScreenProps) {
<div
className={`
h-[100%]
max-md:w-[100%]
md:flex-1 md:min-w-0 md:overflow-hidden
h-[100%]
max-md:w-[100%]
md:flex-1 md:min-w-0 md:overflow-hidden
`}
id={SlotID.AppBody}
style={{

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

@@ -79,13 +79,14 @@ const Select = <Value extends number | string>(props: SearchProps<Value>) => {
placement={
position?.poi.relativePosition[1] !== Orientation.bottom ? "rb" : "rt"
}
popoverClassName="border border-select-popover rounded-lg shadow-select-popover-shadow w-actions-popover bg-select-popover-panel dark:bg-select-popover-panel-dark"
popoverClassName="border border-select-popover rounded-lg shadow-select-popover-shadow w-actions-popover bg-select-popover-panel"
onShow={(e) => {
getRelativePosition(contentRef.current!, "");
}}
className={selectClassName}
>
<div
className={`flex items-center gap-3 py-2 px-3 bg-select rounded-action-btn font-time text-sm-title ${selectClassName} cursor-pointer`}
className={`flex items-center gap-3 py-2 px-3 bg-select rounded-action-btn font-time text-sm-title cursor-pointer`}
ref={contentRef}
>
<div className={`flex items-center gap-2 flex-1`}>