RecursiveThinking / recursive_thinking_website

Recursive Thinking Website
5 stars 2 forks source link

UI / Page Cards - Perhaps implement parameters to limit difference between cards? #56

Closed sethborne closed 6 years ago

sethborne commented 6 years ago

with a page like vote for lessons, there can be a visual discrepancy (horizontal bottom) between different cards.

should we start limiting things like description, where description gets a scroll, after a certain vertical size, in order to make more unified cards? Or do we just make more white at the short card bottoms?

sethborne commented 6 years ago

cards

MynockSpit commented 6 years ago

Great idea! Some thoughts: If we limit the height, we'll have to hide some of the longer text. If we do that, what do we do with the rest? (Show a modal on click?) If we max the max the height, what parts of the smaller cars expand (i.e. where does the whitespace go)?

sethborne commented 6 years ago

These are all great questions!

Given a "fixed" situation, I'd only recommend fixing the description - and I would do that with a max-height, and a scroll bar to see the rest. While the cards might not "be the same" they could be more consistent. Because in this situation, the only two things that (I see) could get long are the Title, and the description. (Unless 6 people start teaching lessons?) :)

I'm not experienced enough with modals to know if that is the correct solution, but it seems like a modal is perhaps the same problem because it may/may not have a limit? So unless you scoped the modal display (for description) with a height limit I'm not sure it helps?

So I would start with an Occams Razor approach and just give a max-height to the description.

MynockSpit commented 6 years ago

What happens when you set a max-height and something has a smaller height?

sethborne commented 6 years ago

If I'm getting the question correct here - the case would be what if there is a max height on the description, but the description is really short? In this case, the short text would render but the overall card would be shorter (which doesn't help the visual problem. Although, I believe you could get consistency in the description block by doing a min-height and max-height of the same value. that would allow longer descriptions to get a scrollbar and short descriptions to get white space to the point there the height is equal to the "longer" block

MynockSpit commented 6 years ago

Sounds good to me.

sethborne commented 6 years ago

commit 5532a9fd fixes this