svgl/README.md

119 lines
3.4 KiB
Markdown
Raw Normal View History

2023-03-20 18:43:25 +08:00
<div align="center">
2023-03-15 20:11:21 +08:00
<a href="https://svgl.vercel.app">
2023-03-20 18:43:25 +08:00
<img src="static/images/screenshot.png">
2023-03-15 20:11:21 +08:00
</a>
<p></p>
2023-03-20 18:43:25 +08:00
</div>
2022-03-04 21:34:58 +08:00
2023-03-15 20:11:21 +08:00
<div align="center">
<a href="https://svgl.vercel.app/" target="_blank">
Discover
</a>
2023-11-14 18:50:52 +08:00
<span>&nbsp;&nbsp;</span>
2023-03-15 20:11:21 +08:00
<a href="#-getting-started">
Submit logo
</a>
2023-11-14 18:50:52 +08:00
<span>&nbsp;&nbsp;</span>
2023-03-20 18:51:52 +08:00
<a href="#%EF%B8%8F-stack">
2023-03-15 20:11:21 +08:00
Stack
</a>
2023-11-14 18:50:52 +08:00
<span>&nbsp;&nbsp;</span>
2023-03-20 18:51:52 +08:00
<a href="#%EF%B8%8F-contributing">
Contributing
</a>
2023-03-15 20:11:21 +08:00
</div>
2022-06-20 22:27:28 +08:00
2023-03-15 20:11:21 +08:00
</p>
2022-01-16 22:40:15 +08:00
2023-03-15 20:11:21 +08:00
<div align="center">
2022-01-16 22:40:15 +08:00
2023-11-14 18:50:52 +08:00
![Svelte Badge](https://img.shields.io/badge/Svelte-FF3E00?logo=svelte&logoColor=fff&style=flat)
2023-03-20 19:28:52 +08:00
[![Build Status](https://img.shields.io/endpoint.svg?url=https%3A%2F%2Factions-badge.atrox.dev%2Fpheralb%2Fsvgl%2Fbadge%3Fref%3Dmain&style=flat)](https://actions-badge.atrox.dev/pheralb/svgl/goto?ref=main)
2023-03-15 20:11:21 +08:00
![GitHub stars](https://img.shields.io/github/stars/pheralb/svgl)
![GitHub issues](https://img.shields.io/github/issues/pheralb/svgl)
![GitHub forks](https://img.shields.io/github/forks/pheralb/svgl)
2023-03-20 19:13:05 +08:00
![GitHub PRs](https://img.shields.io/github/issues-pr/pheralb/svgl)
2023-11-14 18:50:52 +08:00
![Tailwind CSS Badge](https://img.shields.io/badge/Tailwind%20CSS-06B6D4?logo=tailwindcss&logoColor=fff&style=flat)
2023-03-15 20:11:21 +08:00
</div>
## 🛠️ Stack
2023-03-15 21:54:31 +08:00
- [**Sveltekit**](https://kit.svelte.dev/) - Web development, streamlined.
- [**Typescript**](https://www.typescriptlang.org/) - JavaScript with syntax for types.
- [**Tailwindcss**](https://tailwindcss.com/) - A utility-first CSS framework for rapidly building custom designs.
- [**Prettier**](https://prettier.io/) + [prettier-plugin-tailwindcss](https://github.com/tailwindlabs/prettier-plugin-tailwindcss) - An opinionated code formatter.
- [**phosphor-svelte**](https://github.com/haruaki07/phosphor-svelte) - A clean and friendly icon family for Svelte.
2023-11-14 18:50:52 +08:00
- [**svelte-sonner**](https://github.com/wobsoriano/svelte-sonner) - An opinionated toast component for Svelte.
2023-03-15 21:54:31 +08:00
- [**Vitest**](https://vitest.dev/) - Blazing Fast Unit Test Framework.
2023-03-15 20:11:21 +08:00
## 🚀 Getting Started
You will need:
- [Node.js 16+ (recommended 18 LTS)](https://nodejs.org/en/).
- [Git](https://git-scm.com/).
2022-06-27 01:43:23 +08:00
2023-03-15 20:11:21 +08:00
1. Clone or [fork](https://github.com/pheralb/svgl/fork) this repository:
2022-06-27 01:43:23 +08:00
2023-03-15 20:11:21 +08:00
```bash
git clone git@github.com:pheralb/svgl.git
```
2. Install dependencies with your favorite package manager:
2022-06-27 01:43:23 +08:00
```bash
2023-03-15 20:11:21 +08:00
# with npm:
npm install
2023-03-17 23:31:49 +08:00
# with pnpm:
2023-03-15 20:11:21 +08:00
pnpm install
2022-06-27 01:43:23 +08:00
2023-03-17 23:31:49 +08:00
# with ultra:
2023-03-15 20:11:21 +08:00
ultra install
2023-03-17 23:31:49 +08:00
# with yarn:
2023-03-15 20:11:21 +08:00
yarn install
2022-06-27 01:43:23 +08:00
```
2023-03-20 18:43:25 +08:00
3. Go to the [**`static/library`**](https://github.com/pheralb/svgl/blob/main/static/library) folder and add your `.svg` logo. Remember to optimize SVG for web use, you can use [SVGOMG](https://jakearchibald.github.io/svgomg/).
2022-01-16 22:40:15 +08:00
2023-03-20 08:58:33 +08:00
4. Go to the [**`src/data/svgs.ts`**](https://github.com/pheralb/svgl/blob/main/src/data/svgs.ts) and add the information about your logo, following the structure:
2023-03-15 20:11:21 +08:00
```json
{
"title": "Title",
"category": "Category",
"route": "/library/your_logo.svg",
"url": "Website"
},
```
or to support a different logo for light and dark themes:
```json
{
"title": "Title",
"category": "Category",
"route": {
"light": "/library/your_logo_light.svg",
"dark": "/library/your_logo_dark.svg"
},
"url": "Website"
},
```
2023-03-15 20:11:21 +08:00
And create a pull request with your logo 🚀.
2023-03-20 08:58:33 +08:00
## ✌️ Contributing
<a href="https://github.com/pheralb/svgl/graphs/contributors">
<img src="https://contrib.rocks/image?repo=pheralb/svgl" />
</a>
<p></p>
## 🔑 License
2022-01-16 22:40:15 +08:00
2023-03-15 20:11:21 +08:00
- [MIT](https://github.com/pheralb/svgl/blob/main/LICENSE).