TACC / tup-ui

React client for TACC User Portal
2 stars 0 forks source link

fix: tup-615 inconsistent header spacing - left & vertical #339

Closed wesleyboar closed 9 months ago

wesleyboar commented 10 months ago

Overview

Make header spacing consistent.

Related

Changes

Testing

  1. Open all sections.
  2. Verify all header text has the same space before and above.
  3. Verify, in Dashboard section, on large window (or with small text):
    • no excess space above "Dashboard" header text
    • no excess space between "Active Projects" and "My Tickets" table

UI

dashboard proj alloc project
tickets system account
dashboard layout
dashboard - full

The cut-off System Status "Running Jobs" is caused by #312, not this.

wesleyboar commented 9 months ago

I tested two fixes to the problem you found.

On the Grid:

.project-ticket-grid {
    ...
    grid-template-rows: minmax(auto, 200px) 1fr; /* instead of auto 1fr */
    ...
}

On the Grid Item:

.project-ticket-grid:nth-child(1) {
    ...
    max-height: 200px;
}
wesleyboar commented 9 months ago

New fix (slimmer and clearer I think) for narrow and wide screen (2689615).

https://github.com/TACC/tup-ui/assets/62723358/52a38bbb-44bf-4e47-bb27-c9fed4b5393d

R-Tomas-Gonzalez commented 9 months ago

Note:

All look good to me

wesleyboar commented 9 months ago

Hm, thanks @R-Tomas-Gonzalez for https://github.com/TACC/tup-ui/pull/339#pullrequestreview-1730311908.

I did not pay attention to the right side of the headers…

I'll check this, and how #335 interacts with it.

wesleyboar commented 9 months ago

@R-Tomas-Gonzalez What do you think consistent space on the right being handled in a new ticket instead of this one?

My reasoning… - original ticket was focused on left and vertical - this PR seems to be a valid fix for left and vertical - i think it may be easier to tackle right-hand side in isolation - i think it will be easier to tackle right-hand side after merges of existing PRs
R-Tomas-Gonzalez commented 9 months ago

@R-Tomas-Gonzalez What do you think consistent space on the right being handled in a new ticket instead of this one?

My reasoning…

  • original ticket was focused on left and vertical
  • this PR seems to be a valid fix for left and vertical
  • i think it may be easier to tackle right-hand side in isolation
  • i think it will be easier to tackle right-hand side after merges of existing PRs

I agree. 👍 :)

R-Tomas-Gonzalez commented 9 months ago

Will approve when conflicts are resolved.

wesleyboar commented 9 months ago

New ticket.

TUP-651: Consistent Spacing on Right for Section Headers

wesleyboar commented 9 months ago

Warning Do not merge. Diff has accidental merge of CSS migration via 0e222ee.

wesleyboar commented 9 months ago

Important Safe to merge. Problem resolved. I reverted 0e222ee via f6b7bd5. Retested. Re-reviewed diff.