Create FIFA-Inspired Card Designs for Players

[TharunKumarrA]

Problem Statement

The current player representation on the website is functional but lacks visual appeal. To make the interface more engaging and user-friendly, we propose designing FIFA-inspired player cards.

Proposed Solution

• Design visually appealing cards inspired by FIFA's player cards.
• Include player information such as:
  • Name
  • Position
  • Overall Rating (OVR) (optional feature for future implementation)
  • Player Image (for now placeholder img until backend supports image uploads)
• Implement these cards in areas where players are displayed, such as the player database and team view.

Task Details

1. Research FIFA card designs for inspiration.
2. Create a reusable card component using Vue.js.
3. Use dynamic data binding to populate card details from the player database.
4. Add placeholder images and mock data for initial testing.
5. Style the cards with responsive CSS to ensure compatibility across devices.

Acceptance Criteria

• The card design should resemble FIFA's aesthetic while being unique to FC-TeamForge.
• Cards should display player details clearly.
• Cards must be responsive and adapt to different screen sizes.
• Placeholder images should be replaced with uploaded player images once available.

Resources

• FIFA Card Design Examples
• Vue.js Documentation

Priority

Medium

[thecodingvivek]

@TharunKumarrA I have already asked for issue #17. If you don't mind ,I want to contribute to this issue along #17 because i feel it makes easy to me to get control of all ui elements to make them responsive. And also i dont have any problem if there is no bounty for this issue if you can assign it to me. If it’s okay with you, could you please assign this to me as well?

[TharunKumarrA]

If you don't have any other issue then I can assign this too to you

[TharunKumarrA]

A contributor can have only 2 issues at max in hand

[thecodingvivek]

@TharunKumarrA i have no other issues assigned except this one :)

[TharunKumarrA]

Okay you can take up this roo as you are the first. We can still have the bounty no issues

[TharunKumarrA]

But there is some small issue with the backend locally. I will give a fix by eod so you can have players in the frontend

[thecodingvivek]

@TharunKumarrA is that about issue #22 .

[TharunKumarrA]

Can you share the link of the issue. I couldn't find any issue 22 !? @thecodingvivek

[thecodingvivek]

@TharunKumarrA unable to share direct link but try this link " issues/22" at the end of the url "https://github.com/TharunKumarrA/FC-TeamForge/ "

[TharunKumarrA]

ohh yess that was the issue

[thecodingvivek]

@thecodingvivek anna i have gone through code . There is no bug but few steps to be done before starting the server locally .Its working fine with me.I was able to add players and use every other functionality .I will write down the solution under the issue #22 :)

[TharunKumarrA]

Okay da