From e5ca3c7aceb3be51a58c61dd938a995853438808 Mon Sep 17 00:00:00 2001
From: Kentai Radiquum <kentai.waah@gmail.com>
Date: Fri, 19 Jul 2024 04:44:34 +0500
Subject: [PATCH] refactor: change sort dropdown color
---
app/pages/BookmarksCategory.jsx | 14 +++++++++++++-
app/pages/Favorites.jsx | 14 +++++++++++++-
2 files changed, 26 insertions(+), 2 deletions(-)
diff --git a/app/pages/BookmarksCategory.jsx b/app/pages/BookmarksCategory.jsx
index 3d8c6c0..843907a 100644
--- a/app/pages/BookmarksCategory.jsx
+++ b/app/pages/BookmarksCategory.jsx
@@ -56,13 +56,25 @@ export function BookmarksCategoryPage(props) {
}
}, [scrollPosition]);
+ const DropdownTheme = {
+ floating: {
+ target:
+ "w-fit bg-blue-600 enabled:hover:bg-blue-700 focus:ring-4 focus:outline-none focus:ring-blue-300 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800",
+ },
+ };
+
return (
<main className="container pt-2 pb-16 mx-auto sm:pt-4 sm:pb-0">
<div className="flex items-center justify-between px-4 py-2 border-b-2 border-black">
<h1 className="font-bold text-md sm:text-xl md:text-lg xl:text-xl">
{props.SectionTitleMapping[props.slug]}
</h1>
- <Dropdown label={sort.values[selectedSort].name} dismissOnClick={true} arrowIcon={false}>
+ <Dropdown
+ label={sort.values[selectedSort].name}
+ dismissOnClick={true}
+ arrowIcon={false}
+ theme={DropdownTheme}
+ >
{sort.values.map((item, index) => (
<Dropdown.Item key={index} onClick={() => setSelectedSort(index)}>
<span
diff --git a/app/pages/Favorites.jsx b/app/pages/Favorites.jsx
index 6380ac5..aadd0b3 100644
--- a/app/pages/Favorites.jsx
+++ b/app/pages/Favorites.jsx
@@ -56,13 +56,25 @@ export function FavoritesPage() {
}
}, [scrollPosition]);
+ const DropdownTheme = {
+ floating: {
+ target:
+ "w-fit bg-blue-600 enabled:hover:bg-blue-700 focus:ring-4 focus:outline-none focus:ring-blue-300 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800",
+ },
+ };
+
return (
<main className="container pt-2 pb-16 mx-auto sm:pt-4 sm:pb-0">
<div className="flex items-center justify-between px-4 py-2 border-b-2 border-black">
<h1 className="font-bold text-md sm:text-xl md:text-lg xl:text-xl">
Избранное
</h1>
- <Dropdown label={sort.values[selectedSort].name} dismissOnClick={true} arrowIcon={false}>
+ <Dropdown
+ label={sort.values[selectedSort].name}
+ dismissOnClick={true}
+ arrowIcon={false}
+ theme={DropdownTheme}
+ >
{sort.values.map((item, index) => (
<Dropdown.Item key={index} onClick={() => setSelectedSort(index)}>
<span