Rename notes, Create new notes, Delete notes about my-notes

[penge]

not to be used

Originally posted by @penge in #53 (comment)

^^^ won't be used.
Tabs will be used instead.

[jmaicaaan]

Tiles

Originally posted by @penge in #53 (comment)

That's great to see!! 🔥 what do you think on making the font size a little smaller? Or is it just looks big?

[penge]

That's great to see!! 🔥 what do you think on making the font size a little smaller? Or is it just looks big?

Font size is actually as in Options. Scales down or up.

I use cow 😃 font to see less and edge cases but all is good on smaller font 😉👍

[jmaicaaan]

Sounds good! Looking forward man🔥

[penge]

not to be used

I've been looking at those Tiles and the things I don't like would be:

• it is wasteful in space
• might need to scroll
• slow to change a note

Tabs

Going back to the idea of having Tabs: (how it will look, still in progress)

How it will work

Tab

• single click => Activate note

• double click => Rename note

• right click => opens menu with Close and Delete
  If you click on Delete, it is replaced with Confirm delete, need to click as well, then it is deleted.

Open button

• single click => displays menu to Open existing note or Create a new note

[penge]

not to be used

[jmaicaaan]

I think you're right about those wasteful space for the tiles. Just minor style for the tabs. I think a separator or border would be ideal to indicate a separation between tabs as I click it. Other than that, this one still looks good! 👌

[penge]

not to be used

May change many times. Visual prototype at the moment.

[jmaicaaan]

Not sure if I posted somewhere my comment last night but yeah it's missing 😓 anyways, I like the tabs too! Good job! 🔥 I think you're right regarding the tiles of having a lot of waste spaces. In regards to tabs, what do you think about having a separator or border between each item? I think that's really helpful on long titles or something.

[jmaicaaan]

Oh it's already there. Lol my page didn't even get the latest updates! 😄

[jmaicaaan]

I love the grayish background color on the selected article instead of the black & white especially on non-dark mode 😄

[penge]

I will add this to the branch at some point.

I let you know when it's in the branch 😃👍

[jmaicaaan]

Yeah sounds good to me! The delay from Google seems unreasonable to me as well. But yeah, that's something we don't have control. I think this coming weekends I can check it locally :)

[penge]

In progress.

[penge]

I have changed the title to "Rename notes, Create new notes, Delete notes" as what comes before how.

Tabs, Tiles
I have tried both but didn't fit in well.

Decided to use something else. Read below.

[penge]

There will be 2 pages:

1) Notes list

See Tiles in the next comment.

2) Note detail

Some notes

Clipboard: A special note that can be edited just like any other note, but cannot be renamed/deleted as it is used by Context menu to receive the content.

Note name: It is required to be unique, meaning 2 notes don't have the same name.

[penge]

Tiles

Notes are displayed as tiles, similar to those in Google Docs. Tiles scale up and down based on the available width.

Tiles display the preview of the content. If the window is very narrow, the preview is hidden.

Rename, Delete

There are three dots to the side, to Rename or Delete the note.

"Clipboard"

"Clipboard" is a special note that cannot be renamed or deleted as it is needed for Save selection and Save selection to other devices context menu.

New Note, Options

At the bottom, there are two buttons:

• New Note to create a new note
• Options to open Options in a new tab

See the tiles below.

A) Large space

B) Medium space

C) Little space

Font size

At any point you can change the font size in Options.

If you need to change the size only temporarily, you can press the keyboard shorcuts for Zoom In / Zoom Out, or press the associated buttons in the browser.

[penge]

Here's a preview of the note detail.

Note detail

At the top right, there are three dots (same as in Tiles, same function) to Rename or Delete the note.

Clicking three dots will open:

[penge]

Renaming and Deleting the note. Both can be done in either Tiles (notes list) or in Note detail.

After you click the three dots, you see:

Let's say you'd like to rename Vacation to Holiday.

Rename / Delete

Rename / Delete

[penge]

@jmaicaaan My Notes 3 have now the tiles as in Google Docs.

Now testing. Soon will open a new issue to join the testing.

[penge]

Closing. Proceeding with testing.