yCanta / yCanta2

yCanta rewrite as an offline first installable website: an intuitive song manager featuring type-to-search presentation mode and PDF songbook export.
https://ycanta.github.io/yCanta2
1 stars 0 forks source link

Presentation progress bar enhancements #78

Closed evanhempel closed 3 years ago

evanhempel commented 3 years ago

In draft mode. I figure we should pick more meaningful colors before merging, as well as test in other browsers (tested in chromium and FF so far). I'm open to any other enhancements you think of ...

carlhemp commented 3 years ago

I didn't know about draft mode before, this is handy.

Nice use of css filter for darkening/lightening the color of the chunks!

I like the colors pretty well, only thing I would change would be to swap bridge and ending chunk colors... Not sure how to pick more meaningful ones.

What would you think of getting rid of the border above/below the progress bar? I think it looks a little cleaner w/o it. The one that shows up is a border for the status bar... which if you remove that, search looks a little funky.

On Chrome, I'm noticing that sometimes the border between chunks isn't showing up well. It was due to the filter effect. One solution would be to make those borders an :after element. As in my commit. I'm not tied to this way of doing it, there's probably a cleaner way to do it.

evanhempel commented 3 years ago

I like your suggestion on colors, so switched the colors on ending and bridge. Same with getting rid of the border (except when searching). For the mark between chunks I tried a different method, using margin to let the background color shine through. If you like it I think this is ready to merge.

carlhemp commented 3 years ago

Looks good to me. Like your fix better for the chunk separators. Less code and elements. Go ahead and do the merge :)