Skip to content

Latest commit

 

History

History
97 lines (75 loc) · 2.52 KB

readme.md

File metadata and controls

97 lines (75 loc) · 2.52 KB

Modern Task Management Application

A sleek and intuitive task management application built with HTML, CSS, and JavaScript. This application allows users to create, manage, and collaborate on tasks with a modern user interface and smooth animations.

Features

Task Management

  • Create tasks with titles and descriptions
  • Set priority levels (Low, Medium, High)
  • Mark tasks as complete
  • Delete tasks
  • Filter tasks (All, Active, Completed)

Collaboration

  • Add multiple collaborators to tasks
  • Support for comma-separated collaborator names
  • Visual representation of collaborators with initials
  • Collaborator count display on task cards

Priority System

  • Color-coded priority levels
    • Low Priority (Green)
    • Medium Priority (Yellow)
    • High Priority (Red)
  • Visual indicators on task cards

User Interface

  • Clean and modern design
  • Smooth animations and transitions
  • Responsive layout for all devices
  • Intuitive task creation flow

File Structure

project/ ├── index.html ├── css/ │ ├── style.css │ ├── responsive.css │ └── animations.css ├── js/ │ ├── main.js │ ├── tasks.js │ └── calendar.js └── assets/ └── [image files]

Setup Instructions

  1. Clone the repository
  2. Open index.html in your web browser
  3. Start managing your tasks!

Usage

Creating a Task

  1. Enter task title in the main input field
  2. Add a description (optional)
  3. Select priority level
  4. Add collaborators (separate multiple names with commas)
  5. Click "Create Task"

Managing Tasks

  • Click the checkbox to mark a task as complete
  • Use the filter buttons to view different task categories
  • Click the delete button (×) to remove a task

Collaborators

  • Add multiple collaborators using commas
  • View collaborator count on task cards
  • Hover over collaborator circles to see full names

Local Storage

  • Tasks are automatically saved to local storage
  • Data persists between browser sessions

Browser Support

  • Chrome (latest)
  • Firefox (latest)
  • Safari (latest)
  • Edge (latest)

Dependencies

  • No external libraries required
  • Pure HTML, CSS, and JavaScript implementation

Contributing

Feel free to submit issues and enhancement requests!

License

This project is licensed under the MIT License - see the LICENSE file for details.

Acknowledgments

  • Design inspired by modern UI/UX principles
  • Color scheme based on material design guidelines