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

🖌️ style: Improve Dark Theme Accessibility (#2125)

Browse source 
* style: all landing page components

* chore: converted all slate to gray, since slate doesnt work

* style: assistant panel

* style: basic UI components, userprovided, preset

* style: update in multiple components

* fix(PluginStoreDialog): justify-center

* fixed some minor Ui styles

* style(MultiSearch): update dark bg

* style: update Convo styling

* style: lower textarea max height slightly

---------

Co-authored-by: Danny Avila <messagedaniel@protonmail.com>
This commit is contained in:
Marco Beretta 2024-03-21 14:02:00 +01:00 • committed by GitHub
parent e95c0aaaed
commit 30f6d90cfe
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
59 changed files with 170 additions and 175 deletions
Download patch file Download diff file Expand all files Collapse all files

10
client/src/components/Chat/Menus/Presets/EditPresetDialog.tsx
View file

@ -53,7 +53,7 @@ const EditPresetDialog = ({
main={
<div className="flex w-full flex-col items-center gap-2 md:h-[530px]">
<div className="grid w-full">
<div className="col-span-4 flex items-start md:flex-row justify-start flex-col gap-6 pb-4">
<div className="col-span-4 flex flex-col items-start justify-start gap-6 pb-4 md:flex-row">
<div className="flex w-full flex-col">
<Label htmlFor="preset-name" className="mb-1 text-left text-sm font-medium">
{localize('com_endpoint_preset_name')}
@ -90,13 +90,13 @@ const EditPresetDialog = ({
{'ㅤ'}
</Label>
<PopoverButtons
buttonClass="ml-0 w-full dark:bg-gray-700 dark:hover:bg-gray-800 p-2 h-[40px] justify-center mt-0"
iconClass="hidden lg:block w-4"
buttonClass="ml-0 w-full border border-gray-100 dark:border-gray-600 dark:bg-gray-700 dark:hover:bg-gray-600 p-2 h-[40px] justify-center mt-0"
iconClass="hidden lg:block w-4 "
/>
</div>
</div>
</div>
<div className="my-4 w-full border-t border-gray-300 dark:border-gray-700" />
<div className="my-4 w-full border-t border-gray-300 dark:border-gray-600" />
<div className="w-full p-0">
<EndpointSettings
conversation={preset}
@ -112,7 +112,7 @@ const EditPresetDialog = ({
<div className="mb-6 md:mb-2">
<DialogButton
onClick={exportPreset}
className="border-gray-100 hover:bg-gray-100 dark:border-gray-700 dark:hover:bg-gray-600"
className="border-gray-100 hover:bg-gray-100 dark:border-gray-600 dark:hover:bg-gray-600"
>
{localize('com_endpoint_export')}
</DialogButton>

10
client/src/components/Chat/Menus/Presets/PresetItems.tsx
View file

@ -55,7 +55,7 @@ const PresetItems: FC<{
<DialogTrigger asChild>
<label
htmlFor="file-upload"
className="mr-1 flex h-[32px] cursor-pointer items-center rounded bg-transparent px-2 py-1 text-xs font-medium font-normal text-gray-600 transition-colors hover:bg-gray-100 hover:text-red-700 dark:bg-transparent dark:text-gray-300 dark:hover:bg-gray-800 dark:hover:text-green-500 dark:hover:text-red-700"
className="mr-1 flex h-[32px] cursor-pointer items-center rounded bg-transparent px-2 py-1 text-xs font-medium font-normal text-gray-600 transition-colors hover:bg-gray-100 hover:text-red-700 dark:bg-transparent dark:text-gray-300 dark:hover:bg-gray-700 dark:hover:text-green-500 dark:hover:text-red-700"
>
<svg
width="24"
@ -87,7 +87,7 @@ const PresetItems: FC<{
}
selection={{
selectHandler: clearAllPresets,
selectClasses: 'bg-red-600 hover:bg-red-700 dark:hover:bg-red-800 text-white',
selectClasses: 'bg-red-600 hover:bg-red-700 dark:hover:bg-red-600 text-white',
selectText: localize('com_ui_clear'),
}}
/>
@ -143,7 +143,7 @@ const PresetItems: FC<{
>
<div className="flex h-full items-center justify-end gap-1">
<button
className="m-0 h-full rounded-md p-2 text-gray-400 hover:text-gray-700 dark:bg-gray-700 dark:text-gray-400 dark:hover:text-gray-200 sm:invisible sm:group-hover:visible"
className="m-0 h-full rounded-md p-2 text-gray-400 hover:text-gray-700 dark:bg-gray-600 dark:text-gray-400 dark:hover:text-gray-200 sm:invisible sm:group-hover:visible"
onClick={(e) => {
e.preventDefault();
e.stopPropagation();
@ -153,7 +153,7 @@ const PresetItems: FC<{
<PinIcon unpin={defaultPreset?.presetId === preset.presetId} />
</button>
<button
className="m-0 h-full rounded-md p-2 text-gray-400 hover:text-gray-700 dark:bg-gray-700 dark:text-gray-400 dark:hover:text-gray-200 sm:invisible sm:group-hover:visible"
className="m-0 h-full rounded-md p-2 text-gray-400 hover:text-gray-700 dark:bg-gray-600 dark:text-gray-400 dark:hover:text-gray-200 sm:invisible sm:group-hover:visible"
onClick={(e) => {
e.preventDefault();
e.stopPropagation();
@ -163,7 +163,7 @@ const PresetItems: FC<{
<EditIcon />
</button>
<button
className="m-0 h-full rounded-md p-2 text-gray-400 hover:text-gray-700 dark:bg-gray-700 dark:text-gray-400 dark:hover:text-gray-200 sm:invisible sm:group-hover:visible"
className="m-0 h-full rounded-md p-2 text-gray-400 hover:text-gray-600 dark:bg-gray-600 dark:text-gray-400 dark:hover:text-gray-200 sm:invisible sm:group-hover:visible"
onClick={(e) => {
e.preventDefault();
e.stopPropagation();