add CSS Methodology

[rahulch07]

What kind of change does this PR introduce?

This PR suggests a CSS Methodology to be followed accross all components/screens

Issue Number:

Fixes #959

Did you add tests for your changes?

Yes

Snapshots/Videos:

SearchBar

Modal

Tabs and Table

If relevant, did you update the documentation?
Yes

Summary

Since all CSS files are being merged into a single global stylesheet, identifying common elements like modals, tables, and tabs and creating reusable CSS classes is important. The goal is to ensure consistency across all components and screens by defining a structured CSS methodology.

Other information

Have you read the contributing guide?

[github-actions]

Our Pull Request Approval Process

We have these basic policies to make the approval process smoother for our volunteer team.

Testing Your Code

Please make sure your code passes all tests and there are no merge conflicts.

The process helps maintain accurate and well-formatted documentation and is a prerequisite for getting your PR approved. Assigned reviewers regularly review the PR queue and tend to focus on PRs that are passing.

Reviewers

When your PR has been assigned reviewers contact them to get your code reviewed and approved via:

1. comments in this PR or
2. our slack channel

Reviewing Your Code

Your reviewer(s) will have the following roles:

1. arbitrators of future discussions with other contributors about the validity of your changes
2. point of contact for evaluating the validity of your work
3. person who verifies matching issues by others that should be closed.
4. person who gives general guidance in fixing your tests

CONTRIBUTING.md

Read our CONTRIBUTING.md file. Most importantly:

1. PRs with issues not assigned to you will be closed by the reviewer
2. Fix the first comment in the PR so that each issue listed automatically closes

Other

1. 🎯 Please be considerate of our volunteers' time. Contacting the person who assigned the reviewers is not advised unless they ask for your input. Do not @ the person who did the assignment otherwise.

[github-actions]

Congratulations on making your first PR! 🎊 If you haven't already, check out our Contributing Guidelines and PR Reporting Guidelines to ensure that you are following our guidelines for contributing and creating PR.

[palisadoes]

1. This is good
2. Please put the images in new static/img/markdown/ui-ux directory for consistency

[rahulch07]

1. This is good
2. Please put the images in new static/img/markdown/ui-ux directory for consistency

Thanks!
To ensure consistency, I’d be happy to help review any frontend PRs and check if the methodology is being followed. Please feel free to tag me if needed!