From 330282d8b2518dde0eee3632216b7805fd4e29dc Mon Sep 17 00:00:00 2001
From: Steven <stevenlgtm@gmail.com>
Date: Mon, 16 Jun 2025 20:48:08 +0800
Subject: [PATCH] chore: tweak styles

---
 .../components/MemoEditor/ActionButton/LocationSelector.tsx   | 4 ++--
 web/src/components/MemoEditor/Editor/index.tsx                | 2 +-
 web/src/components/MemoEditor/index.tsx                       | 1 +
 web/src/components/SearchBar.tsx                              | 2 +-
 web/src/components/StatisticsView/MonthNavigator.tsx          | 2 +-
 5 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/web/src/components/MemoEditor/ActionButton/LocationSelector.tsx b/web/src/components/MemoEditor/ActionButton/LocationSelector.tsx
index 16a1b2358..c206f3430 100644
--- a/web/src/components/MemoEditor/ActionButton/LocationSelector.tsx
+++ b/web/src/components/MemoEditor/ActionButton/LocationSelector.tsx
@@ -115,9 +115,9 @@ const LocationSelector = (props: Props) => {
                 size="sm"
                 startDecorator={
                   state.position && (
-                    <span className="text-xs opacity-60">
+                    <div className="text-xs leading-6 opacity-60">
                       [{state.position.lat.toFixed(2)}, {state.position.lng.toFixed(2)}]
-                    </span>
+                    </div>
                   )
                 }
                 disabled={!state.position}
diff --git a/web/src/components/MemoEditor/Editor/index.tsx b/web/src/components/MemoEditor/Editor/index.tsx
index e2217aba0..cb218ada7 100644
--- a/web/src/components/MemoEditor/Editor/index.tsx
+++ b/web/src/components/MemoEditor/Editor/index.tsx
@@ -217,7 +217,7 @@ const Editor = forwardRef(function Editor(props: Props, ref: React.ForwardedRef<
       className={cn("flex flex-col justify-start items-start relative w-full h-auto max-h-[50vh] bg-inherit dark:text-gray-300", className)}
     >
       <textarea
-        className="w-full h-full my-1 text-base resize-none overflow-x-hidden overflow-y-auto bg-transparent outline-none whitespace-pre-wrap break-words"
+        className="w-full h-full my-1 text-base resize-none overflow-x-hidden overflow-y-auto bg-transparent outline-none placeholder:opacity-70 whitespace-pre-wrap break-words"
         rows={2}
         placeholder={placeholder}
         ref={editorRef}
diff --git a/web/src/components/MemoEditor/index.tsx b/web/src/components/MemoEditor/index.tsx
index 540bbc3e5..54afede70 100644
--- a/web/src/components/MemoEditor/index.tsx
+++ b/web/src/components/MemoEditor/index.tsx
@@ -528,6 +528,7 @@ const MemoEditor = observer((props: Props) => {
         <div
           className={cn(
             "absolute right-1 top-1 opacity-60",
+            "flex flex-row justify-end items-center gap-1",
             "invisible group-focus-within:visible group-hover:visible hover:visible focus-within:visible",
             (isVisibilitySelectorOpen || memoName) && "visible",
           )}
diff --git a/web/src/components/SearchBar.tsx b/web/src/components/SearchBar.tsx
index 9f0209d44..71b4edd9e 100644
--- a/web/src/components/SearchBar.tsx
+++ b/web/src/components/SearchBar.tsx
@@ -36,7 +36,7 @@ const SearchBar = observer(() => {
       <SearchIcon className="absolute left-2 w-4 h-auto opacity-40 dark:text-zinc-300" />
       <input
         className={cn(
-          "w-full text-gray-500 leading-6 dark:text-zinc-300 placeholder:opacity-80 bg-zinc-50 dark:bg-zinc-900 border border-zinc-200 dark:border-zinc-800 text-sm rounded-xl p-1 pl-8 outline-0",
+          "w-full text-gray-500 leading-6 dark:text-zinc-300 bg-zinc-50 dark:bg-zinc-900 border border-zinc-200 dark:border-zinc-800 text-sm rounded-xl p-1 pl-8 outline-0",
         )}
         placeholder={t("memo.search-placeholder")}
         value={queryText}
diff --git a/web/src/components/StatisticsView/MonthNavigator.tsx b/web/src/components/StatisticsView/MonthNavigator.tsx
index e95ace322..3eb50b4f7 100644
--- a/web/src/components/StatisticsView/MonthNavigator.tsx
+++ b/web/src/components/StatisticsView/MonthNavigator.tsx
@@ -16,7 +16,7 @@ export const MonthNavigator = ({ visibleMonth, onMonthChange }: MonthNavigatorPr
 
   return (
     <div className="w-full mb-1 flex flex-row justify-between items-center gap-1">
-      <span className="relative text-sm dark:text-gray-400">
+      <span className="relative text-sm text-gray-500 dark:text-gray-400">
         {currentMonth.toLocaleString(i18n.language, { year: "numeric", month: "long" })}
       </span>
       <div className="flex justify-end items-center shrink-0 gap-1">