video icon shadow, focus search by cmd/ctrl + k
Some checks failed
continuous-integration/drone/push Build is failing

This commit is contained in:
Martti Malmi 2023-12-06 10:43:45 +02:00
parent 8e77535a6a
commit fabf0f372f
2 changed files with 10 additions and 1 deletions

View File

@ -63,7 +63,9 @@ export function TimelineRenderer(props: TimelineRendererProps) {
return ( return (
<Link to={`/${noteId}`} className="aspect-square cursor-pointer hover:opacity-80 relative" onClick={onClick}> <Link to={`/${noteId}`} className="aspect-square cursor-pointer hover:opacity-80 relative" onClick={onClick}>
<img src={proxy(media[0].content, 256)} alt="Note Media" className="w-full h-full object-cover" /> <img src={proxy(media[0].content, 256)} alt="Note Media" className="w-full h-full object-cover" />
{isVideo && <Icon name="play-square-outline" className="absolute right-2 top-2 text-white opacity-80" />} {isVideo && (
<Icon name="play-square-outline" className="absolute right-2 top-2 text-white opacity-80 drop-shadow-md" />
)}
</Link> </Link>
); );
}; };

View File

@ -21,6 +21,7 @@ export default function SearchBox() {
const [isFocused, setIsFocused] = useState(false); const [isFocused, setIsFocused] = useState(false);
const navigate = useNavigate(); const navigate = useNavigate();
const location = useLocation(); const location = useLocation();
const inputRef = useRef<HTMLInputElement | null>(null);
const [activeIndex, setActiveIndex] = useState<number>(-1); const [activeIndex, setActiveIndex] = useState<number>(-1);
const resultListRef = useRef<HTMLDivElement | null>(null); const resultListRef = useRef<HTMLDivElement | null>(null);
@ -78,6 +79,10 @@ export default function SearchBox() {
if (e.key === "Escape") { if (e.key === "Escape") {
setSearch(""); setSearch("");
} }
if (e.key === "k" && (e.metaKey || e.ctrlKey)) {
e.preventDefault();
inputRef.current?.focus();
}
}; };
document.addEventListener("keydown", handleGlobalKeyDown); document.addEventListener("keydown", handleGlobalKeyDown);
@ -129,6 +134,7 @@ export default function SearchBox() {
} else if (activeIndex > 0 && results) { } else if (activeIndex > 0 && results) {
const selectedResult = results[activeIndex - 1]; const selectedResult = results[activeIndex - 1];
navigate(`/${new NostrLink(CONFIG.profileLinkPrefix, selectedResult.pubkey).encode()}`); navigate(`/${new NostrLink(CONFIG.profileLinkPrefix, selectedResult.pubkey).encode()}`);
inputRef.current?.blur();
} else { } else {
executeSearch(); executeSearch();
} }
@ -149,6 +155,7 @@ export default function SearchBox() {
return ( return (
<div className="search relative"> <div className="search relative">
<input <input
ref={inputRef}
type="text" type="text"
placeholder={formatMessage({ defaultMessage: "Search", id: "xmcVZ0" })} placeholder={formatMessage({ defaultMessage: "Search", id: "xmcVZ0" })}
className="w-max" className="w-max"