WEB-1107: Fix Charges table alignment in Loan Account Preview step - #3799
Open
Farah-Nahle-FOO wants to merge 1 commit into
Open
WEB-1107: Fix Charges table alignment in Loan Account Preview step#3799Farah-Nahle-FOO wants to merge 1 commit into
Farah-Nahle-FOO wants to merge 1 commit into
Conversation
The Charges table header had a stray flex-fill class applied to the <table> element, forcing display:flex on it. This broke the shared table layout algorithm, causing each row to compute its own column widths independently so header and data cells no longer lined up.
|
Note
|
| Layer / File(s) | Summary |
|---|---|
Charges table container class update src/app/loans/loans-account-stepper/loans-account-preview-step/loans-account-preview-step.component.html |
The charges table container no longer uses flex-fill. The existing material elevation, table structure, and rendering stay unchanged. |
Estimated code review effort: 1 (Trivial) | ~2 minutes
Suggested reviewers: alberto-art3ch
🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
| Check name | Status | Explanation |
|---|---|---|
| Docstring Coverage | ✅ Passed | No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. |
| Linked Issues check | ✅ Passed | Check skipped because no linked issues were found for this pull request. |
| Out of Scope Changes check | ✅ Passed | Check skipped because no linked issues were found for this pull request. |
| Description Check | ✅ Passed | Check skipped - CodeRabbit’s high-level summary is enabled. |
| Title check | ✅ Passed | The title clearly identifies the alignment fix for the Charges table in the Loan Account Preview step. |
✨ Finishing Touches
🧪 Generate unit tests (beta)
- Create PR with unit tests
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.
Comment @coderabbitai help to get the list of available commands.
IOhacker
approved these changes
Aug 7, 2026
Contributor
|
@Farah-Nahle-FOO please rebase and let me know |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
The Charges table in the Loan Account Preview step was displaying header and data columns out of alignment, making it hard to tell which name, type, amount, collection timing, and date belonged to each charge.
The
<table>element had a strayflex-fillclass applied to it, forcingdisplay: flexon the table itself. This broke the shared table layout algorithm that keeps column widths consistent across the header row and data rows, so each row ended up computing its own column widths independently and the cells no longer lined up under their headers.Removed the
flex-fillclass from the table; full width is already handled by the existingtable { width: 100%; }global style, so no other changes were needed.Related issues and discussion
WEB-1107
Screenshots, if any
Checklist
Please make sure these boxes are checked before submitting your pull request - thanks!
If you have multiple commits please combine them into one commit by squashing them.
Read and understood the contribution guidelines at
web-app/.github/CONTRIBUTING.md.Summary by CodeRabbit