mirror/dashboard-icons
1
0
Fork 0
mirror of https://github.com/walkxcode/dashboard-icons.git synced 2024-11-10 07:27:21 +01:00
Code Issues Packages Projects Releases Wiki Activity

📝 Updates documentation

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.github/ISSUE_TEMPLATE/request_suggest.yml vendored
View File

@ -5,7 +5,7 @@ assignees: walkxcode
body: body:
- type: markdown - type: markdown
attributes: 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 - type: checkboxes
attributes: attributes:
label: Contribution Guidelines label: Contribution Guidelines

42
CONTRIBUTING.md
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 ## 🌟 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. - Icons should be provided in both `PNG` and `SVG` formats. Other formats like `JPEG` or `WEBP` will not be accepted.
- 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.) - In cases where an `SVG` version is unavailable, a `PNG` version alone suffices.
- 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`. - Conversely, if a `PNG` version is missing, it can be generated using [Ezgif SVG to PNG](#-converting-svg-to-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. - `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 ## 💻 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 ## 🤝 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. 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. 4. Push your changes to your fork.
5. Create a pull request in the main repository. 5. Create a pull request in the main repository.
## 🚨 Code of Conduct ## 🚨 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! 🙌

66
README.md
View File

@ -1,79 +1,73 @@
<p align="center"> <div align="center">
<h2 align="center"> 🟣 Dashboard Icons </h3> <h2 align="center"> 🚀 Dashboard Icons </h2>
<p align="center"> <p align="center">
<a href="https://www.jsdelivr.com/package/gh/walkxcode/dashboard-icons"> <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"> <img src="https://img.shields.io/jsdelivr/gh/hy/walkxcode/dashboard-icons?color=%23A020F0" alt="JSdelivr weekly downloads badge">
</a> </a>
</p> </p>
<p align="center"> <p align="center">
🚀 The best place to find icons for your dashboards. The best source for dashboard icons.
<br /> <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 />
<br /> <br />
</p> </p>
</p> </div>
# 📖 Table of Contents # 📖 Table of Contents
- [🚀 Getting Started](#-getting-started) - [📖 Table of Contents](#-table-of-contents)
- [🚀 Getting Started](#-getting-started)
- [📊 Dashboards](#-dashboards) - [📊 Dashboards](#-dashboards)
- [🛠️ Installation](#️-installation) - [✨ Usage](#-usage)
- [🎨 Icons](#-icons) - [🎨 Icons](#-icons)
- [🎉 Contributing Guidelines](#-contributing-guidelines) - [🎉 Contribution Guidelines](#-contribution-guidelines)
- [📜 Legal](#-legal) - [📜 Legal](#-legal)
## 🚀 Getting Started ## 🚀 Getting Started
### 📊 Dashboards ### 📊 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)\* - [Homepage](https://github.com/gethomepage/homepage)
- [Dashy](https://github.com/Lissy93/dashy)\* - [Homarr](https://github.com/ajnart/homarr)
- [Homer Dashboard](https://github.com/bastienwirtz/homer) - [Dashy](https://github.com/Lissy93/dashy)
- [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)\*
**Note:** Dashboards with a \* have native integration with Dashboard Icons. ### ✨ Usage
### 🛠️ 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!
To download an icon from the [icons page](#-icons), simply `Right click > Save link as`. 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 ```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 or
```sh ```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 ## 🎨 Icons
**⚠️ Warning!** Going to this page will load every single icon in the repository. This might cause: **⚠️ Warning!** Visiting this page will load every single icon in the repository. This may cause:
- 📉 An excessive amount of data use. - 📉 Excessive data usage.
- 💻 System slowdowns. - 💻 System slowdowns.
- 🌐 Browser crashes. - 🌐 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 ## 🎉 Contribution Guidelines
Please read the [Contributing Guidelines](CONTRIBUTING.md) before contributing to this project. Please review the [Contribution Guidelines](CONTRIBUTING.md) before contributing to this project.
## 📜 Legal ## 📜 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. 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.
For questions or concerns regarding the license, contact me at walkxnl@gmail.com before using or distributing the contents of this repository.

6
config/TEMPLATE.md
View File

@ -1,14 +1,14 @@
<p align="center"> <p align="center">
<h2 align="center"> 🟣 Dashboard Icons </h3> <h2 align="center"> 🚀 Dashboard Icons </h3>
<p align="center"> <p align="center">
<a href="https://www.jsdelivr.com/package/gh/walkxcode/dashboard-icons"> <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"> <img src="https://img.shields.io/jsdelivr/gh/hy/walkxcode/dashboard-icons?color=%23A020F0" alt="JSdelivr weekly downloads badge">
</a> </a>
</p> </p>
<p align="center"> <p align="center">
🚀 The best place to find icons for your dashboards. The best source for dashboard icons.
<br /> <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 />
<br /> <br />
</p> </p>