📝 Updates documentation

This commit is contained in:
Bjorn Lammers 2024-04-03 13:06:12 +02:00
parent 55845cde01
commit d2c490a2c1
4 changed files with 66 additions and 54 deletions

View File

@ -5,12 +5,12 @@ assignees: walkxcode
body:
- type: markdown
attributes:
value: "Thank you for your interest in contributing to our icon repository! To ensure that everything runs smoothly, we've set out some guidelines for contributors.\n## 🌟 Icon Specifications\n\n- Each icon should include both a **PNG** and **SVG** version. If an **SVG** cannot be found, then only a **PNG** version is required.\n\n- Each icon should be in **PNG** format and have a height of exactly **512px**. Width does not matter. ❗️(No upscales! If the correct size cannot be found, a smaller height will be accepted.)\n\n- Icons should be named after their full name, using the [Kebab Case](https://wiki.c2.com/?KebabCase) naming convention. For example, \"Facebook Messenger\" should be named `facebook-messenger.png`.\n\n- Monochrome icons should default to a dark version. Light versions should be named `service-light.png`. If a light version is not available, use [https://pinetools.com/colorize-image](https://pinetools.com/colorize-image) to change its color.\n"
value: "Thank you for your interest in contributing to our icon repository! To ensure smooth collaboration, we've established clear guidelines for contributors.\n## 🌟 Icon Specifications\n\n- Icons should be provided in both `PNG` and `SVG` formats. Formats like `JPEG` or `WEBP` will not be accepted.\n - If an `SVG` version is unavailable, a `PNG` version alone suffices.\n - Conversely, if a `PNG` version is missing, it can be generated using [Ezgif SVG to PNG](https://github.com/walkxcode/dashboard-icons/blob/main/CONTRIBUTING.md#-converting-svg-to-png).\n\n- `PNG` files should have a height of exactly `512px` Width can vary, but a 1:1 aspect ratio is preferred.\n - ❗ Exceptions for upscales will be made only if the correct or a downscaled version cannot be obtained.\n - Downsizing can be accomplished using [iLoveIMG Resize](https://github.com/walkxcode/dashboard-icons/blob/main/CONTRIBUTING.md#-downscaling-pngs).\n\n- Icons should be named using the [Kebab Case](https://wiki.c2.com/?KebabCase) convention, reflecting their full name. For instance, \"Facebook Messenger\" should be named `facebook-messenger.png`.\n\n- Monochrome icons should default to a dark version. Light versions should be named `name-light.png`. If a light version is absent, utilize [https://pinetools.com/colorize-image](https://pinetools.com/colorize-image) to adjust its color.\n"
- type: checkboxes
attributes:
label: Contribution Guidelines
options:
- label: I have read and agree to the [Contribution Guidelines](https://github.com/walkxcode/dashboard-icons/blob/main/CONTRIBUTING.md)
- label: I have read and agree to the [Contribution Guidelines](https://github.com/walkxcode/dashboard-icons/blob/main/CONTRIBUTING.md)
required: true
- type: textarea
id: icon-name

View File

@ -1,32 +1,50 @@
# 🎉 Contributing Guidelines
# 🤝 Contribution Guidelines
Thank you for your interest in contributing to our icon repository! To ensure that everything runs smoothly, we've set out some guidelines for contributors.
We appreciate your interest in contributing to our icon repository! To ensure smooth collaboration, kindly adhere to the following guidelines:
## 🌟 Icon Specifications
- Each icon should include both a **PNG** and **SVG** version. If an **SVG** cannot be found, then only a **PNG** version is required.
- Each icon should be in **PNG** format and have a height of exactly **512px**. Width does not matter. ❗️(No upscales! If the correct size cannot be found, a smaller height will be accepted.)
- Icons should be named after their full name, using the [Kebab Case](https://wiki.c2.com/?KebabCase) naming convention. For example, "Facebook Messenger" should be named `facebook-messenger.png`.
- Monochrome icons should default to a dark version. Light versions should be named `service-light.png`. If a light version is not available, use [https://pinetools.com/colorize-image](https://pinetools.com/colorize-image) to change its color.
- Icons should be provided in both `PNG` and `SVG` formats. Other formats like `JPEG` or `WEBP` will not be accepted.
- In cases where an `SVG` version is unavailable, a `PNG` version alone suffices.
- Conversely, if a `PNG` version is missing, it can be generated using [Ezgif SVG to PNG](#-converting-svg-to-png).
- `PNG`s should maintain a height of exactly `512px`, while width can vary. However, a 1:1 aspect ratio is preferred.
- ❗ Avoid upscales! Exceptions will be made only if the correct or a downscaled version cannot be obtained.
- Downsizing can be accomplished using [iLoveIMG Resize](#-downscaling-pngs).
- Icons should be named using the [Kebab Case](https://wiki.c2.com/?KebabCase) convention, reflecting their full name. For instance, "Facebook Messenger" should be named `facebook-messenger.png`.
- Icons that are predominantly monochrome should default to a dark version. Light versions should be named `name-light.png`. If a light version is not available, use [https://pinetools.com/colorize-image](https://pinetools.com/colorize-image) to adjust its color.
## 💻 Gitmoji Commits
- Please use [Gitmoji](https://gitmoji.dev/) in your commit messages. This helps us keep our commit history clear and easy to understand. For example, you might use the `🍱` emoji for a commit that updates an icon's color, or the `📝` emoji for a commit that updates the documentation.
- Use [Gitmoji](https://gitmoji.dev/) in your commit messages. This helps us keep our commit history clear and easy to understand. For instance, use the `🍱` emoji for commits related to updating icon colors, and `📝` for documentation updates.
## 🔀 Converting SVG to PNG
1. Go to https://ezgif.com/svg-to-png.
2. Upload the `SVG` file by clicking "Upload".
3. Set the "Height (optional)" field to `512`, leaving other settings as default.
4. Click "Convert to PNG!".
5. Click "Save" located at the bottom right under the converted image.
## ⤵️ Downscaling PNGs
1. Go to https://www.iloveimg.com/resize-image.
2. Upload the `PNG` file(s).
3. Adjust the "Height (px)" field to `512`, leaving other settings as default.
4. Click "Resize IMAGES".
5. Download the resized icon(s).
## 🤝 Contributing
1. Fork the repository to your own GitHub account.
1. Fork the repository to your GitHub account.
2. Clone the repository to your local machine.
3. Add your icon(s) to the repository, following the specifications listed above.
3. Add your icon(s) to the repository, adhering to the specified guidelines.
4. Push your changes to your fork.
5. Create a pull request in the main repository.
## 🚨 Code of Conduct
Please note that by contributing to this repository, you agree to abide by our code of conduct, which can be found in the [CODE_OF_CONDUCT.md](CODE_OF_CONDUCT.md) file in the repository.
Kindly note that contributing to this repository necessitates adherence to our code of conduct, outlined in the [CODE_OF_CONDUCT.md](CODE_OF_CONDUCT.md) file within the repository.
---
If you have any questions or concerns, please don't hesitate to reach out to me at contact@walkx.fyi. Happy contributing! 🙌
Should you have any queries or concerns, feel free to reach out to me using walkxnl@gmail.com. Happy contributing! 🙌

View File

@ -1,79 +1,73 @@
<p align="center">
<h2 align="center"> 🟣 Dashboard Icons </h3>
<div align="center">
<h2 align="center"> 🚀 Dashboard Icons </h2>
<p align="center">
<a href="https://www.jsdelivr.com/package/gh/walkxcode/dashboard-icons">
<img src="https://img.shields.io/jsdelivr/gh/hy/walkxcode/dashboard-icons?color=%23A020F0" alt="JSdelivr weekly downloads badge">
</a>
</p>
<p align="center">
🚀 The best place to find icons for your dashboards.
The best source for dashboard icons.
<br />
<a href="#-icons"><strong>👀 See the icons</strong></a><a href="https://shop.walkx.fyi/l/donate" target="_blank"><strong>🙌🏻 Donate</strong></a>
<a href="#-icons"><strong>➡️ Explore the icons</strong></a>
<br />
<br />
</p>
</p>
</div>
# 📖 Table of Contents
- [🚀 Getting Started](#-getting-started)
- [📊 Dashboards](#-dashboards)
- [🛠️ Installation](#-installation)
- [🎨 Icons](#-icons)
- [🎉 Contributing Guidelines](#-contributing-guidelines)
- [📜 Legal](#-legal)
- [📖 Table of Contents](#-table-of-contents)
- [🚀 Getting Started](#-getting-started)
- [📊 Dashboards](#-dashboards)
- [✨ Usage](#-usage)
- [🎨 Icons](#-icons)
- [🎉 Contribution Guidelines](#-contribution-guidelines)
- [📜 Legal](#-legal)
## 🚀 Getting Started
### 📊 Dashboards
There are many Dashboards available that you can use with Dashboard Icons. Here are some of the popular ones.
Several dashboards now offer seamless integration with Dashboard Icons. Here are some of the top choices:
- [Homarr](https://github.com/ajnart/homarr)\*
- [Dashy](https://github.com/Lissy93/dashy)\*
- [Homer Dashboard](https://github.com/bastienwirtz/homer)
- [Heimdall](https://github.com/linuxserver/Heimdall)
- [Organizr(v2)](https://github.com/causefx/Organizr)
- [Flame](https://github.com/pawelmalak/flame)
- [SUI](https://github.com/jeroenpardon/sui)
- [Homepage](https://github.com/gethomepage/homepage)\*
- [Homepage](https://github.com/gethomepage/homepage)
- [Homarr](https://github.com/ajnart/homarr)
- [Dashy](https://github.com/Lissy93/dashy)
**Note:** Dashboards with a \* have native integration with Dashboard Icons.
### 🛠️ Installation
**Tip!** You can access Dashboard Icons online, faster, by using `https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/example.png`. Just replace `example` with the name of the icon!
### ✨ Usage
To download an icon from the [icons page](#-icons), simply `Right click > Save link as`.
For non-desktop operating systems or people who prefer to use the terminal:
For non-desktop operating systems or those who prefer using the terminal:
*Replace `example` with the icon's name, and `png` with `svg` if needed.*
```sh
$ curl -O https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/example.png
curl -O https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/example.png
```
or
```sh
$ wget https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/example.png
wget https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/example.png
```
**💡 Tip!** Access Dashboard Icons online faster via `https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/example.png`, replacing `example` with the icon name!
## 🎨 Icons
**⚠️ Warning!** Going to this page will load every single icon in the repository. This might cause:
- 📉 An excessive amount of data use.
**⚠️ Warning!** Visiting this page will load every single icon in the repository. This may cause:
- 📉 Excessive data usage.
- 💻 System slowdowns.
- 🌐 Browser crashes.
*If your device cannot handle loading more than 1000 images, we advise to not go to this page.*
*If your device cannot handle loading more than 1000 images or if you are on a limited data connection, we advise against visiting this page.*
➡️ Click [**here**](ICONS.md) to display all icons.
➡️ Click [**here**](ICONS.md) to view all icons.
## 🎉 Contributing Guidelines
Please read the [Contributing Guidelines](CONTRIBUTING.md) before contributing to this project.
## 🎉 Contribution Guidelines
Please review the [Contribution Guidelines](CONTRIBUTING.md) before contributing to this project.
## 📜 Legal
Please read our [LICENSE](LICENSE) for information regarding the use of our software and assets. By accessing or using this repository, you agree to be bound by the terms and conditions of the license.
If you have any questions or concerns regarding the license, please contact us at contact@walkx.fyi before using or distributing the contents of this repository.
Read our [LICENSE](LICENSE) for information regarding the use of our software and assets. By accessing or using this repository, you agree to be bound by the terms and conditions of the license.
For questions or concerns regarding the license, contact me at walkxnl@gmail.com before using or distributing the contents of this repository.

View File

@ -1,14 +1,14 @@
<p align="center">
<h2 align="center"> 🟣 Dashboard Icons </h3>
<h2 align="center"> 🚀 Dashboard Icons </h3>
<p align="center">
<a href="https://www.jsdelivr.com/package/gh/walkxcode/dashboard-icons">
<img src="https://img.shields.io/jsdelivr/gh/hy/walkxcode/dashboard-icons?color=%23A020F0" alt="JSdelivr weekly downloads badge">
</a>
</p>
<p align="center">
🚀 The best place to find icons for your dashboards.
The best source for dashboard icons.
<br />
<a href="https://github.com/walkxcode/dashboard-icons/"><strong>⬅️ Back to repo</strong></a><a href="https://shop.walkx.fyi/l/donate" target="_blank"><strong>🙌🏻 Donate</strong></a>
<a href="https://github.com/walkxcode/dashboard-icons/"><strong>⬅️ Back to repo</strong></a>
<br />
<br />
</p>