Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2026-01-04 09:38:50 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

style: mobile optimizations, use fixed dialogs, and prevent auto-scroll for presets (#534)

Browse source 
* style(client): adjust height and add overflow to EditPresetDialog, AgentSettings, and Settings components
style(client): adjust size and add overflow to NewConversationMenu and PresetItems components
style(ui): add overflow to DialogContent component

* style(Settings.jsx): change height of settings component to md:h-[350px] h-[490px]
This commit is contained in:
Danny Avila 2023-06-18 11:24:22 -04:00 • committed by GitHub
parent 4f47da8f0d
commit ac537b96f6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 14 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

2
client/src/components/Endpoints/BingAI/Settings.jsx
View file

@ -43,7 +43,7 @@ function Settings(props) {
}, [debouncedContext]);
return (
<div className="max-h-[350px] overflow-y-auto">
<div className="md:h-[350px] h-[490px] overflow-y-auto">
<div className="grid gap-6 sm:grid-cols-2">
<div className="col-span-1 flex flex-col items-center justify-start gap-6">
<div className="grid w-full items-center gap-2">

4
client/src/components/Endpoints/EditPresetDialog.jsx
View file

@ -168,9 +168,9 @@ const EditPresetDialog = ({ open, onOpenChange, preset: _preset, title }) => {
<Dialog open={open} onOpenChange={onOpenChange}>
<DialogTemplate
title={`${title || 'Edit Preset'} - ${preset?.title}`}
className="max-w-full sm:max-w-4xl"
className="max-w-full sm:max-w-4xl h-[675px] "
main={
<div className="flex w-full flex-col items-center gap-2">
<div className="flex w-full flex-col items-center gap-2 md:h-[475px]">
<div className="grid w-full gap-6 sm:grid-cols-2">
<div className="col-span-1 flex flex-col items-start justify-start gap-2">
<Label htmlFor="chatGptLabel" className="text-left text-sm font-medium">

6
client/src/components/Endpoints/Google/Settings.jsx
View file

@ -27,10 +27,8 @@ function Settings(props) {
topP,
topK,
maxOutputTokens,
setOption,
edit = false
setOption
} = props;
const maxHeight = edit ? 'max-h-[305px]' : 'max-h-[350px]';
const endpointsConfig = useRecoilValue(store.endpointsConfig);
const setModel = setOption('model');
@ -46,7 +44,7 @@ function Settings(props) {
const codeChat = model.startsWith('codechat-');
return (
<div className={`${maxHeight} min-h-[200px] overflow-y-auto`}>
<div className={`md:h-[350px] h-[490px] overflow-y-auto`}>
<div className="grid gap-6 sm:grid-cols-2">
<div className="col-span-1 flex flex-col items-center justify-start gap-6">
<div className="grid w-full items-center gap-2">

2
client/src/components/Endpoints/OpenAI/Settings.jsx
View file

@ -43,7 +43,7 @@ function Settings(props) {
const models = endpointsConfig?.[endpoint]?.['availableModels'] || [];
return (
<div className="max-h-[350px] overflow-y-auto">
<div className="md:h-[350px] h-[490px] overflow-y-auto">
<div className="grid gap-6 sm:grid-cols-2">
<div className="col-span-1 flex flex-col items-center justify-start gap-6">
<div className="grid w-full items-center gap-2">

2
client/src/components/Endpoints/Plugins/AgentSettings.jsx
View file

@ -46,7 +46,7 @@ function Settings(props) {
const models = endpointsConfig?.[endpoint]?.['availableModels'] || [];
return (
<div className="max-h-[350px] min-h-[305px] overflow-y-auto">
<div className="md:h-[350px] h-[490px] overflow-y-auto">
<div className="grid gap-6 sm:grid-cols-2">
<div className="col-span-1 flex flex-col items-center justify-start gap-6">
<div className="grid w-full items-center gap-2">

2
client/src/components/Endpoints/Plugins/Settings.jsx
View file

@ -47,7 +47,7 @@ function Settings(props) {
const models = endpointsConfig?.[endpoint]?.['availableModels'] || [];
return (
<div className="max-h-[350px] min-h-[305px] overflow-y-auto">
<div className="md:h-[350px] h-[490px] overflow-y-auto">
<div className="grid gap-6 sm:grid-cols-2">
<div className="col-span-1 flex flex-col items-center justify-start gap-6">
<div className="grid w-full items-center gap-2">