YourSelfHosted/memos
1
0
Fork 0
mirror of https://github.com/usememos/memos.git synced 2025-03-19 12:10:08 +01:00
Code Issues Packages Projects Releases Wiki Activity

chore: add datepicker to timeline

Browse Source
This commit is contained in:
Steven 2024-05-09 20:31:37 +08:00
parent e7a788fa71
commit 46a085f8df
2 changed files with 14 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web/src/components/HomeSidebar/TagsSection.tsx
View File

@ -44,9 +44,9 @@ const TagsSection = () => {
return ( return (
<div className="flex flex-col justify-start items-start w-full mt-3 px-1 h-auto shrink-0 flex-nowrap hide-scrollbar"> <div className="flex flex-col justify-start items-start w-full mt-3 px-1 h-auto shrink-0 flex-nowrap hide-scrollbar">
<div className="flex flex-row justify-start items-center w-full gap-1 mb-1"> <div className="group flex flex-row justify-start items-center w-full gap-1 mb-1">
<span className="text-sm leading-6 font-mono text-gray-400 select-none">{t("common.tags")}</span> <span className="text-sm leading-6 font-mono text-gray-400 select-none">{t("common.tags")}</span>
<div> <div className="hidden group-hover:block">
<Tooltip title={"Rebuild"} placement="top"> <Tooltip title={"Rebuild"} placement="top">
<Icon.RefreshCcw <Icon.RefreshCcw
className="text-gray-400 w-4 h-auto cursor-pointer opacity-60 hover:opacity-100" className="text-gray-400 w-4 h-auto cursor-pointer opacity-60 hover:opacity-100"

17
web/src/pages/Timeline.tsx
View File

@ -133,12 +133,19 @@ const Timeline = () => {
<div className="w-full h-auto flex flex-col justify-start items-start"> <div className="w-full h-auto flex flex-col justify-start items-start">
<MemoFilter className="p-2 my-2 rounded-lg dark:bg-zinc-900" /> <MemoFilter className="p-2 my-2 rounded-lg dark:bg-zinc-900" />
<div className={clsx("flex flex-col justify-start items-start w-full mt-2 last:mb-4")}> <div className="flex flex-col justify-start items-start w-full mt-2">
<div className={clsx("flex shrink-0 flex-row w-full pl-1 mt-2 mb-2")}> <div className="w-full flex shrink-0 flex-row justify-between pl-1 mt-1 mb-3">
<div className={clsx("w-full flex flex-col")}> <div className="w-auto flex flex-col">
<span className="font-medium text-3xl sm:text-4xl"> <div className="relative font-medium text-3xl sm:text-4xl">
{new Date(selectedDateString).toLocaleDateString(i18n.language, { month: "short", day: "numeric" })} {new Date(selectedDateString).toLocaleDateString(i18n.language, { month: "short", day: "numeric" })}
</span> <input
className="inset-0 absolute z-1 opacity-0"
type="date"
defaultValue={dayjs(selectedDateString).format("YYYY-MM-DD")}
onFocus={(e) => e.target.showPicker()}
onChange={(e) => setSelectedDateString(e.target.value)}
/>
</div>
<span className="opacity-60 text-lg">{dayjs(monthString).year()}</span> <span className="opacity-60 text-lg">{dayjs(monthString).year()}</span>
</div> </div>
<ActivityCalendar <ActivityCalendar