-
-
Notifications
You must be signed in to change notification settings - Fork 996
style: improve styling of Goal divs in Roadmap page (#4543) #4545
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: master
Are you sure you want to change the base?
style: improve styling of Goal divs in Roadmap page (#4543) #4545
Conversation
✅ Deploy Preview for asyncapi-website ready!Built without sensitive environment variables
To edit notification comments on pull requests, go to your Netlify project configuration. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Welcome to AsyncAPI. Thanks a lot for creating your first pull request. Please check out our contributors guide useful for opening a pull request.
Keep in mind there are also other channels you can use to interact with AsyncAPI community. For more details check out this issue.
WalkthroughReplaced three plain container divs in the Roadmap grid with styled divs, adding Tailwind utility classes for background, border, rounding, padding, shadow, flex layout, and responsive height. No logic, data flow, or conditional behavior changed. Changes
Estimated code review effort🎯 1 (Trivial) | ⏱️ ~3 minutes
Suggested labels
Suggested reviewers
Poem
Pre-merge checks and finishing touches❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ 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 |
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## master #4545 +/- ##
=========================================
Coverage 100.00% 100.00%
=========================================
Files 22 22
Lines 780 780
Branches 144 144
=========================================
Hits 780 780 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
|
⚡️ Lighthouse report for the changes in this PR:
Lighthouse ran on https://deploy-preview-4545--asyncapi-website.netlify.app/ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (1)
pages/roadmap.tsx (1)
524-524: LGTM! Styling improvements look good.The added Tailwind classes successfully create consistent card-based styling for all three Goal divs. The styling includes appropriate background, borders with dark mode support, rounded corners, padding, shadows, and flexbox layout.
Minor formatting note: Line 524 has a double space between
bg-whiteandborder, while lines 552 and 575 have single spaces. Consider normalizing to single spaces for consistency.Apply this diff to fix the spacing on line 524:
- <div className='bg-white border border-gray-100 dark:border-gray-400 rounded-lg p-6 shadow-sm flex flex-col justify-start lg:h-full'> + <div className='bg-white border border-gray-100 dark:border-gray-400 rounded-lg p-6 shadow-sm flex flex-col justify-start lg:h-full'>Also applies to: 552-552, 575-575
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
pages/roadmap.tsx(3 hunks)
🧰 Additional context used
🧠 Learnings (1)
📓 Common learnings
Learnt from: asyncapi-bot
Repo: asyncapi/website PR: 0
File: :0-0
Timestamp: 2025-02-18T12:07:42.211Z
Learning: The following PR commands are supported in the asyncapi/website repository:
- `/please-take-a-look` or `/ptal`: Requests attention from reviewers who haven't reviewed the PR
- `/ready-to-merge` or `/rtm`: Triggers automerge when all conditions are met
- `/do-not-merge` or `/dnm`: Blocks automerge even if all conditions are met
- `/autoupdate` or `/au`: Adds autoupdate label to keep PR in sync with target branch
- `/update` or `/u`: One-time update of PR with latest changes from target branch
⏰ Context from checks skipped due to timeout of 180000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)
- GitHub Check: Lighthouse CI
- GitHub Check: Test NodeJS PR - windows-latest
- GitHub Check: Test NodeJS PR - macos-13
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (1)
pages/roadmap.tsx (1)
524-524: Fix double space in className strings.There's a double space after
bg-whitein all three Goal divs. While this doesn't affect functionality, it should be cleaned up for consistency.Apply this diff to remove the extra space:
- <div className='bg-white border border-gray-200 rounded-lg shadow-md p-6 flex flex-col justify-start lg:h-full'> + <div className='bg-white border border-gray-200 rounded-lg shadow-md p-6 flex flex-col justify-start lg:h-full'>Apply the same fix to lines 552 and 575.
Also applies to: 552-552, 575-575
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
pages/roadmap.tsx(3 hunks)
⏰ Context from checks skipped due to timeout of 180000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: Test NodeJS PR - windows-latest
🔇 Additional comments (1)
pages/roadmap.tsx (1)
524-551: LGTM! Nice styling improvements.The added Tailwind classes create a clean card-style appearance for the Goal divs. The styling is consistent across all three cards, and the responsive design with
lg:h-fullensures equal heights on larger screens for a polished look.Also applies to: 552-574, 575-598
Fixes #4543
Summary by CodeRabbit