adisuyash/buy-me-a-coffee

Replace Bootstrap with Tailwind CSS in `index.html`

Open

#1 opened on Oct 5, 2024

View on GitHub
 (7 comments) (0 reactions) (1 assignee)JavaScript (0 forks)auto 404
enhancementgood first issuehacktoberfesthelp wanted

Repository metrics

Stars
 (1 star)
PR merge metrics
 (No merged PRs in 30d)

Description

Description:

Currently, the index.html file is using Bootstrap for styling. The task is to replace all Bootstrap components and styles with Tailwind CSS to ensure a more streamlined and utility-first approach.

Key Points:

  • Remove Bootstrap:

    • Identify and remove all instances of Bootstrap from the index.html file.
    • Bootstrap documentation reference: Bootstrap 5.3 Docs

  • Add Tailwind CSS:

    • Implement Tailwind CSS in place of Bootstrap while maintaining a consistent design and color scheme.
    • Tailwind CSS documentation reference: Tailwind CSS Docs

Steps:

  1. Install and configure Tailwind CSS in the project.
  2. Replace Bootstrap classes with Tailwind CSS equivalents for all components.
  3. Ensure consistent design and colors with a clean and modern UI.

Important Notes:

  • Maintain consistent design patterns to match the current look and feel.
  • For any queries or clarifications, use the #general channel in the Tech Bastic Discord server and tag @adisuyash for assistance.

Contributor guide

Research direction
Identify all Bootstrap classes in index.html and map each to equivalent Tailwind utility classes, ensuring consistent design and color scheme as per the current look and feel.
Tech stack
tailwindcss
Domain
frontend
Issue type
Refactor
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
1
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
Active
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
Clear
Prerequisites
HTMLCSS
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
80