mirror of
https://github.com/walkxcode/dashboard-icons.git
synced 2024-11-23 11:49:15 +01:00
📝 Updates documentation
This commit is contained in:
Bjorn Lammers
parent
55845cde01
commit
d2c490a2c1
4 changed files with 66 additions and 54 deletions
2
.github/ISSUE_TEMPLATE/request_suggest.yml
vendored
2
.github/ISSUE_TEMPLATE/request_suggest.yml
vendored
|
|
@ -5,7 +5,7 @@ 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
|
||||
|
|
|
|||
|
|
@ -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! 🙌
|
||||
|
|
|
|||
60
README.md
60
README.md
|
|
@ -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
|
||||
|
||||
- [📖 Table of Contents](#-table-of-contents)
|
||||
- [🚀 Getting Started](#-getting-started)
|
||||
- [📊 Dashboards](#-dashboards)
|
||||
- [🛠️ Installation](#️-installation)
|
||||
- [✨ Usage](#-usage)
|
||||
- [🎨 Icons](#-icons)
|
||||
- [🎉 Contributing Guidelines](#-contributing-guidelines)
|
||||
- [🎉 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.
|
||||
|
|
@ -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>
|
||||
|
|
|
|||
Loading…
Reference in a new issue