storkit: merge 397_bug_selection_screen_directory_picker_unreadable_in_dark_mode

2026-03-26 11:13:24 +00:00
parent 1a7f419ecf
commit 108a697483
5 changed files with 538 additions and 9 deletions
@@ -32,7 +32,7 @@ function renderHighlightedMatch(text: string, query: string) {
 		return (
 			<span
 				key={`${char}-${count}`}
-				style={isMatch ? { fontWeight: 600, color: "#222" } : undefined}
+				className={isMatch ? "path-match-highlight" : undefined}
 			>
 				{char}
 			</span>
@@ -93,16 +93,15 @@ export function ProjectPathInput({
 			/>
 			{matchList.length > 0 && (
 				<div
+					className="path-dropdown"
 					style={{
 						position: "absolute",
 						top: "100%",
 						left: 0,
 						right: 0,
 						marginTop: "6px",
-						border: "1px solid #ddd",
 						borderRadius: "6px",
 						overflow: "hidden",
-						background: "#fff",
 						fontFamily: "monospace",
 						height: "160px",
 						overflowY: "auto",
@@ -111,13 +110,12 @@ export function ProjectPathInput({
 					}}
 				>
 					<div
+						className="path-dropdown-header"
 						style={{
 							display: "flex",
 							justifyContent: "flex-end",
 							alignItems: "center",
 							padding: "4px 6px",
-							borderBottom: "1px solid #eee",
-							background: "#fafafa",
 						}}
 					>
 						<button
@@ -128,8 +126,6 @@ export function ProjectPathInput({
 								width: "24px",
 								height: "24px",
 								borderRadius: "4px",
-								border: "1px solid #ddd",
-								background: "#fff",
 								cursor: "pointer",
 								lineHeight: 1,
 							}}
@@ -143,6 +139,7 @@ export function ProjectPathInput({
 							<button
 								key={match.path}
 								type="button"
+								className={`path-dropdown-item${isSelected ? " path-dropdown-item--selected" : ""}`}
 								onMouseEnter={() => onSelectMatch(index)}
 								onMouseDown={(event) => {
 									event.preventDefault();
@@ -154,7 +151,6 @@ export function ProjectPathInput({
 									textAlign: "left",
 									padding: "6px 8px",
 									border: "none",
-									background: isSelected ? "#f0f0f0" : "transparent",
 									cursor: "pointer",
 									fontFamily: "inherit",
 								}}