Added Case Studies page in Overview Section #540
Conversation
…son-schema-org#460) * Standardize List Display with Card Component (json-schema-org#433) * Addressed comments, added images, and implemented new styles * Increased padding on the x-axis
|
@TamannaVerma99 Hi reviewed the PR and decided to push some changes to accelerate the process. The only pending thing on your side is to adjust the generic card component to make sure the logos shows properly. I like the logos much bigger with the right proportion bacause some of the logos show deformed. You will need to rebase and fix the conflicts too. What I fixed:
You did an amazing job and we are very very close. |
Thanks :) I will do the required changes asap. |
components/Cardforcasestudies.tsx
Outdated
| <img src={icon} alt={title} className='h-full w-full' /> | ||
| </span> | ||
| )} | ||
| <p className='mt-1 items-center text-[0.9rem] font-bold text-gray-900'> |
There was a problem hiding this comment.
Hey there! Great work on the code! I noticed the title seemed a bit small. Might we consider text-h5 for better readability?
There was a problem hiding this comment.
Hey! Thanks for the feedback .I will work on it. Thanks:)
|
Hi everyone, I'd be happy to adjust the existing card component by adding a conditional statement. This would check the word count and automatically adjust the text size to be larger for shorter content and smaller for longer content. To keep things moving smoothly, I can either open a separate issue for this or jump right in and make the fix here in the PR. Just let me know which approach you prefer! |
But if we keep the title text size variable will it not make the UI inconsistent, if in the same page we have heading with variable length |
You raise a good point about UI consistency. While increasing the base font size slightly could help with longer titles, perhaps a maximum character limit or using ellipsis for overflow could be additional solutions to explore. |
|
Although I don't see any issue with having a separate card component as we have now, this is only a suggestion. |
Hey! Actually I have also been working on welcome page ,for there too I have same issues if my title is even "Getting Started" still its covering two lines so it would be really great if we find any possible solution for it .I think we can also pass title size by props. |
|
This code has been already merged in the dev branch. Awesome work! |
|
|
||
| const CardBody = ({ title, body, icon, link, image }: CardProps) => { | ||
| return ( | ||
| <div className='group relative h-full w-full max-w-lg rounded-lg border border-gray-200 bg-white p-6 px-12 shadow-3xl transition-colors delay-[150ms] ease-in-out hover:bg-slate-100'> |
There was a problem hiding this comment.
@TamannaVerma99 Please add dark:text-black in the div. As in dark mode the text is not visible.
What kind of change does this PR introduce?
Added a new page in Overview section to show the case studies published in the blog. Currently, since I don't have access to the data file that has information related to blogs published, I have created a sample file of my own named
casestudies.jsonwith the same data format as mentioned in the issue and linked it to the card component. This makes the JSON file easily replaceable with the type of data we'll be using.Issue Number:
Does this PR introduce a breaking change?
No