search

aaronpk / Monocle

Monocle is a reader app that talks to a Microsub server
https://monocle.p3k.io
MIT License
49 stars 8 forks source link

add "mark all as read" button #12

Closed aaronpk closed 5 years ago

aaronpk commented 6 years ago

for those times when you want to declare channel bankruptcy

RosemaryOrchard commented 5 years ago

Suggestion: it should be in the top right of the title bar on desktop, and be a drop down of the channel title on mobile.

mcleodchris commented 5 years ago

I've just got a basic version of "mark all as read" working in my local development copy. Once I've got the UI bit looking and working nice (particularly for mobile) I will submit a PR for your review 🙂

Do we want to have a confirmation alert before actually marking everything as read?

RosemaryOrchard commented 5 years ago

I would be very much in favour of a confirmation button, otherwise one accidental click and you have no idea where you are :)

aaronpk commented 5 years ago

That's awesome!

In general I'm not a fan of confirmation dialogs. I would rather the button be hidden behind a menu first, but then clicking it takes the action immediately. That still provides protection against accidentally clicking it, but avoids the annoyance of a popup.

mcleodchris commented 5 years ago

I've currently got this for desktop and above:

Screenshot_20190520_100939

At smaller resolutions, I've gone for @RosemaryOrchard's suggestion of a combo title + dropdown:

Screenshot_20190520_100844

I'm having some trouble with iOS continuing to display the combo title as a button, complete with border and regular text size, despite my additional CSS. I'm not sure if that's an issue with how I'm overriding Bulma (I've never used it before now), a caching issue, or a quirk of iOS. There's also some issues with top-bar layout on iPad in landscape. I'll work on it a bit more.

Screenshot 2019-05-20 at 10 26 33

I haven't got an Android device to hand at the moment, so haven't been able to test there. If anyone wants to play around with the feature, you can try it out on my live instance: https://read.mrkapowski.com/.

mcleodchris commented 5 years ago

It turns out the iOS issues were caused by aggressive caching directives sent by my server, meaning the updated CSS wasn't loaded. I've since deleted the device cache and retested successfully.