epic-power-rpg / roll20

Apache License 2.0
0 stars 0 forks source link

Convert basic tab to grid layout #42

Closed jazeee closed 1 year ago

jazeee commented 1 year ago

Adjust to use full width, and display grid. Moved Character attributes to a grid table.

Screenies

Old new
image image
johnlamping commented 1 year ago

I think the number of advantages field and the CP fields should be fixed width, since their content is fixed size. Having them stretch seems like a confusion. Also, I think the epic feat name field should be right justified, like the others (and like it used to be).

If you feel like it, it also looks like I screwed up with the CP cost input of the user filled in advantages and disadvantages, like "Fear of everything". Currently, its input field holds the CP cost, while the other inputs in the same column hold the multiplicity of the feat, not the cost. I think it would be better if the CP column held the CP input field (with blue and bold text, like other CP), and the name field stretched to cover where the CP input field now is. This might be better as a task for me, because it probably also requires messing with the total CP cost computation. But I'm not going to be doing much with the character sheet for at least another month, though, as I'm going to be busy working on my upcoming arc.

On Sun, Jan 1, 2023 at 6:14 PM Jaz @.***> wrote:

@jazeee https://github.com/jazeee requested your review on: #42 https://github.com/epic-power-rpg/roll20/pull/42 Convert basic tab to grid layout.

— Reply to this email directly, view it on GitHub https://github.com/epic-power-rpg/roll20/pull/42#event-8135147881, or unsubscribe https://github.com/notifications/unsubscribe-auth/ACTV55RCJXMHIINO33JUVS3WQI2XPANCNFSM6AAAAAATOOERVA . You are receiving this because your review was requested.Message ID: @.***>

jazeee commented 1 year ago

I think the number of advantages field and the CP fields should be fixed width, since their content is fixed size. Having them stretch seems like a confusion. Also, I think the epic feat name field should be right justified, like the others (and like it used to be).

Agreed. I made some style adjustments. I moved the top row with race, gender, etc, and move that to a table on the left as well... image

See second commit and third commit

jazeee commented 1 year ago

Moved the calculation issue to #43

jazeee commented 1 year ago

That looks so much better! Is there a limit to how much things expand horizontally? They are using more room than before, but not all of the available space.

We can set the max-width of the container to do this. It is pretty simple to do. Alternatively, or in conjunction, we can set the column widths as desired.

I think this is something we'll want to tweak as we decide what makes sense for the columns and tables. It was a bit of futzing to decide on the current widths.

jazeee commented 1 year ago

That looks so much better! Is there a limit to how much things expand horizontally? They are using more room than before, but not all of the available space.

We can set the max-width of the container to do this. It is pretty simple to do. Alternatively, or in conjunction, we can set the column widths as desired.

I think this is something we'll want to tweak as we decide what makes sense for the columns and tables. It was a bit of futzing to decide on the current widths.

Oh, also, the reason why it isn't using all the available space is because all columns are currently set to fixed pixel width. We can use all width if we want, by a combination of two things:

  1. Set the allocation of flex-basis to each of the three sections
  2. Set column(s) to 1fr, to use up the remaining available space.

This should work, but I haven't tried...