chore: update readme based on feedback

This commit is contained in:
Safwan Samsudeen 2024-12-12 14:47:18 +05:30
parent 3bdc6828c0
commit 4a1e343d67

View File

@ -1,28 +1,20 @@
<div align="center" markdown="1"> <div align="center" markdown="1">
<img src="https://github.com/frappe/design/blob/master/logos/logo-2019/frappe-gantt-logo.png" width="100"> <img src=".github/gantt-logo.png" width="100">
<h1>Frappe Gantt</h1> <h1>Frappe Gantt</h1>
**A modern, configurable, Gantt library for the web. Completely Open Source.** **A modern, configurable, Gantt library for the web.**
![GitHub release (latest)](https://img.shields.io/github/v/release/frappe/gantt) ![GitHub release (latest)](https://img.shields.io/github/v/release/frappe/gantt)
<br/> <br/>
![GitHub stars](https://img.shields.io/github/stars/frappe/gantt)
![GitHub forks](https://img.shields.io/github/forks/frappe/gantt)
</div> </div>
<div align="center"> <div align="center">
<img src=".github/hero-image.png" alt="Hero Image" width="72%" /> <img src=".github/hero_image.png" alt="Hero Image" width="72%" />
</div> </div>
### Install
```
npm install frappe-gantt
```
## About ## About
A Gantt chart is a bar chart that visually illustrates a project's schedule, tasks, and dependencies. With Frappe Gantt, you can easily build beautiful Gantt charts, with extensive levels of configurability. Gantt charts are bar charts that visually illustrate a project's tasks, schedule, and dependencies. With Frappe Gantt, you can build beautiful, customizable, Gantt charts with ease.
You can use it anywhere from hobby projects to tracking the goals of your team at the worksplace. You can use it anywhere from hobby projects to tracking the goals of your team at the worksplace.
@ -30,28 +22,36 @@ You can use it anywhere from hobby projects to tracking the goals of your team a
## Motivation ## Motivation
We at Frappe built Gantt after realizing that although Gantt charts are everywhere, there was no open source implementation. We needed a Gantt View for a project, but surprisingly couldn't find a visually appealing Gantt library that was open source. So we built it!
Today, we pride ourselves on having the most aesthetically pleasing _and_ powerful Gantt library on the market - except it's free! Initially, the design was heavily inspired by Google Gantt and DHTMLX.
Today, we pride ourselves on having the most aesthetically pleasing _and_ powerful Gantt library on the market - except, of course, that it's free.
## Key Features ## Key Features
- A wide variety of modes - be it day, hour, or year, you have it. Or add your own modes! A wide variety of modes - be it day, hour, or year, you have it. Or add your own modes!
- Easily ignore time periods from your tasks' progress calculation - **Customizable Views**: customize the timeline based on various time periods - day, hour, or year, you have it. And if it's not covered, you can create your own!
- An incredible amount of configurability: spacing, edit access, labels, you can control it all. - **Ignore Periods**: exclude weekends and other holidays from your tasks' progress calculation.
- Multi-lingual support - **Configure Anything**: spacing, edit access, labels, you can control it all. Change both the style and functionality to meet your needs.
- Powerful API to integrate Frappe Gantt into your product. - **Multi-lingual Support**: suitable for companies with an international base.
### Usage ### Usage
Install with:
```bash
npm install frappe-gantt
```
Include it in your HTML: Include it in your HTML:
``` ```html
<script src="frappe-gantt.umd.js"></script> <script src="frappe-gantt.umd.js"></script>
<link rel="stylesheet" href="frappe-gantt.css"> <link rel="stylesheet" href="frappe-gantt.css">
``` ```
Or from the CDN: Or from the CDN:
``` ```html
<script src="https://cdn.jsdelivr.net/npm/frappe-gantt/dist/frappe-gantt.umd.js"></script> <script src="https://cdn.jsdelivr.net/npm/frappe-gantt/dist/frappe-gantt.umd.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/frappe-gantt/dist/frappe-gantt.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/frappe-gantt/dist/frappe-gantt.css">
``` ```
@ -77,11 +77,18 @@ To see the list of all options, check out [the docs](docs.frappe.io/gantt) (unde
If you want to contribute enhancements or fixes: If you want to contribute enhancements or fixes:
1. Clone this repo. 1. Clone this repo.
2. `cd` into project directory 2. `cd` into project directory.
3. `pnpm i` 3. Run `pnpm i` to install dependencies.
4. `pnpm run build` - or `pnpm run build-dev` to watch for changes! 4. `pnpm run build` to build files - or `pnpm run build-dev` to build and watch for changes.
5. Open `index.html` in your browser 5. Open `index.html` in your browser.
6. Make your code changes and test them. 6. Make your code changes and test them.
--- <h2></h2>
License: MIT <div align="center" style="padding-top: 0.75rem;">
<a href="https://frappe.io" target="_blank">
<picture>
<source media="(prefers-color-scheme: dark)" srcset="https://frappe.io/files/Frappe-white.png">
<img src="https://frappe.io/files/Frappe-black.png" alt="Frappe Technologies" height="28"/>
</picture>
</a>
</div>