derangedmind / gotnotes Goto Github PK

When the screen is too small the nav bar menu items do not scale properly. Instead, they piggy back each other. At larger sizes, the buttons seem stale and overly solid.

Not feeling the single note column. It seems like a pain in the ass to scroll one by one.

I'm really liking a 2 column grid. This allows for 4 full note icons to be viewable at a time. It looks way sexier! :-)

Note list is only centring when there are two columns. This is because the <aside> width is a percentage of the window width at this time. All other column widths do not properly centre.

... super tired right now and don't feel like this issue makes sense

Not sure what kind of organization I would prefer for media queries.

The two options are separate all of the CSS according to screen size or organize according to the specific section of the page.

I prefer the latter because it is much cleaner and much more organized. If I need to look at something on the nav bar, I can go straight to the entire section on nav bars. However, this creates several more media queries.

The former would only create 4 media queries (four different columns...).

The best solution would probably be to optimize to only need 2 media queries (mobile and desktop). Hmmm... I think I will clean up the mobile a bit and then come back to optimizing media queries according for larger screens.

Flexboxes will help to keep the page more organized and more grid-like.

The blocks are coming together, but there's nothing more than that! Going to need more things to actually look at on the page.

Ideas that come to mind:

• <aside> note information
• Note information in grid
• Social Media icons (?)