feat: old page dark mode compatible

This commit is contained in:
Dean-YZG
2024-05-06 22:23:21 +08:00
parent 68f0fa917f
commit fa2f8c66d1
8 changed files with 98 additions and 47 deletions

View File

@@ -124,13 +124,17 @@ const ModelSelect = () => {
return (
<Popover
content={content({ close: () => {} })}
content={
<div className="max-h-chat-actions-select-model-popover overflow-y-auto">
{content({ close: () => {} })}
</div>
}
trigger="click"
noArrow
placement={
position?.poi.relativePosition[1] !== Orientation.bottom ? "lb" : "lt"
}
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]"
popoverClassName="border border-select-popover rounded-lg shadow-select-popover-shadow w-actions-popover bg-model-select-popover-panel w-[280px]"
onShow={(e) => {
if (e) {
autoScrollToSelectedModal();

View File

@@ -67,15 +67,14 @@ export default function PromptHints(props: {
return (
<div
className={`
${styles["prompt-hints"]}
transition-all duration-300 shadow-prompt-hint-container rounded-none w-[100%] flex flex-col-reverse overflow-auto
${
notShowPrompt
? "max-h-[0vh] border-none"
: "border-b pt-2.5 max-h-[50vh]"
}
${props.className}
`}
transition-all duration-300 shadow-prompt-hint-container rounded-none flex flex-col-reverse overflow-x-hidden
${
notShowPrompt
? "max-h-[0vh] border-none"
: "border-b pt-2.5 max-h-[50vh]"
}
${props.className}
`}
>
{internalPrompts.map((prompt, i) => (
<div

View File

@@ -525,38 +525,33 @@
text-overflow: ellipsis;
}
.prompt-hints {
.prompt-hint {
color:var(--btn-default-text);
padding: 6px 10px;
// animation: slide-in ease 0.3s;
// cursor: pointer;
// transition: all ease 0.3s;
border: transparent 1px solid;
margin: 4px;
border-radius: 8px;
.prompt-hint {
color:var(--btn-default-text);
padding: 6px 10px;
border: transparent 1px solid;
margin: 4px;
border-radius: 8px;
&:not(:last-child) {
margin-top: 0;
}
&:not(:last-child) {
margin-top: 0;
}
.hint-title {
font-size: 12px;
font-weight: bolder;
.hint-title {
font-size: 12px;
font-weight: bolder;
@include single-line();
}
@include single-line();
}
.hint-content {
font-size: 12px;
.hint-content {
font-size: 12px;
@include single-line();
}
@include single-line();
}
&-selected,
&:hover {
border-color: var(--primary);
}
&-selected,
&:hover {
border-color: var(--primary);
}
}

View File

@@ -111,8 +111,30 @@ export default function Home() {
<ErrorBoundary>
<Routes>
<Route path={Path.Home} element={<Chat />} />
<Route path={Path.NewChat} element={<NewChat />} />
<Route path={Path.Masks} element={<MaskPage />} />
<Route
path={Path.NewChat}
element={
<NewChat
className={`
md:w-[100%] px-1
${config.theme === "dark" ? "" : "bg-gray-50"}
${config.isMobileScreen ? "pb-chat-panel-mobile" : ""}
`}
/>
}
/>
<Route
path={Path.Masks}
element={
<MaskPage
className={`
md:w-[100%]
${config.theme === "dark" ? "" : "bg-gray-50"}
${config.isMobileScreen ? "pb-chat-panel-mobile" : ""}
`}
/>
}
/>
<Route path={Path.Chat} element={<Chat />} />
<Route path={Path.Settings} element={<Settings />} />
</Routes>