jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

changed alert dark mode classes

Browse source
This commit is contained in:
Lucas Oliveira 2023-05-11 23:18:38 -03:00
commit 1fb5fd6e45
6 changed files with 18 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/frontend/src/alerts/alertDropDown/index.tsx
View file

@ -24,11 +24,11 @@ export default function AlertDropdown({}: AlertDropdownType) {
return (
<div
ref={componentRef}
className="z-10 py-3 pb-4 rounded-md bg-white dark:bg-gray-800 ring-1 ring-black ring-opacity-5 shadow-lg focus:outline-none overflow-hidden w-[400px] h-[500px] flex flex-col"
className="z-10 py-3 pb-4 px-2 rounded-md bg-white dark:bg-gray-800 ring-1 ring-black ring-opacity-5 shadow-lg focus:outline-none overflow-hidden w-[400px] h-[500px] flex flex-col"
>
<div className="flex pl-3 flex-row justify-between text-md font-medium text-gray-800 dark:text-gray-200">
Notifications
<div className="flex gap-2 pr-3 ">
<div className="flex gap-3 pr-3 ">
<button
className="text-gray-800 hover:text-red-500 dark:text-gray-200 dark:hover:text-red-500"
onClick={() => {
@ -46,7 +46,7 @@ export default function AlertDropdown({}: AlertDropdownType) {
</button>
</div>
</div>
<div className="mt-2 flex flex-col overflow-y-scroll w-full h-full scrollbar-hide text-gray-900 dark:text-gray-300">
<div className="mt-3 flex flex-col overflow-y-scroll w-full h-full scrollbar-hide text-gray-900 dark:text-gray-300">
{notificationList.length !== 0 ? (
notificationList.map((alertItem, index) => (
<SingleAlert

8
src/frontend/src/alerts/error/index.tsx
View file

@ -39,16 +39,16 @@ export default function ErrorAlert({
removeAlert(id);
}, 500);
}}
className="rounded-md w-96 mt-6 shadow-xl bg-red-50 p-4 cursor-pointer"
className="rounded-md w-96 mt-6 shadow-xl bg-red-50 dark:bg-red-600/50 p-4 cursor-pointer"
>
<div className="flex">
<div className="flex-shrink-0">
<XCircleIcon className="h-5 w-5 text-red-400" aria-hidden="true" />
<XCircleIcon className="h-5 w-5 text-red-400 dark:text-red-50" aria-hidden="true" />
</div>
<div className="ml-3">
<h3 className="text-sm font-medium text-red-800">{title}</h3>
<h3 className="text-sm font-medium text-red-800 dark:text-white/80">{title}</h3>
{list.length !== 0 ? (
<div className="mt-2 text-sm text-red-700">
<div className="mt-2 text-sm text-red-700 dark:text-red-50">
<ul className="list-disc space-y-1 pl-5">
{list.map((item, index) => (
<li key={index}>{item}</li>

8
src/frontend/src/alerts/notice/index.tsx
View file

@ -36,22 +36,22 @@ export default function NoticeAlert({
setShow(false);
removeAlert(id);
}}
className="rounded-md w-96 mt-6 shadow-xl bg-blue-50 p-4"
className="rounded-md w-96 mt-6 shadow-xl bg-blue-50 dark:bg-blue-600/50 p-4"
>
<div className="flex">
<div className="flex-shrink-0">
<InformationCircleIcon
className="h-5 w-5 text-blue-400"
className="h-5 w-5 text-blue-400 dark:text-blue-50"
aria-hidden="true"
/>
</div>
<div className="ml-3 flex-1 md:flex md:justify-between">
<p className="text-sm text-blue-700">{title}</p>
<p className="text-sm text-blue-700 dark:text-white/80">{title}</p>
<p className="mt-3 text-sm md:mt-0 md:ml-6">
{link !== "" ? (
<Link
to={link}
className="whitespace-nowrap font-medium text-blue-700 hover:text-blue-600"
className="whitespace-nowrap font-medium text-blue-700 dark:text-blue-50 hover:dark:text-blue-10 hover:text-blue-600"
>
Details
</Link>

6
src/frontend/src/alerts/success/index.tsx
View file

@ -34,17 +34,17 @@ export default function SuccessAlert({
setShow(false);
removeAlert(id);
}}
className="rounded-md w-96 mt-6 shadow-xl bg-green-50 p-4"
className="rounded-md w-96 mt-6 shadow-xl bg-green-50 dark:bg-green-600/50 p-4"
>
<div className="flex">
<div className="flex-shrink-0">
<CheckCircleIcon
className="h-5 w-5 text-green-400"
className="h-5 w-5 text-green-400 dark:text-green-50"
aria-hidden="true"
/>
</div>
<div className="ml-3">
<p className="text-sm font-medium text-green-800">{title}</p>
<p className="text-sm font-medium text-green-800 dark:text-white/80">{title}</p>
</div>
</div>
</div>

6
src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx
View file

@ -11,10 +11,10 @@ export default function DisclosureComponent({
{({ open }) => (
<>
<div>
<Disclosure.Button className="select-none bg-gray-50 dark:bg-gray-700 dark:border-y-gray-600 w-full flex justify-between items-center -mt-px px-3 py-2 border-y border-y-gray-200">
<Disclosure.Button className="select-none bg-gray-50 dark:bg-gray-700/60 dark:border-y-gray-600 w-full flex justify-between items-center -mt-px px-3 py-2 border-y border-y-gray-200">
<div className="flex gap-4">
<Icon className="w-6 text-gray-800 dark:text-white" />
<span className="flex items-center text-sm text-gray-800 dark:text-white font-medium">
<Icon className="w-6 text-gray-800 dark:text-white/80" />
<span className="flex items-center text-sm text-gray-800 dark:text-white/80 font-medium">
{title}
</span>
</div>

2
src/frontend/src/pages/FlowPage/components/tabComponent/index.tsx
View file

@ -37,7 +37,7 @@ export default function TabComponent({
</button>
</div>
) : (
<div className="bg-white dark:text-white dark:bg-gray-700 flex select-none justify-between w-44 items-center border border-b-0 border-gray-300 dark:border-gray-600 px-4 py-1 rounded-t-xl -ml-px">
<div className="bg-white dark:text-white dark:bg-gray-700/60 flex select-none justify-between w-44 items-center border border-b-0 border-gray-300 dark:border-gray-600 px-4 py-1 rounded-t-xl -ml-px">
{isRename ? (
<input
autoFocus