mirror of
https://github.com/pheralb/svgl.git
synced 2024-11-10 14:46:54 +08:00
📚一个拥有 SVG 徽标的美丽图书馆。使用 Sveltekit 与 Tailwind CSS 构建。
https://svgl.app/
|
|
||
|---|---|---|
| .github | ||
| .vscode | ||
| src | ||
| static | ||
| .eslintignore | ||
| .eslintrc.cjs | ||
| .gitignore | ||
| .npmrc | ||
| .prettierignore | ||
| .prettierrc | ||
| LICENSE | ||
| package.json | ||
| postcss.config.cjs | ||
| prettier.config.cjs | ||
| README.md | ||
| svelte.config.js | ||
| tailwind.config.cjs | ||
| tsconfig.json | ||
| vercel.json | ||
| vite.config.ts | ||
🛠️ Stack
- Sveltekit - Web development, streamlined.
- Typescript - JavaScript with syntax for types.
- Tailwindcss - A utility-first CSS framework for rapidly building custom designs.
- Prettier + prettier-plugin-tailwindcss - An opinionated code formatter.
- phosphor-svelte - A clean and friendly icon family for Svelte.
- svelte-sonner - An opinionated toast component for Svelte.
- Vitest - Blazing Fast Unit Test Framework.
🚀 Getting Started
You will need:
- Clone or fork this repository:
git clone git@github.com:pheralb/svgl.git
- Install dependencies with your favorite package manager:
# with npm:
npm install
# with pnpm:
pnpm install
# with ultra:
ultra install
# with yarn:
yarn install
-
Go to the
static/libraryfolder and add your.svglogo. Remember to optimize SVG for web use, you can use SVGOMG. -
Go to the
src/data/svgs.tsand add the information about your logo, following the structure:
Important
To avoid conflicts with other svgs IDs, generate a short random number for the id: Generate (only check 'include numbers').
{
"id": 45248,
"title": "Title",
"category": "Category",
"route": "/library/your_logo.svg",
"url": "Website"
},
And create a pull request with your logo 🚀.
✌️ Contributing
🔑 License
- MIT.