Skip to content
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

[Sistent] Add Card component to the sistent components page #5908

Open
dragon-slayer875 opened this issue Sep 23, 2024 · 7 comments · May be fixed by #6117
Open

[Sistent] Add Card component to the sistent components page #5908

dragon-slayer875 opened this issue Sep 23, 2024 · 7 comments · May be fixed by #6117
Labels
framework/gatsby Gatsby related hacktoberfest Happy contributing! help wanted Extra attention is needed kind/enhancement New feature or request language/javascript Issues or pull requests that use Javascript or React language/markdown Issues or pull requests that use Markdown project/sistent

Comments

@dragon-slayer875
Copy link

dragon-slayer875 commented Sep 23, 2024

Current Behavior

Layer5 and it's projects use Sistent library to enable easy component reusability among our various projects.
One such component is Card.

(https://playground.meshery.io/user/preferences)
image

Ideally, all sistent components are represented on https://layer5.io/projects/sistent/components, so a centralized usage and example documentation can be maintained. This will aid new developers to more quickly jump into contributing to the various projects.
The Card component currently needs this representation.

Desired Behavior

Proper documentation for Card component similar to Button component on https://layer5.io/projects/sistent/components
The documentation should include:

  • Explanation of the the function that the component serves in context of it's usage.
  • Usage and information of accompanying utility components:
    • CardActions
    • CardContent
    • CardHeader
    • CardMedia
  • Code examples.
  • Stylistic guidelines to be followed while using the component in code (if any).

Contributor Resources and Handbook

The layer5.io website uses Gatsby, React, and GitHub Pages. Site content is found under the master branch.

Join the Layer5 Community by submitting your community member form.

@dragon-slayer875 dragon-slayer875 added kind/enhancement New feature or request hacktoberfest Happy contributing! language/javascript Issues or pull requests that use Javascript or React language/markdown Issues or pull requests that use Markdown framework/gatsby Gatsby related project/sistent labels Sep 23, 2024
@dragon-slayer875 dragon-slayer875 added the help wanted Extra attention is needed label Sep 30, 2024
@Anand-Theertha
Copy link
Contributor

I can work on this! 🙋

@Anand-Theertha
Copy link
Contributor

Anand-Theertha commented Oct 24, 2024

Quick question: Where can I find the content that describes about the component and its utility components? @dragon-slayer875 @leecalcote

@leecalcote
Copy link
Member

@nebula-aac @sudhanshutech @SAHU-01 @NishantSinghhhhh can assist.

@NishantSinghhhhh
Copy link
Contributor

Yes sir I am ready to work on this component

@Anand-Theertha
Copy link
Contributor

Anand-Theertha commented Oct 25, 2024

Hey @NishantSinghhhhh, I am currently working on this task. I just wanted some clarification on what information I need to put to describe the Card component.

@NishantSinghhhhh
Copy link
Contributor

NishantSinghhhhh commented Oct 25, 2024

Hey @NishantSinghhhhh, I am currently working on this task. I just wanted some clarification on what information I need to put to describe the Card component.

See when you go on the components page of sistent project, there are lot many components listed in there like button, modal etc , just click on the component and then you will see how it each component is described.

You have to write about the types of cards their use cases , and explain the utility functions that are attached with the card , along with this provided some guidance to the developers as in where to use card and what UI-UX themes are required in the guidance tab and then in code.js you have to present the code for all the components that you have rendered

@Anand-Theertha
Copy link
Contributor

Awesome, got it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
framework/gatsby Gatsby related hacktoberfest Happy contributing! help wanted Extra attention is needed kind/enhancement New feature or request language/javascript Issues or pull requests that use Javascript or React language/markdown Issues or pull requests that use Markdown project/sistent
Development

Successfully merging a pull request may close this issue.

4 participants