usememos / memos

An open-source, lightweight note-taking solution. The pain-less way to create your meaningful notes. Your Notes, Your Way.
https://usememos.com
MIT License
34.06k stars 2.46k forks source link

Include created time in date heading. #3817

Closed k3nden closed 2 months ago

k3nden commented 2 months ago

Describe the solution you'd like

Add a toggle in the "memo related settings" that adds "include time "created on" to the memo

From the home screen, each memo shows the date created and it's contents, I would like to also expose the "created on" time on this screen. This time is displayed when the memo is opened for editing. I use the time of day for my memos to know when I made the memo for that day.

Type of feature

User Experience (UX)

Additional context

I record the same data at multiple times of day and I would like to be able to see that data without having to either record it or open the memo for editing.

RoccoSmit commented 2 months ago

this display format can be achieved by adding hour="2-digit" minute="2-digit" properties to the relative-time component

k3nden commented 2 months ago

Thank you, but how do I expose the relative-time component or how do I change it? I tried adding the text below to the 'Additional style section' : I can see it when inspecting the page source but I do not see it on the memos. I think I'm on the wrong track.

relative-time {
 hour="2-digit"
minute="2-digit"
}
RoccoSmit commented 2 months ago

This is something that would need to get set in the React code to work nicely, but as a quick and dirty workaround you can try adding the following to the Additional script section

setInterval(() => {
    const matchingTags = document.getElementsByTagName("relative-time");
    const matches = Array.prototype.slice.call(matchingTags);

    matches.forEach(match => {
        match.setAttribute("hour", "2-digit");
        match.setAttribute("minute", "2-digit");
    })
}, 10000)

The above code will wait 10 seconds (10000 in last line = 10000 ms = 10 sec, change as you like) and look for all the relative-time date time html elements and add the required properties to see hours and minutes.

This action will be repeated every 10 seconds in case additional memos are loaded. If you prefer this run only once, replace setInterval with setTimeout