AYS-333 | Responsive Layout Adjustment and Code Refactor for DRY Principle

[NNakreSS]

Checklist

Before submitting your pull request, ensure the following:

• Change Type:

• Bug fix

• Feature addition

• Documentation update

• Performance improvement

• Other (please specify)

• Summary:

  • Responsive Layout Adjustment and Code Refactor for DRY Principle.

• Title and Branch Naming Conventions:

  • The pull request title follows the
    standard: Pull Request Naming Conventions.
  • The branch name follows one of the conventions outlined in
    the Branch Naming Conventions.

• Local Testing:

  • I have tested my changes locally on my browser, and they are working as expected.

• Code Quality:

  • The code is formatted according to the project's coding guidelines and style.
  • The code has been reviewed to ensure its quality.
  • The code does not contain any issues flagged by ESLint.

• Documentation:

  • Necessary documentation has been added or existing documentation has been updated.

• Reviewers and Assignees:

  • Default reviewers have been assigned to this pull request.
  • Assignees have been added if necessary.

• Related Issue:

  • Closes #AYS-345 (If there is a relevant issue)

• Labels and Associations:

  • No specific actions are required in the Labels and Associations section for this pull request.