ToDo review

[sibertius]

Back in 2021 I had one thread and this thread about navigation and what I have learned is called “master - detail”.

I got several good inputs through the years in this journey. Most of them is implemented now in this rough draw. This is basically the same design (or lack of) as before.

goTask3

To achieve my goals I have worked with three ways to populate the site. Direct from server (SSR). Partly SSR and rest built by Javascript and finally I discovered a way (SSR into innerHTML) that reduce flickering.

Again I should appreciate some inputs regarding every piece of this. From UX to coding. Do not hold back. I am still learning.

TIA!

[PaulOB]

I’m only on a mobile at the moment but it seems to work well.

I did notice one odd thing on that when you have clicked ‘edit’ the menu can still be toggled but slides under the content. That behaviour is a little weird.

[sibertius]

@PaulOB

I did notice one odd thing on that when you have clicked ‘edit’ the menu can still be toggled but slides under the content.

Yes. I will put an overlay that makes this impossible. Thanks for reminding me.

Nothing else you should do different?

[PaulOB]

I’m only on a mobile at the moment so can’t comment on the code but it all seems to work well but did notice another small bug.

The menu in landscape on mobile is inaccessible because it goes below the fold and won’t scroll. You probably need a min-height of 100vh and overflow:auto so you can scroll it into view.

[sibertius]

@PaulOB

The menu in landscape on mobile is inaccessible because it goes below the fold and won’t scroll. You probably need a min-height of 100vh and overflow:auto so you can scroll it into view.

Thanks for the feedback. I think I have fixed this issues in https://task3.go4webdev.org/tsk

[PaulOB]

@sibertius

I think I have fixed this issues in https://task3.go4webdev.org/tsk

Hmmm when I go from portrait to landscape on the iPhone I lose the top bar. I don’t think that happened before.

It doesn’t happen all the time either!

[PaulOB]

Maybe it was a cache issue as it’s started working now but the original problem is still there.

[sibertius]

@PaulOB

Maybe it was a cache issue as it’s started working now but the original problem is still there

I cannot reproduce this. But the window refreshes, so I had another problem with the popup window that is solved. https://www.screencast.com/t/Ba4btmMJ9

By adding class “open” after orientationchange

window.addEventListener('orientationchange', function() {
  if (desk.classList.contains('open')) {
    window.requestAnimationFrame(function() {
      setTimeout(function() {
        desk.classList.remove('close')
        desk.classList.add('open')
      }, 50)
    })
  }
});

Or is there a better way to do this?