fix(tsc): align Read full profile buttons at bottom of member cards#383
Conversation
Signed-off-by: aashu2006 <akshatp439@gmail.com>
✅ Deploy Preview for hiero-open-source ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
📝 WalkthroughWalkthroughUpdated the TSC page layout so committee member cards use vertical flex layout to pin "Read full profile" buttons to the card bottom; added an initial Changes
Sequence Diagram(s)(omitted — change is layout-only and does not involve multi-component sequential interactions) Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Possibly related PRs
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. 📋 Issue PlannerBuilt with CodeRabbit's Coding Plans for faster development and fewer bugs. View plan used: ✨ Finishing Touches🧪 Generate unit tests (beta)
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 |
✅ Snyk checks have passed. No issues have been found so far.
💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse. |
Up to standards ✅🟢 Issues
|
| Metric | Results |
|---|---|
| Complexity | 0 |
| Duplication | 0 |
TIP This summary will be updated as you push new changes. Give us feedback
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
🧹 Nitpick comments (1)
src/app/tsc/page.tsx (1)
168-239: Consider adding a small regression test for card layout contract.This fix is clean, but since behavior depends on specific class combinations, a lightweight test asserting the card/content/bio wrapper class contract would help prevent future regressions.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/app/tsc/page.tsx` around lines 168 - 239, Add a lightweight regression test that mounts the component rendering the sorted.map list (the card markup in the page.tsx diff) and asserts the layout class contract: verify each article element includes the expected wrapper classes (e.g., rounded-2xl, border-2, bg-white, p-6 sm:p-7), the image or placeholder div has the aspect-square class, the bio paragraph element contains the grow mt-4 text-base text-gray classes, and that when a member has a bio the Read full profile button with id pattern tsc-read-profile-{index} is present (and absent when no bio); use queries by role/text/id and assert className contains the class tokens rather than exact string to avoid brittle spacing differences.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In `@src/app/tsc/page.tsx`:
- Around line 168-239: Add a lightweight regression test that mounts the
component rendering the sorted.map list (the card markup in the page.tsx diff)
and asserts the layout class contract: verify each article element includes the
expected wrapper classes (e.g., rounded-2xl, border-2, bg-white, p-6 sm:p-7),
the image or placeholder div has the aspect-square class, the bio paragraph
element contains the grow mt-4 text-base text-gray classes, and that when a
member has a bio the Read full profile button with id pattern
tsc-read-profile-{index} is present (and absent when no bio); use queries by
role/text/id and assert className contains the class tokens rather than exact
string to avoid brittle spacing differences.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: bcaf5e20-628a-45f3-9036-e6e78a47bc21
📒 Files selected for processing (2)
CHANGELOG.mdsrc/app/tsc/page.tsx
|
Hi @exploreriii, I’ve done the alignment fix using flex column pattern as suggested. One thing I noticed that the "Read full profile" button now like stretches to full width due to the flex layout, should we keep it this way, or match the previous compact button style? Happy to adjust based on your preference. |
Hi @aashu2006, What do you think of centering the text? |
|
@aceppaluni That sounds good to me 👍 |
|
@aashu2006 Sounds good, will keep an eye out for your update. Thank you! |
Signed-off-by: aashu2006 <akshatp439@gmail.com>
|
@aceppaluni updated! |
aceppaluni
left a comment
aceppaluni
left a comment
There was a problem hiding this comment.
@aashu2006 Great work!!
3 participants
Description
Fixes inconsistent alignment of the "Read full profile" buttons on the TSC page by applying a flex column layout to member cards, ensuring buttons stay pinned to the bottom regardless of bio length.
Changes Made
flex flex-colto TSC member card container (<article>)flex flex-1 flex-colgrowto bio paragraph to push button to bottomRelated Issues
Fixes #380
Screenshots
Before:
Buttons appeared at inconsistent vertical positions across cards due to varying bio lengths.
After
Buttons are consistently aligned at the bottom of each card using a flex column layout.
Checklist
Summary by CodeRabbit