🚀 Merge branch 'main' of github.com:pheralb/svgl into next.

README.md

@@ -80,12 +80,8 @@ yarn install
 
 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:
 
-> [!IMPORTANT]
-> To avoid conflicts with other svgs IDs, generate a short random number for the id: [Generate (only check 'include numbers')](https://nanoid.yuuniworks.com/).
-
 ```json
 {
-  "id": 45248,
   "title": "Title",
   "category": "Category",
   "route": "/library/your_logo.svg",
@@ -97,7 +93,6 @@ or to support a different logo for light and dark themes:
 
 ```json
 {
-  "id": 45248,
   "title": "Title",
   "category": "Category",
   "route": {

src/components/svgCard.svelte

@@ -58,7 +58,7 @@
       loading="lazy"
     />
     <div class="mb-3 flex flex-col items-center justify-center">
-      <p class="truncate text-[15px] font-medium">{svgInfo.title}</p>
+      <p class="truncate text-[15px] font-medium text-balance text-center">{svgInfo.title}</p>
       <a
         href={`/directory/${svgInfo.category.toLowerCase()}`}
         class="text-sm lowercase text-neutral-500 hover:underline">{svgInfo.category}</a

src/data/index.ts

@@ -0,0 +1,7 @@
+import type { iSVG } from '@/types/svg';
+import { svgs } from './svgs';
+
+export const svgsData = svgs.map((svg: iSVG, index: number) => {
+    svg.id = index;
+    return svg;
+});

src/data/svgs.ts

@@ -2,35 +2,30 @@ import type { iSVG } from '../types/svg';
 
 export const svgs: iSVG[] = [
   {
-    id: 1,
     title: 'Discord',
     category: 'Software',
     route: '/library/discord.svg',
     url: 'https://discord.com/'
   },
   {
-    id: 2,
     title: 'Github',
     category: 'Software',
     route: '/library/github.svg',
     url: 'https://github.com/'
   },
   {
-    id: 3,
     title: 'Preact',
     category: 'Library',
     route: '/library/preact.svg',
     url: 'https://preactjs.com/'
   },
   {
-    id: 4,
     title: 'React',
     category: 'Library',
     route: '/library/react.svg',
     url: 'https://reactjs.org/'
   },
   {
-    id: 5,
     title: 'Vercel',
     category: 'Hosting',
     route: {
@@ -40,140 +35,120 @@ export const svgs: iSVG[] = [
     url: 'https://vercel.com/'
   },
   {
-    id: 6,
     title: 'Svelte',
     category: 'Library',
     route: '/library/svelte.svg',
     url: 'https://svelte.dev/'
   },
   {
-    id: 7,
     title: 'Vue',
     category: 'Framework',
     route: '/library/vue.svg',
     url: 'https://vuejs.org/'
   },
   {
-    id: 8,
     title: 'Nuxt',
     category: 'Framework',
     route: '/library/nuxt.svg',
     url: 'https://nuxtjs.org/'
   },
   {
-    id: 9,
     title: 'Nextjs',
     category: 'Framework',
     route: '/library/nextjs.svg',
     url: 'https://nextjs.org/'
   },
   {
-    id: 10,
     title: 'Visual Studio Code',
     category: 'Software',
     route: '/library/vscode.svg',
     url: 'https://code.visualstudio.com/'
   },
   {
-    id: 11,
     title: 'JWT',
     category: 'Library',
     route: '/library/jwt.svg',
     url: 'https://jwt.io/'
   },
   {
-    id: 12,
     title: 'Strapi',
     category: 'CMS',
     route: '/library/strapi.svg',
     url: 'https://strapi.io/'
   },
   {
-    id: 13,
     title: 'Figma',
     category: 'Design',
     route: '/library/figma.svg',
     url: 'https://www.figma.com/'
   },
   {
-    id: 14,
     title: 'Spotify',
     category: 'Software',
     route: '/library/spotify.svg',
     url: 'https://www.spotify.com/'
   },
   {
-    id: 15,
     title: 'Postman',
     category: 'Software',
     route: '/library/postman.svg',
     url: 'https://www.getpostman.com/'
   },
   {
-    id: 16,
     title: 'Algolia',
     category: 'Library',
     route: '/library/algolia.svg',
     url: 'https://www.algolia.com/'
   },
   {
-    id: 17,
     title: 'Bootstrap',
     category: 'Framework',
     route: '/library/bootstrap.svg',
     url: 'https://getbootstrap.com/'
   },
   {
-    id: 18,
     title: 'Firebase',
     category: 'Hosting',
     route: '/library/firebase.svg',
     url: 'https://firebase.google.com/'
   },
   {
-    id: 19,
     title: 'Supabase',
     category: 'Database',
     route: '/library/supabase.svg',
     url: 'https://supabase.com/'
   },
   {
-    id: 20,
     title: 'Vite.js',
     category: 'Compiler',
     route: '/library/vitejs.svg',
     url: 'https://vitejs.dev'
   },
   {
-    id: 21,
     title: 'Facebook',
     category: 'Social',
     route: '/library/facebook.svg',
     url: 'https://www.facebook.com/'
   },
   {
-    id: 22,
     title: 'Twitter',
     category: 'Social',
     route: '/library/twitter.svg',
     url: 'https://twitter.com/'
   },
   {
-    id: 23,
     title: 'Node.js',
     category: 'Library',
     route: '/library/nodejs.svg',
     url: 'https://nodejs.org/'
   },
   {
-    id: 24,
     title: 'Esbuild',
     category: 'Compiler',
     route: '/library/esbuild.svg',
     url: 'https://esbuild.github.io/'
   },
   {
-    id: 25,
     title: 'Deno',
     category: 'Library',
     route: {
@@ -183,91 +158,78 @@ export const svgs: iSVG[] = [
     url: 'https://deno.land/'
   },
   {
-    id: 26,
     title: 'Gatsby',
     category: 'Framework',
     route: '/library/gatsby.svg',
     url: 'https://www.gatsbyjs.org/'
   },
   {
-    id: 27,
     title: 'NPM',
     category: 'Software',
     route: '/library/npm.svg',
     url: 'https://www.npmjs.com/'
   },
   {
-    id: 28,
     title: 'Homebrew',
     category: 'Software',
     route: '/library/homebrew.svg',
     url: 'https://brew.sh/'
   },
   {
-    id: 29,
     title: 'Sublime Text',
     category: 'Software',
     route: '/library/sublimetext.svg',
     url: 'https://www.sublimetext.com/'
   },
   {
-    id: 30,
     title: 'TurboRepo',
     category: 'Library',
     route: '/library/turborepo.svg',
     url: 'https://turborepo.org/'
   },
   {
-    id: 31,
     title: 'Tailwind CSS',
     category: 'Framework',
     route: '/library/tailwindcss.svg',
     url: 'https://tailwindcss.com/'
   },
   {
-    id: 32,
     title: 'Styled Components',
     category: 'Library',
     route: '/library/styledcomponents.svg',
     url: 'https://styled-components.com/'
   },
   {
-    id: 33,
     title: 'Angular',
     category: 'Framework',
     route: '/library/angular.svg',
     url: 'https://angular.dev/'
   },
   {
-    id: 34,
     title: 'Blitz',
     category: 'Framework',
     route: '/library/blitzjs.svg',
     url: 'https://blitzjs.com/'
   },
   {
-    id: 35,
     title: 'Lit',
     category: 'Library',
     route: '/library/lit.svg',
     url: 'https://lit.dev/'
   },
   {
-    id: 36,
     title: 'Atom',
     category: 'Software',
     route: '/library/atom.svg',
     url: 'https://atom.io/'
   },
   {
-    id: 37,
     title: 'YouTube',
     category: 'Social',
     route: '/library/youtube.svg',
     url: 'https://www.youtube.com/'
   },
   {
-    id: 38,
     title: 'Astro',
     category: 'Framework',
     route: {
@@ -277,14 +239,12 @@ export const svgs: iSVG[] = [
     url: 'https://astro.build/'
   },
   {
-    id: 39,
     title: 'Google',
     category: 'Social',
     route: '/library/google.svg',
     url: 'https://www.google.com/'
   },
   {
-    id: 40,
     title: 'Framer',
     category: 'Software',
     route: {
@@ -294,105 +254,90 @@ export const svgs: iSVG[] = [
     url: 'https://framer.com/'
   },
   {
-    id: 41,
     title: 'Netflix',
     category: 'Entertainment',
     route: '/library/netflix.svg',
     url: 'https://www.netflix.com/'
   },
   {
-    id: 42,
     title: 'Firefox',
     category: 'Browser',
     route: '/library/firefox.svg',
     url: 'https://www.mozilla.org/en-US/firefox/'
   },
   {
-    id: 43,
     title: 'LinkedIn',
     category: 'Social',
     route: '/library/linkedin.svg',
     url: 'https://www.linkedin.com/'
   },
   {
-    id: 44,
     title: 'Telegram',
     category: 'Social',
     route: '/library/telegram.svg',
     url: 'https://web.telegram.org/'
   },
   {
-    id: 45,
     title: 'WhatsApp',
     category: 'Social',
     route: '/library/whatsapp.svg',
     url: 'https://web.whatsapp.com/'
   },
   {
-    id: 46,
     title: 'Headless UI',
     category: 'Library',
     route: '/library/headlessui.svg',
     url: 'https://headlessui.dev/'
   },
   {
-    id: 47,
     title: 'Kotlin',
     category: 'Language',
     route: '/library/kotlin.svg',
     url: 'https://kotlinlang.org/'
   },
   {
-    id: 48,
     title: 'Vitest',
     category: 'Framework',
     route: '/library/vitest.svg',
     url: 'https://vitest.dev/'
   },
   {
-    id: 49,
     title: 'Storybook',
     category: 'Software',
     route: '/library/storybook.svg',
     url: 'https://storybook.js.org/'
   },
   {
-    id: 50,
     title: 'Netlify',
     category: 'Hosting',
     route: '/library/netlify.svg',
     url: 'https://www.netlify.com/'
   },
   {
-    id: 51,
     title: 'Solidjs',
     category: 'Framework',
     route: '/library/solidjs.svg',
     url: 'https://www.solidjs.com/'
   },
   {
-    id: 52,
     title: 'MongoDB',
     category: 'Database',
     route: '/library/mongodb.svg',
     url: 'https://www.mongodb.com/'
   },
   {
-    id: 53,
     title: 'Babel',
     category: 'Compiler',
     route: '/library/babel.svg',
     url: 'https://babeljs.io'
   },
   {
-    id: 54,
     title: 'Moon',
     category: 'Framework',
     route: '/library/moon.svg',
     url: 'https://moonjs.org/'
   },
   {
-    id: 55,
     title: 'Payload CMS',
     category: 'CMS',
     route: {
@@ -402,35 +347,30 @@ export const svgs: iSVG[] = [
     url: 'https://payloadcms.com'
   },
   {
-    id: 56,
     title: 'Fly',
     category: 'Hosting',
     route: '/library/fly.svg',
     url: 'https://fly.io'
   },
   {
-    id: 57,
     title: 'LearnThis',
     category: 'Education',
     route: '/library/learnthis.svg',
     url: 'https://learnthisacademy.com'
   },
   {
-    id: 58,
     title: 'Visual Studio',
     category: 'Software',
     route: '/library/visual-studio.svg',
     url: 'https://visualstudio.microsoft.com'
   },
   {
-    id: 59,
     title: 'Chakra UI',
     category: 'Library',
     route: '/library/chakra-ui.svg',
     url: 'https://chakra-ui.com'
   },
   {
-    id: 60,
     title: 'Express.js',
     category: 'Framework',
     route: {
@@ -440,7 +380,6 @@ export const svgs: iSVG[] = [
     url: 'https://expressjs.com'
   },
   {
-    id: 61,
     title: 'Fastify',
     category: 'Framework',
     route: {
@@ -450,14 +389,12 @@ export const svgs: iSVG[] = [
     url: 'https://www.fastify.io'
   },
   {
-    id: 62,
     title: 'JavaScript',
     category: 'Language',
     route: '/library/javascript.svg',
     url: 'https://developer.mozilla.org/docs/Web/JavaScript'
   },
   {
-    id: 63,
     title: 'jQuery',
     category: 'Language',
     route: {
@@ -467,35 +404,30 @@ export const svgs: iSVG[] = [
     url: 'https://jquery.com'
   },
   {
-    id: 64,
     title: 'Rapid API',
     category: 'Software',
     route: '/library/rapidapi.svg',
     url: 'https://rapidapi.com'
   },
   {
-    id: 65,
     title: 'TypeScript',
     category: 'Language',
     route: '/library/typescript.svg',
     url: 'https://www.typescriptlang.org'
   },
   {
-    id: 66,
     title: 'Bun',
     category: 'Library',
     route: '/library/bun.svg',
     url: 'https://bun.sh'
   },
   {
-    id: 67,
     title: 'Twilio',
     category: 'Software',
     route: '/library/twilio.svg',
     url: 'https://twilio.com'
   },
   {
-    id: 68,
     title: 'Arc',
     category: 'Social',
     route: {
@@ -505,35 +437,30 @@ export const svgs: iSVG[] = [
     url: 'https://arc.dev'
   },
   {
-    id: 69,
     title: 'Qwik',
     category: 'Framework',
     route: '/library/qwik.svg',
     url: 'https://qwik.builder.io/'
   },
   {
-    id: 70,
     title: 'Authy',
     category: 'Software',
     route: '/library/authy.svg',
     url: 'https://authy.com/'
   },
   {
-    id: 71,
     title: 'Notion',
     category: 'Software',
     route: '/library/notion.svg',
     url: 'https://notion.so/'
   },
   {
-    id: 72,
     title: 'NestJS',
     category: 'Framework',
     route: '/library/nestjs.svg',
     url: 'https://nestjs.com/'
   },
   {
-    id: 73,
     title: 'Github Copilot',
     category: 'Software',
     route: {
@@ -543,7 +470,6 @@ export const svgs: iSVG[] = [
     url: 'https://github.com/features/copilot'
   },
   {
-    id: 74,
     title: 'Railway',
     category: 'Software',
     route: {
@@ -553,21 +479,18 @@ export const svgs: iSVG[] = [
     url: 'https://railway.app/'
   },
   {
-    id: 75,
     title: 'Docusaurus',
     category: 'Software',
     route: '/library/docusaurus.svg',
     url: 'https://docusaurus.io/'
   },
   {
-    id: 76,
     title: 'Twitch',
     category: 'Entertainment',
     route: '/library/twitch.svg',
     url: 'https://twitch.tv'
   },
   {
-    id: 77,
     title: 'GoDaddy',
     category: 'Hosting',
     route: {
@@ -577,7 +500,6 @@ export const svgs: iSVG[] = [
     url: 'https://www.godaddy.com/'
   },
   {
-    id: 78,
     title: 'Udemy',
     category: 'Education',
     route: {
@@ -587,21 +509,18 @@ export const svgs: iSVG[] = [
     url: 'https://www.udemy.com/'
   },
   {
-    id: 79,
     title: 'GraphQL',
     category: 'Language',
     route: '/library/graphql.svg',
     url: 'https://graphql.org/'
   },
   {
-    id: 80,
     title: 'GitLab',
     category: 'Software',
     route: '/library/gitlab.svg',
     url: 'https://gitlab.com/'
   },
   {
-    id: 81,
     title: 'Prisma',
     category: 'Software',
     route: {
@@ -611,7 +530,6 @@ export const svgs: iSVG[] = [
     url: 'https://prisma.io/'
   },
   {
-    id: 82,
     title: 'Go',
     category: 'Language',
     route: {
@@ -621,77 +539,66 @@ export const svgs: iSVG[] = [
     url: 'https://go.dev/'
   },
   {
-    id: 83,
     title: 'Platzi',
     category: 'Education',
     route: '/library/platzi.svg',
     url: 'https://platzi.com/'
   },
   {
-    id: 84,
     title: 'Coursera',
     category: 'Education',
     route: '/library/coursera.svg',
     url: 'https://www.coursera.org/'
   },
   {
-    id: 85,
     title: 'Udacity',
     category: 'Education',
     route: '/library/udacity.svg',
     url: 'https://www.udacity.com/'
   },
   {
-    id: 86,
     title: 'Kubernetes',
     category: 'Software',
     route: '/library/kubernetes.svg',
     url: 'https://kubernetes.io/'
   },
   {
-    id: 87,
     title: 'Docker',
     category: 'Software',
     route: '/library/docker.svg',
     url: 'https://www.docker.com/'
   },
   {
-    id: 88,
     title: 'Amazon Web Services',
     category: 'Software',
     route: '/library/aws.svg',
     url: 'https://aws.amazon.com/'
   },
   {
-    id: 89,
     title: 'Microsoft Azure',
     category: 'Software',
     route: '/library/azure.svg',
     url: 'https://azure.microsoft.com/'
   },
   {
-    id: 90,
     title: 'Heroku',
     category: 'Software',
     route: '/library/heroku.svg',
     url: 'https://www.heroku.com/'
   },
   {
-    id: 91,
     title: 'JetBrains',
     category: 'Software',
     route: '/library/jetbrains.svg',
     url: 'https://www.jetbrains.com/'
   },
   {
-    id: 92,
     title: 'JetBrains Rider',
     category: 'Software',
     route: '/library/rider.svg',
     url: 'https://www.jetbrains.com/rider/'
   },
   {
-    id: 93,
     title: 'PlanetScale',
     category: 'Database',
     route: {
@@ -701,245 +608,210 @@ export const svgs: iSVG[] = [
     url: 'https://planetscale.com/'
   },
   {
-    id: 94,
     title: 'Playwright',
     category: 'Framework',
     route: '/library/playwright.svg',
     url: 'https://playwright.dev/'
   },
   {
-    id: 95,
     title: 'Atlassian',
     category: 'Software',
     route: '/library/atlassian.svg',
     url: 'https://www.atlassian.com/'
   },
   {
-    id: 96,
     title: 'Discourse',
     category: 'Software',
     route: '/library/discourse.svg',
     url: 'https://discourse.org/'
   },
   {
-    id: 97,
     title: 'Ember',
     category: 'Framework',
     route: '/library/ember.svg',
     url: 'https://emberjs.com/'
   },
   {
-    id: 98,
     title: 'Expo',
     category: 'Software',
     route: '/library/expo.svg',
     url: 'https://expo.dev/'
   },
   {
-    id: 99,
     title: 'Flutter',
     category: 'Framework',
     route: '/library/flutter.svg',
     url: 'https://flutter.dev/'
   },
   {
-    id: 100,
     title: 'Fresh',
     category: 'Framework',
     route: '/library/fresh.svg',
     url: 'https://fresh.deno.dev/'
   },
   {
-    id: 101,
     title: 'Git',
     category: 'Software',
     route: '/library/git.svg',
     url: 'https://git-scm.com/'
   },
   {
-    id: 102,
     title: 'Hostgator',
     category: 'Hosting',
     route: '/library/hostgator.svg',
     url: 'https://www.hostgator.com/'
   },
   {
-    id: 103,
     title: 'IntelliJ IDEA',
     category: 'Software',
     route: '/library/intellijidea.svg',
     url: 'https://www.jetbrains.com/idea/'
   },
   {
-    id: 104,
     title: 'Jasmine',
     category: 'Framework',
     route: '/library/jasmine.svg',
     url: 'https://jasmine.github.io/'
   },
   {
-    id: 105,
     title: 'Java',
     category: 'Language',
     route: '/library/java.svg',
     url: 'https://www.java.com/'
   },
   {
-    id: 106,
     title: 'Jest',
     category: 'Framework',
     route: '/library/jest.svg',
     url: 'https://jestjs.io/'
   },
   {
-    id: 107,
     title: 'JetBrains',
     category: 'Software',
     route: '/library/jetbrainsSolid.svg',
     url: 'https://www.jetbrains.com/'
   },
   {
-    id: 108,
     title: 'KrakenJS',
     category: 'Framework',
     route: '/library/krakenjs.svg',
     url: 'https://krakenjs.com/'
   },
   {
-    id: 109,
     title: 'Laravel',
     category: 'Framework',
     route: '/library/laravel.svg',
     url: 'https://laravel.com/'
   },
   {
-    id: 110,
     title: 'MariaDB',
     category: 'Database',
     route: '/library/mariadb.svg',
     url: 'https://mariadb.org/'
   },
   {
-    id: 111,
     title: 'Material UI',
     category: 'Framework',
     route: '/library/materialui.svg',
     url: 'https://mui.com/'
   },
   {
-    id: 112,
     title: 'MySQL',
     category: 'Database',
     route: '/library/mysql.svg',
     url: 'https://www.mysql.com/'
   },
   {
-    id: 113,
     title: 'Parcel',
     category: 'Compiler',
     route: '/library/parcel.svg',
     url: 'https://parceljs.org/'
   },
   {
-    id: 114,
     title: 'PM2',
     category: 'Framework',
     route: '/library/pm2.svg',
     url: 'https://pm2.io/'
   },
   {
-    id: 115,
     title: 'PostgreSQL',
     category: 'Database',
     route: '/library/postgresql.svg',
     url: 'https://www.postgresql.org/'
   },
   {
-    id: 116,
     title: 'React Query',
     category: 'Framework',
     route: '/library/reactquery.svg',
     url: 'https://tanstack.com/query/v4'
   },
   {
-    id: 117,
     title: 'Redis',
     category: 'Database',
     route: '/library/redis.svg',
     url: 'https://redis.io/'
   },
   {
-    id: 118,
     title: 'RedwoodJS',
     category: 'Framework',
     route: '/library/redwoodjs.svg',
     url: 'https://redwoodjs.com/'
   },
   {
-    id: 119,
     title: 'Ruby',
     category: 'Language',
     route: '/library/ruby.svg',
     url: 'https://www.ruby-lang.org/'
   },
   {
-    id: 120,
     title: 'Scala',
     category: 'Language',
     route: '/library/scala.svg',
     url: 'https://www.scala-lang.org/'
   },
   {
-    id: 121,
     title: 'Sequelize',
     category: 'Framework',
     route: '/library/sequelize.svg',
     url: 'https://sequelize.org/'
   },
   {
-    id: 122,
     title: 'Spinnaker',
     category: 'Software',
     route: '/library/spinnaker.svg',
     url: 'https://spinnaker.io/'
   },
   {
-    id: 123,
     title: 'SQLite',
     category: 'Database',
     route: '/library/sqlite.svg',
     url: 'https://www.sqlite.org/'
   },
   {
-    id: 124,
     title: 'Swagger',
     category: 'Software',
     route: '/library/swagger.svg',
     url: 'https://swagger.io/'
   },
   {
-    id: 125,
     title: 'Swift',
     category: 'Language',
     route: '/library/swift.svg',
     url: 'https://swift.org/'
   },
   {
-    id: 126,
     title: 'Testing Library',
     category: 'Framework',
     route: '/library/testinglibrary.svg',
     url: 'https://testing-library.com/'
   },
   {
-    id: 127,
     title: 'TypeORM',
     category: 'Database',
     route: '/library/typeorm.svg',
     url: 'https://typeorm.io/'
   },
   {
-    id: 128,
     title: 'Unity',
     category: 'Software',
     route: {
@@ -949,91 +821,78 @@ export const svgs: iSVG[] = [
     url: 'https://unity.com/'
   },
   {
-    id: 129,
     title: 'Vim',
     category: 'Software',
     route: '/library/vim.svg',
     url: 'https://www.vim.org/'
   },
   {
-    id: 130,
     title: 'Pocketbase',
     category: 'Database',
     route: '/library/pocket-base.svg',
     url: 'https://pocketbase.io/'
   },
   {
-    id: 131,
     title: 'OpenBootcamp',
     category: 'Education',
     route: '/library/openbootcamp.svg',
     url: 'https://open-bootcamp.com/'
   },
   {
-    id: 132,
     title: 'Digital Ocean',
     category: 'Software',
     route: '/library/digitalocean.svg',
     url: 'https://www.digitalocean.com/'
   },
   {
-    id: 133,
     title: 'Disney+',
     category: 'Entertainment',
     route: '/library/disneyplus.svg',
     url: 'https://www.disneyplus.com/'
   },
   {
-    id: 134,
     title: 'React Router',
     category: 'Library',
     route: '/library/reactrouter.svg',
     url: 'https://reactrouter.com/en/main'
   },
   {
-    id: 135,
     title: 'Developer Student Club',
     category: 'Education',
     route: '/library/gdsc.svg',
     url: 'https://gdsc.community.dev/'
   },
   {
-    id: 136,
     title: 'Brave Browser',
     category: 'Browser',
     route: '/library/brave.svg',
     url: 'https://brave.com/'
   },
   {
-    id: 137,
     title: 'Eclipse IDE',
     category: 'Software',
     route: '/library/eclipse.svg',
     url: 'https://www.eclipse.org/'
   },
   {
-    id: 138,
     title: 'HTML5',
     category: 'Language',
     route: '/library/html5.svg',
     url: 'https://es.wikipedia.org/wiki/HTML5'
   },
   {
-    id: 139,
     title: 'CSS',
     category: 'Language',
     route: '/library/css.svg',
     url: 'https://es.wikipedia.org/wiki/CSS'
   },
   {
-    id: 140,
     title: 'midudev',
     category: 'Education',
     route: '/library/midudev.svg',
     url: 'https://midu.dev'
   },
   {
-    id: 141,
     title: 'Apple',
     category: 'Software',
     route: {
@@ -1043,231 +902,198 @@ export const svgs: iSVG[] = [
     url: 'https://www.apple.com'
   },
   {
-    id: 142,
     title: 'Android',
     category: 'Software',
     route: '/library/android.svg',
     url: 'https://www.android.com/'
   },
   {
-    id: 143,
     title: 'Windows',
     category: 'Software',
     route: '/library/windows.svg',
     url: 'https://www.microsoft.com/windows'
   },
   {
-    id: 144,
     title: 'Python',
     category: 'Language',
     route: '/library/python.svg',
     url: 'https://www.python.org/'
   },
   {
-    id: 145,
     title: 'Turbopack',
     category: 'Software',
     route: '/library/turbopack.svg',
     url: 'https://turbo.build/'
   },
   {
-    id: 146,
     title: 'Builder',
     category: 'CMS',
     route: '/library/builder.svg',
     url: 'https://builder.io/'
   },
   {
-    id: 147,
     title: 'Surrealdb',
     category: 'Database',
     route: '/library/surrealdb.svg',
     url: 'https://surrealdb.com/'
   },
   {
-    id: 148,
     title: 'Jetbrains Space',
     category: 'Software',
     route: '/library/jetbrains-space.svg',
     url: 'https://www.jetbrains.com/space/'
   },
   {
-    id: 149,
     title: 'Gin',
     category: 'Framework',
     route: '/library/gin.svg',
     url: 'https://gin-gonic.com/'
   },
   {
-    id: 150,
     title: 'Stimulus',
     category: 'Framework',
     route: '/library/stimulus.svg',
     url: 'https://stimulus.hotwired.dev/'
   },
   {
-    id: 151,
     title: 'WindiCSS',
     category: 'Framework',
     route: '/library/windicss.svg',
     url: 'https://windicss.org/'
   },
   {
-    id: 152,
     title: 'Mastodon',
     category: 'Social',
     route: '/library/mastodon.svg',
     url: 'https://joinmastodon.org/'
   },
   {
-    id: 153,
     title: 'Upstash',
     category: 'Database',
     route: '/library/upstash.svg',
     url: 'https://upstash.com/'
   },
   {
-    id: 154,
     title: 'Storyblok',
     category: 'CMS',
     route: '/library/storyblok.svg',
     url: 'https://www.storyblok.com/'
   },
   {
-    id: 155,
     title: 'Cloudflare Workers',
     category: 'Software',
     route: '/library/cloudflare-workers.svg',
     url: 'https://workers.cloudflare.com/'
   },
   {
-    id: 156,
     title: 'Cloudflare',
     category: 'Software',
     route: '/library/cloudflare.svg',
     url: 'https://www.cloudflare.com/'
   },
   {
-    id: 157,
     title: 'Bing',
     category: 'Browser',
     route: '/library/bing.svg',
     url: 'https://www.bing.com/'
   },
   {
-    id: 158,
     title: 'Cloudinary',
     category: 'Software',
     route: '/library/cloudinary.svg',
     url: 'https://cloudinary.com/'
   },
   {
-    id: 159,
     title: 'Dart',
     category: 'Language',
     route: '/library/dart.svg',
     url: 'https://dart.dev/'
   },
   {
-    id: 160,
     title: 'hCaptcha',
     category: 'Software',
     route: '/library/hcaptcha.svg',
     url: 'https://www.hcaptcha.com/'
   },
   {
-    id: 161,
     title: 'Loom',
     category: 'Software',
     route: '/library/loom.svg',
     url: 'https://www.loom.com/'
   },
   {
-    id: 162,
     title: 'Stackblitz',
     category: 'Software',
     route: '/library/stackblitz.svg',
     url: 'https://stackblitz.com/'
   },
   {
-    id: 163,
     title: 'Messenger',
     category: 'Social',
     route: '/library/messenger.svg',
     url: 'https://www.messenger.com/'
   },
   {
-    id: 164,
     title: 'NHost',
     category: 'Hosting',
     route: '/library/nhost.svg',
     url: 'https://nhost.io/'
   },
   {
-    id: 165,
     title: 'Medusa',
     category: 'Software',
     route: '/library/medusa.svg',
     url: 'https://medusajs.com/'
   },
   {
-    id: 166,
     title: 'WordPress',
     category: 'Software',
     route: '/library/wordpress.svg',
     url: 'https://wordpress.org/'
   },
   {
-    id: 167,
     title: 'Microsoft',
     category: 'Software',
     route: '/library/microsoft.svg',
     url: 'https://www.microsoft.com/'
   },
   {
-    id: 168,
     title: 'Elementor',
     category: 'Software',
     route: '/library/elementor.svg',
     url: 'https://elementor.com/'
   },
   {
-    id: 169,
     title: 'Prime video',
     category: 'Entertainment',
     route: '/library/prime-video.svg',
     url: 'https://primevideo.com/'
   },
   {
-    id: 170,
     title: 'Chrome',
     category: 'Browser',
     route: '/library/chrome.svg',
     url: 'https://chrome.com/'
   },
   {
-    id: 171,
     title: 'RxJS',
     category: 'Library',
     route: '/library/rxjs.svg',
     url: 'https://rxjs.dev/'
   },
   {
-    id: 172,
     title: 'Electron',
     category: 'Library',
     route: '/library/electron.svg',
     url: 'https://www.electronjs.org'
   },
   {
-    id: 173,
     title: 'Redux',
     category: 'Library',
     route: '/library/redux.svg',
     url: 'https://redux.js.org/'
   },
   {
-    id: 174,
     title: 'Php',
     category: 'Language',
     route: {
@@ -1277,112 +1103,96 @@ export const svgs: iSVG[] = [
     url: 'https://www.php.net/'
   },
   {
-    id: 175,
     title: 'Hugo',
     category: 'Framework',
     route: '/library/hugo.svg',
     url: 'https://gohugo.io/'
   },
   {
-    id: 176,
     title: 'Sass',
     category: 'Language',
     route: '/library/sass.svg',
     url: 'https://sass-lang.com/'
   },
   {
-    id: 177,
     title: 'Arc',
     category: 'Browser',
     route: '/library/arc_browser.svg',
     url: 'https://arc.net/'
   },
   {
-    id: 178,
     title: 'Pinia',
     category: 'Library',
     route: '/library/pinia.svg',
     url: 'https://pinia.vuejs.org/'
   },
   {
-    id: 179,
     title: 'Neon',
     category: 'Database',
     route: '/library/neon.svg',
     url: 'https://neon.tech/'
   },
   {
-    id: 180,
     title: 'Infojobs',
     category: 'Social',
     route: '/library/infojobs-logo.svg',
     url: 'https://www.infojobs.net/'
   },
   {
-    id: 181,
     title: 'Linear',
     category: 'Software',
     route: '/library/linear.svg',
     url: 'https://linear.app/'
   },
   {
-    id: 182,
     title: 'Tor',
     category: 'Browser',
     route: '/library/tor.svg',
     url: 'https://www.torproject.org/'
   },
   {
-    id: 183,
     title: 'Codesandbox',
     category: 'Software',
     route: '/library/codesandbox-square.svg',
     url: 'https://codesandbox.io/'
   },
   {
-    id: 184,
     title: 'Skype',
     category: 'Social',
     route: '/library/skype.svg',
     url: 'https://www.skype.com/'
   },
   {
-    id: 185,
     title: 'Tauri',
     category: 'Library',
     route: '/library/tauri.svg',
     url: 'https://tauri.app/'
   },
   {
-    id: 186,
     title: 'WebKit',
     category: 'Software',
     route: '/library/webkit.svg',
     url: 'https://webkit.org/'
   },
   {
-    id: 187,
     title: 'Google Bard',
     category: 'AI',
     route: '/library/bard.svg',
     url: 'https://bard.google.com/'
   },
   {
-    id: 188,
     title: 'Obsidian',
     category: 'Software',
     route: '/library/obsidian.svg',
     url: 'https://obsidian.md/'
   },
   {
-    id: 189,
     title: 'Zod',
     category: 'Library',
     route: '/library/zod.svg',
     url: 'https://zod.dev/'
   },
   {
-    id: 190,
     title: 'OpenAI',
     category: 'AI',
     route: {
@@ -1392,14 +1202,12 @@ export const svgs: iSVG[] = [
     url: 'https://openai.com/'
   },
   {
-    id: 191,
     title: 'HuggingFace',
     category: 'AI',
     route: '/library/hf.svg',
     url: 'https://huggingface.co/'
   },
   {
-    id: 192,
     title: 'Threads',
     category: 'Social',
     route: {
@@ -1409,7 +1217,6 @@ export const svgs: iSVG[] = [
     url: 'https://threads.net/'
   },
   {
-    id: 193,
     title: 'Instagram',
     category: 'Social',
     route: {
@@ -1419,154 +1226,132 @@ export const svgs: iSVG[] = [
     url: 'https://www.instagram.com/'
   },
   {
-    id: 194,
     title: 'VueUse',
     category: 'Library',
     route: '/library/vueuse.svg',
     url: 'https://vueuse.org/'
   },
   {
-    id: 195,
     title: 'Microsoft SQL Server ',
     category: 'Database',
     route: '/library/sql-server.svg',
     url: 'https://www.microsoft.com/en-us/sql-server/'
   },
   {
-    id: 196,
     title: 'Biomejs',
     category: 'Compiler',
     route: '/library/biomejs.svg',
     url: 'https://biomejs.dev/'
   },
   {
-    id: 197,
     title: 'Hono',
     category: 'Framework',
     route: '/library/hono.svg',
     url: 'https://hono.dev/'
   },
   {
-    id: 198,
     title: 'Million',
     category: 'Library',
     route: '/library/million.svg',
     url: 'https://million.dev/'
   },
   {
-    id: 199,
     title: 'PandaCSS',
     category: 'Library',
     route: '/library/pandacss.svg',
     url: 'https://panda-css.com/'
   },
   {
-    id: 200,
     title: 'Pulumi',
     category: 'Software',
     route: '/library/pulumi.svg',
     url: 'https://www.pulumi.com/'
   },
   {
-    id: 201,
     title: 'FastAPI',
     category: 'Framework',
     route: '/library/fastapi.svg',
     url: 'https://fastapi.tiangolo.com/'
   },
   {
-    id: 202,
     title: 'Codium',
     category: 'AI',
     route: '/library/codium.svg',
     url: 'https://www.codium.ai/'
   },
   {
-    id: 203,
     title: 'Crossplane',
     category: 'Framework',
     route: '/library/crossplane.svg',
     url: 'https://crossplane.io/'
   },
   {
-    id: 204,
     title: 'Typesense',
     category: 'Software',
     route: '/library/typesense.svg',
     url: 'https://typesense.org/'
   },
   {
-    id: 205,
     title: 'Bitcoin',
     category: 'Crypto',
     route: '/library/btc.svg',
     url: 'https://bitcoin.org/'
   },
   {
-    id: 206,
     title: 'Ethereum',
     category: 'Crypto',
     route: '/library/eth.svg',
     url: 'https://ethereum.org/'
   },
   {
-    id: 207,
     title: 'Solana',
     category: 'Crypto',
     route: '/library/sol.svg',
     url: 'https://solana.com/'
   },
   {
-    id: 208,
     title: 'Dogecoin',
     category: 'Crypto',
     route: '/library/doge.svg',
     url: 'https://dogecoin.com/'
   },
   {
-    id: 209,
     title: 'XRP',
     category: 'Crypto',
     route: '/library/xrp.svg',
     url: 'https://xrpl.org/'
   },
   {
-    id: 210,
     title: 'BNB',
     category: 'Crypto',
     route: '/library/bnb.svg',
     url: 'https://www.bnbchain.org/'
   },
   {
-    id: 211,
     title: 'Cardano',
     category: 'Crypto',
     route: '/library/ada.svg',
     url: 'https://cardano.org/'
   },
   {
-    id: 212,
     title: 'TRON',
     category: 'Crypto',
     route: '/library/trx.svg',
     url: 'https://tron.network/'
   },
   {
-    id: 213,
     title: 'Chainlink',
     category: 'Crypto',
     route: '/library/link.svg',
     url: 'https://chain.link/'
   },
   {
-    id: 214,
     title: 'Polygon',
     category: 'Crypto',
     route: '/library/matic.svg',
     url: 'https://polygon.technology/'
   },
   {
-    id: 215,
     title: 'X',
     category: 'Social',
     route: {
@@ -1576,98 +1361,84 @@ export const svgs: iSVG[] = [
     url: 'https://x.com'
   },
   {
-    id: 216,
     title: 'Adobe',
     category: 'Design',
     route: '/library/adobe.svg',
     url: 'https://x.com'
   },
   {
-    id: 217,
     title: 'After Effects',
     category: 'Design',
     route: '/library/after-effects.svg',
     url: 'https://x.com'
   },
   {
-    id: 218,
     title: 'Canva',
     category: 'Design',
     route: '/library/canva.svg',
     url: 'https://x.com'
   },
   {
-    id: 219,
     title: 'Illustrator',
     category: 'Design',
     route: '/library/illustrator.svg',
     url: 'https://x.com'
   },
   {
-    id: 220,
     title: 'InDesign',
     category: 'Design',
     route: '/library/indesign.svg',
     url: 'https://x.com'
   },
   {
-    id: 221,
     title: 'Lightroom',
     category: 'Design',
     route: '/library/lightroom.svg',
     url: 'https://x.com'
   },
   {
-    id: 222,
     title: 'Photoshop',
     category: 'Design',
     route: '/library/photoshop.svg',
     url: 'https://x.com'
   },
   {
-    id: 223,
     title: 'Premiere',
     category: 'Design',
     route: '/library/premiere.svg',
     url: 'https://x.com'
   },
   {
-    id: 224,
     title: 'VK',
     category: 'Social',
     route: '/library/vk.svg',
     url: 'https://vk.com'
   },
   {
-    id: 225,
     title: 'Hoppscotch',
     category: 'Software',
     route: '/library/hoppscotch.svg',
     url: 'https://hoppscotch.com'
   },
   {
-    id: 226,
     title: 'Dub',
     category: 'Software',
     route: '/library/dub.svg',
     url: 'https://dub.co'
   },
   {
-    id: 227,
     title: 'Opera',
     category: 'Browser',
     route: '/library/opera.svg',
     url: 'https://www.opera.com'
   },
   {
-    id: 228,
     title: 'Salesforce',
     category: 'Software',
     route: '/library/salesforce.svg',
     url: 'https://www.salesforce.com'
   },
   {
-    id: 4929293,
     title: 'Unreal Engine',
     category: 'Software',
     route: {
@@ -1677,84 +1448,72 @@ export const svgs: iSVG[] = [
     url: 'https://www.unrealengine.com/'
   },
   {
-    id: 229,
     title: 'Godot Engine',
     category: 'Software',
     route: '/library/godot_engine.svg',
     url: 'https://godotengine.org/'
   },
   {
-    id: 230,
     title: 'Datadog',
     category: 'Software',
     route: '/library/datadog.svg',
     url: 'https://www.datadoghq.com/'
   },
   {
-    id: 231,
     title: 'Randevum',
     category: 'Software',
     route: '/library/randevum.svg',
     url: 'https://www.randevum.co'
   },
   {
-    id: 232,
     title: 'Chromium',
     category: 'Browser',
     route: '/library/chromium.svg',
     url: 'https://www.chromium.org'
   },
   {
-    id: 233,
     title: 'Edge',
     category: 'Browser',
     route: '/library/edge.svg',
     url: 'https://www.microsoft.com/en-us/edge'
   },
   {
-    id: 234,
     title: 'Safari',
     category: 'Browser',
     route: '/library/safari.svg',
     url: 'https://www.apple.com/safari'
   },
   {
-    id: 235,
     title: 'Vivaldi',
     category: 'Browser',
     route: '/library/vivaldi.svg',
     url: 'https://vivaldi.com'
   },
   {
-    id: 293291,
     title: 'Beacon',
     category: 'Software',
     route: '/library/Beacon-Logo.svg',
     url: 'https://www.beacon.com'
   },
   {
-    id: 95775,
     title: 'Affinity Designer',
     category: 'Design',
     route: '/library/affinity_designer.svg',
     url: 'https://affinity.serif.com/en-us/designer/'
   },
   {
-    id: 44448,
     title: 'Affinity Photo',
     category: 'Software',
     route: '/library/affinity_photo.svg',
     url: 'https://affinity.serif.com/en-us/photo/'
   },
   {
-    id: 39170,
     title: 'Affinity Publisher',
     category: 'Software',
     route: '/library/affinity_publisher.svg',
     url: 'https://affinity.serif.com/en-us/publisher/'
   },
   {
-    id: 24525,
     title: 'Roblox',
     category: 'Software',
     route: {
@@ -1764,7 +1523,6 @@ export const svgs: iSVG[] = [
     url: 'https://www.roblox.com/'
   },
   {
-    id: 68067,
     title: 'Stately.ai',
     category: 'Software',
     route: {
@@ -1774,7 +1532,6 @@ export const svgs: iSVG[] = [
     url: 'https://stately.ai/'
   },
   {
-    id: 233,
     title: 'XState',
     category: 'Library',
     route: {
@@ -1784,63 +1541,54 @@ export const svgs: iSVG[] = [
     url: 'https://github.com/statelyai/xstate'
   },
   {
-    id: 232,
     title: 'Hashnode',
     category: 'Social',
     route: '/library/hashnode.svg',
     url: 'https://hashnode.com'
   },
   {
-    id: 235,
     title: 'Rowy',
     category: 'CMS',
     route: '/library/rowy.svg',
     url: 'https://www.rowy.io/'
   },
   {
-    id: 236,
     title: 'BuildShip',
     category: 'AI',
     route: '/library/buildship.svg',
     url: 'https://buildship.com/'
   },
   {
-    id: 2464806,
     title: 'Cal.com',
     category: 'Software',
     route: '/library/cal.svg',
     url: 'https://cal.com'
   },
   {
-    id: 3452,
     title: 'Midday.ai',
     category: 'Software',
     route: '/library/midday.svg',
     url: 'https://midday.ai'
   },
   {
-    id: 238,
     title: 'Cursor AI',
     category: 'Software',
     route: '/library/cursor.svg',
     url: 'https://cursor.sh/'
   },
   {
-    id: 239,
     title: 'Calendly',
     category: 'Software',
     route: '/library/calendly.svg',
     url: 'https://calendly.com/'
   },
   {
-    id: 240,
     title: 'Mintlify',
     category: 'Software',
     route: '/library/mintlify.svg',
     url: 'https://mintlify.com/'
   },
   {
-    id: 241,
     title: 'Patreon',
     category: 'Software',
     route: {
@@ -1850,42 +1598,36 @@ export const svgs: iSVG[] = [
     url: 'https://www.patreon.com/'
   },
   {
-    id: 242,
     title: 'Peerlist',
     category: 'Social',
     route: '/library/peerlist.svg',
     url: 'https://www.peerlist.io/'
   },
   {
-    id: 243,
     title: 'Product Hunt',
     category: 'Software',
     route: '/library/producthunt.svg',
     url: 'https://www.producthunt.com/'
   },
   {
-    id: 244,
     title: 'Remotion',
     category: 'Framework',
     route: '/library/remotion.svg',
     url: 'https://www.remotion.dev/'
   },
   {
-    id: 245,
     title: 'Warp',
     category: 'Software',
     route: '/library/warp.svg',
     url: 'https://www.warp.dev/'
   },
   {
-    id: 7067478662,
     title: 'SST',
     category: 'Framework',
     route: '/library/sst.svg',
     url: 'https://sst.dev/'
   },
   {
-    id: 2342453,
     title: 'Documenso',
     category: 'Software',
     route: {
@@ -1895,7 +1637,6 @@ export const svgs: iSVG[] = [
     url: 'https://documenso.com'
   },
   {
-    id: 326851,
     title: 'Bash',
     category: 'Language',
     route: {
@@ -1905,49 +1646,42 @@ export const svgs: iSVG[] = [
     url: 'https://www.gnu.org/software/bash/'
   },
   {
-    id: 740938,
     title: 'C',
     category: 'Language',
     route: '/library/c.svg',
     url: 'https://en.wikipedia.org/wiki/C_(programming_language)'
   },
   {
-    id: 156807,
     title: 'C++',
     category: 'Language',
     route: '/library/c++.svg',
     url: 'https://en.wikipedia.org/wiki/C%2B%2B'
   },
   {
-    id: 854167,
     title: 'Cobol',
     category: 'Language',
     route: '/library/cobol.svg',
     url: 'https://en.wikipedia.org/wiki/COBOL'
   },
   {
-    id: 473965,
     title: 'Fortran',
     category: 'Language',
     route: '/library/fortran.svg',
     url: 'https://en.wikipedia.org/wiki/Fortran'
   },
   {
-    id: 429673,
     title: 'Haskell',
     category: 'Language',
     route: '/library/haskell.svg',
     url: 'https://www.haskell.org/'
   },
   {
-    id: 907583,
     title: 'matlab',
     category: 'Language',
     route: '/library/matlab.svg',
     url: 'https://www.mathworks.com/products/matlab.html'
   },
   {
-    id: 754396,
     title: 'R',
     category: 'Language',
     route: {
@@ -1957,7 +1691,6 @@ export const svgs: iSVG[] = [
     url: 'https://www.r-project.org/'
   },
   {
-    id: 783625,
     title: 'Rust',
     category: 'Language',
     route: {
@@ -1967,14 +1700,12 @@ export const svgs: iSVG[] = [
     url: 'https://www.rust-lang.org/'
   },
   {
-    id: 586019,
     title: 'Zig',
     category: 'Language',
     route: '/library/zig.svg',
     url: 'https://ziglang.org/'
   },
   {
-    id: 233,
     title: 'Instatus',
     category: 'Software',
     route: {
@@ -1984,21 +1715,18 @@ export const svgs: iSVG[] = [
     url: 'https://instatus.com'
   },
   {
-    id: 6676113873388621,
     title: 'Front',
     category: 'Software',
     route: '/library/front.svg',
     url: 'https://front.com'
   },
   {
-    id: 473836,
     title: 'Monero',
     category: 'Crypto',
     route: '/library/monero.svg',
     url: 'https://www.getmonero.org/'
   },
   {
-    id: 775133760594,
     title: 'Axiom',
     category: 'Software',
     route: {
@@ -2008,21 +1736,18 @@ export const svgs: iSVG[] = [
     url: 'https://axiom.co/'
   },
   {
-    id: 382900874177765,
     title: 'ArtisanLabs',
     category: 'Software',
     route: '/library/ArtisanLabs.svg',
     url: 'https://artisanlabs.io'
   },
   {
-    id: 14839,
     title: 'Django',
     category: 'Framework',
     route: '/library/django.svg',
     url: 'https://www.djangoproject.com/'
   },
   {
-    id: 246,
     title: 'Zeabur',
     category: 'Hosting',
     route: {
@@ -2032,14 +1757,12 @@ export const svgs: iSVG[] = [
     url: 'https://zeabur.com/'
   },
   {
-    id: 247,
     title: 'MetaMask',
     category: 'Crypto',
     route: '/library/metamask.svg',
     url: 'https://metamask.io/'
   },
   {
-    id: 248,
     title: 'shadcn/ui',
     category: 'Library',
     route: {
@@ -2049,17 +1772,78 @@ export const svgs: iSVG[] = [
     url: 'https://ui.shadcn.com/'
   },
   {
-    id: 15762580,
     title: 'putio',
     category: 'Software',
     route: '/library/putio.svg',
     url: 'https://put.io/'
   },
   {
-    id: 249,
     title: 'Pinterest',
     category: 'Software',
     route: '/library/pinterest.svg',
     url: 'https://pinterest.com/'
+  },
+  {
+    title: 'Reflex',
+    category: 'Software',
+    route: {
+      light: '/library/reflex-dark.svg',
+      dark: '/library/reflex-light.svg'
+    },
+    url: 'https://reflex.dev/'
+  },
+  {
+    title: 'Stripe',
+    category: 'Software',
+    route: '/library/stripe.svg',
+    url: 'https://stripe.com/'
+  },
+  {
+    title: 'Linux',
+    category: 'Software',
+    route: '/library/linux.svg',
+    url: 'https://www.linux.org/'
+  },
+  {
+    title: 'XD',
+    category: 'Design',
+    route: '/library/adobe-xd.svg',
+    url: 'https://helpx.adobe.com/xd/get-started.html'
+  },
+  {
+    title: 'Axure',
+    category: 'Design',
+    route: '/library/axure.svg',
+    url: 'https://www.axure.com/'
+  },
+  {
+    title: 'Penpot',
+    category: 'Design',
+    route: '/library/penpot.svg',
+    url: 'https://penpot.app/'
+  },
+  {
+    title: 'Sketch',
+    category: 'Design',
+    route: '/library/sketch.svg',
+    url: 'https://www.sketch.com/'
+  },
+  {
+    title: 'Gimp',
+    category: 'Design',
+    route: '/library/gimp.svg',
+    url: 'https://www.gimp.org/'
+  },
+  {
+    title: 'Ubuntu',
+    category: 'Software',
+    route: '/library/ubuntu.svg',
+    url: 'https://ubuntu.com/'
+  },
+  {
+    title: 'Meta',
+    category: 'Social',
+    route: '/library/meta.svg',
+    url: 'https://meta.com/'
   }
 ];

src/routes/+page.svelte

@@ -12,6 +12,8 @@
   import SvgCard from '@/components/svgCard.svelte';
   import Grid from '@/components/grid.svelte';
   import NotFound from '@/components/notFound.svelte';
+
+  // Icons:
   import { ArrowDownUpIcon, ArrowUpDownIcon } from 'lucide-svelte';
 
   let sorted: boolean = false;
@@ -61,7 +63,7 @@
 
   // Sort by latest:
   const sortByLatest = () => {
-    filteredSvgs = allSvgs.sort((a: iSVG, b: iSVG) => {
+    filteredSvgs = filteredSvgs.sort((a: iSVG, b: iSVG) => {
       return b.id! - a.id!;
     });
   };

src/routes/directory/[slug]/+page.svelte

@@ -19,7 +19,7 @@
 
   if (searchTerm.length === 0) {
     filteredSvgs = svgsByCategory.sort((a: iSVG, b: iSVG) => {
-      return b.id! - a.id!;
+      return a.title.localeCompare(b.title);
     });
   }
 

src/types/svg.ts

@@ -1,7 +1,7 @@
 import type { tCategory } from './categories';
 
 export interface iSVG {
-  id: number;
+  id?: number;
   title: string;
   category: tCategory;
   route:

static/library/adobe-xd.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 240 234">
+  <path fill="#470137" d="M42.5 0h155C221 0 240 19 240 42.5v149c0 23.5-19 42.5-42.5 42.5h-155C19 234 0 215 0 191.5v-149C0 19 19 0 42.5 0z"/>
+    <path fill="#ff61f6" d="m126.2 61.5-30 49.5 32 52.5c.2.4.3.8.2 1.2-.1.4-.5.1-1.1.2h-22.9c-1.6 0-2.7-.1-3.4-1.1-2.1-4.2-4.3-8.3-6.4-12.5-2.1-4.1-4.4-8.3-6.8-12.6-2.4-4.3-4.8-8.6-7.2-13h-.2c-2.1 4.3-4.4 8.6-6.7 12.9-2.3 4.3-4.6 8.6-6.8 12.8-2.3 4.2-4.6 8.5-6.9 12.6-.4 1-1.2 1.1-2.3 1.1h-22c-.4 0-.7.2-.7-.3-.1-.4 0-.8.2-1.1l31.1-51L36 61.4c-.3-.4-.4-.8-.2-1 .2-.3.6-.4 1-.4h22.7c.5 0 1 .1 1.4.2.4.2.7.5 1 .9 1.9 4.3 4.1 8.6 6.4 12.9 2.4 4.3 4.7 8.5 7.2 12.7 2.4 4.2 4.6 8.4 6.7 12.7h.2c2.1-4.4 4.3-8.7 6.5-12.9 2.2-4.2 4.5-8.4 6.8-12.6 2.3-4.2 4.5-8.5 6.7-12.6.1-.4.3-.8.6-1 .4-.2.8-.3 1.3-.2h21.1c.5-.1 1 .2 1.1.7.1.1-.1.5-.3.7zM172.4 167c-7.4.1-14.8-1.4-21.5-4.5-6.3-2.9-11.5-7.7-15.1-13.6-3.7-6.1-5.5-13.7-5.5-22.8-.1-7.4 1.8-14.7 5.5-21.1 3.8-6.5 9.3-11.9 15.9-15.5 7-3.9 15.4-5.8 25.3-5.8.5 0 1.2 0 2.1.1.9.1 1.9.1 3.1.2V52.4c0-.7.3-1.1 1-1.1h20.3c.5-.1.9.3 1 .7v95.4c0 1.8.1 3.8.2 6 .2 2.1.3 4.1.4 5.8 0 .7-.3 1.3-1 1.6-5.2 2.2-10.7 3.8-16.3 4.8-5.1.9-10.2 1.4-15.4 1.4zm9.8-20v-44c-.9-.2-1.8-.4-2.7-.5-1.1-.1-2.2-.2-3.3-.2-3.9 0-7.8.8-11.3 2.6-3.4 1.7-6.3 4.2-8.5 7.4s-3.3 7.5-3.3 12.7c-.1 3.5.5 7 1.7 10.3 1 2.7 2.5 5.1 4.5 7.1 1.9 1.8 4.2 3.2 6.8 4 2.7.9 5.5 1.3 8.3 1.3 1.5 0 2.9-.1 4.2-.2 1.3.1 2.4-.1 3.6-.5z"/>
+</svg>

static/library/axure.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="21.705 19.44 335.589 80.057">
+  <g fill="none" fill-rule="evenodd">
+    <path fill="#272727" d="M326.63 19.441c-13.71 0-21.455 2.647-25.902 8.85-4.646 6.479-5.58 16.706-5.58 31.11 0 28.276 4.375 40.096 31.482 40.096 3.256 0 14.385-.062 20.882-.855 2.528-.419 3.66-2.355 3.66-4.087v-3.123c0-2.43-1.836-4.264-4.273-4.264h-20.27c-15.294 0-18.052-3.605-18.444-24.101v-6.635c.13-20.974 2.888-24.662 18.445-24.662 14.345 0 17.096 3.273 17.573 21.738h-22.794v12.466h29.98c5.905 0 5.905-4.13 5.905-5.486v-3.98c-.428-28.753-7.307-37.067-30.664-37.067m-39.476 1.099-.326-.086c-2.792-.587-10.422-1.013-14.205-1.013-13.387 0-20.462 5.605-20.462 16.209v59.04c0 2.43 1.7 4.128 4.137 4.128h4.762c2.437 0 4.138-1.697 4.138-4.128V36.734c0-2.617.662-4.964 8.65-4.964l11.828-.01c1.158.138 2.263-.182 3.114-.903.929-.783 1.44-1.926 1.44-3.215v-2.987c0-1.96-1.122-3.46-3.076-4.115m-57.172-.148h-4.762c-2.436 0-4.138 1.697-4.138 4.128v62.649h-19.804c-12.25 0-17.22-.779-17.22-20.303V24.52c0-2.43-1.702-4.128-4.138-4.128h-4.627c-2.436 0-4.273 1.774-4.273 4.128v42.346c0 27.748 10.064 32.631 31.21 32.631 7.607 0 18.025 0 27.96-1.399l.23-.046c2.454-.613 3.699-2.018 3.699-4.176V24.52c0-2.43-1.702-4.128-4.137-4.128"/>
+    <path fill="#74bb11" d="M156.332 22.331c-.611-1.3-1.922-2.075-3.506-2.075h-6.121c-1.778 0-3.107.716-3.807 2.005l-9.072 13.255 7.942 10.861 13.866-19.89c1.522-1.849.995-3.523.698-4.156"/>
+    <path fill="#009cd9" d="m108.505 22.11-.008-.012c-1.383-1.843-3.223-1.843-3.828-1.843h-5.987c-1.534 0-2.79.705-3.446 1.932-.675 1.257-.532 2.767.402 4.166l22.179 30.746-25.504 35.572c-.891 1.338-1.016 2.825-.343 4.081.66 1.227 1.917 1.93 3.448 1.93h6.12c1.574 0 2.958-.817 3.65-2.104l28.547-39.337z"/>
+    <path fill="#eb2084" d="m159.377 92.982-17.794-24.42-7.827 10.79 14.072 18.781.366.16a4.416 4.416 0 0 0 1.775.388h5.985c1.446 0 2.673-.642 3.368-1.764.712-1.15.732-2.583.055-3.935"/>
+    <path fill="#272727" d="M68.774 65.43v20.738c-6.06.93-15.297 1.136-18.445 1.136-13.926 0-15.452-3.805-15.452-11.886 0-7.562 2.83-9.989 11.643-9.989zM49.649 19.44c-4.303 0-10.171.112-17.472.99l-.33.073c-2.127.605-3.204 2.002-3.204 4.152v2.986c0 2.546 1.585 4.128 4.137 4.128h16.87c13.583 0 19.124 3.68 19.124 12.701v8.767H46.52c-17.393 0-24.815 6.633-24.815 22.18 0 17.328 7.682 24.08 27.4 24.08 7.987 0 22.689-.621 28.123-2.278 4.582-1.272 4.582-4.772 4.582-5.922v-47.64c0-16.295-10.52-24.217-32.16-24.217z"/>
+  </g>
+</svg>

static/library/gimp.svg

@@ -0,0 +1,97 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.0" viewBox="0 0 48 48">
+  <defs>
+    <path id="s" fill="#2e3436" fill-rule="evenodd" stroke="#000" stroke-miterlimit="10" stroke-width="1.17391276" d="M24.041631 21.837049a2.2980971 2.2980971 0 1 1-4.596194 0 2.2980971 2.2980971 0 1 1 4.596194 0z" overflow="visible" style="marker:none"/>
+    <path id="u" fill="#fff" fill-rule="evenodd" d="M23.157747 20.953165a1.767767 1.767767 0 1 1-3.535534 0 1.767767 1.767767 0 1 1 3.535534 0z" overflow="visible" style="marker:none"/>
+    <path id="z" fill="#fff" d="M8.8749989 37.75a1.2499999 1.2499999 0 1 1-2.4999997 0 1.2499999 1.2499999 0 1 1 2.4999997 0z" opacity=".52777782" overflow="visible" style="marker:none"/>
+  </defs>
+  <defs>
+    <linearGradient id="k">
+      <stop offset="0" stop-color="#5b676b"/>
+      <stop offset="1" stop-color="#141718"/>
+    </linearGradient>
+    <linearGradient id="f">
+      <stop offset="0"/>
+      <stop offset="1" stop-opacity="0"/>
+    </linearGradient>
+    <linearGradient id="e">
+      <stop offset="0" stop-color="#fff"/>
+      <stop offset="1" stop-color="#fff" stop-opacity="0"/>
+    </linearGradient>
+    <linearGradient id="a">
+      <stop offset="0" stop-color="#fff"/>
+      <stop offset="1" stop-color="#fff" stop-opacity="0"/>
+    </linearGradient>
+    <linearGradient xlink:href="#a" id="A" x1="13.236155" x2="7.7521091" y1="37.752247" y2="42.282146" gradientTransform="rotate(27.62097 -26.24365974 -49.44033909) scale(.852298)" gradientUnits="userSpaceOnUse"/>
+    <linearGradient id="h">
+      <stop offset="0" stop-color="#696969"/>
+      <stop offset="1"/>
+    </linearGradient>
+    <linearGradient id="b">
+      <stop offset="0" stop-color="#bdbdbd"/>
+      <stop offset=".33333334" stop-color="#e2e2e2"/>
+      <stop offset=".66666669" stop-color="#a3a3a3"/>
+      <stop offset="1" stop-color="#ddd"/>
+    </linearGradient>
+    <linearGradient xlink:href="#b" id="x" x1="19.394735" x2="23.109331" y1="30.001331" y2="33.438831" gradientTransform="translate(-46.40695 -1.802856)" gradientUnits="userSpaceOnUse"/>
+    <linearGradient id="c">
+      <stop offset="0" stop-color="#6e3d09"/>
+      <stop offset=".24242425" stop-color="#ea8113"/>
+      <stop offset=".62121212" stop-color="#5c3307"/>
+      <stop offset="1" stop-color="#e07c12"/>
+    </linearGradient>
+    <linearGradient xlink:href="#c" id="w" x1="37.017639" x2="27.753893" y1="19.239889" y2="11.182488" gradientTransform="translate(-49.30496 1.877723)" gradientUnits="userSpaceOnUse"/>
+    <linearGradient id="l">
+      <stop offset="0" stop-color="#857c63"/>
+      <stop offset="1" stop-color="#221f19"/>
+    </linearGradient>
+    <linearGradient id="j">
+      <stop offset="0"/>
+      <stop offset="1" stop-opacity="0"/>
+    </linearGradient>
+    <linearGradient id="g">
+      <stop offset="0"/>
+      <stop offset="1" stop-opacity="0"/>
+    </linearGradient>
+    <linearGradient id="i">
+      <stop offset="0" stop-color="#fff"/>
+      <stop offset="1" stop-color="#b9b9b0"/>
+    </linearGradient>
+    <linearGradient id="d">
+      <stop offset="0" stop-color="#fff"/>
+      <stop offset="1" stop-color="#fff" stop-opacity="0"/>
+    </linearGradient>
+    <linearGradient xlink:href="#d" id="t" x1="6.3051529" x2="5.9846287" y1="23.362427" y2="31.57" gradientUnits="userSpaceOnUse"/>
+    <linearGradient xlink:href="#e" id="p" x1="14.96875" x2="39.524544" y1="19.110678" y2="46.98568" gradientUnits="userSpaceOnUse"/>
+    <linearGradient xlink:href="#f" id="B" x1="26.162951" x2="24.328892" y1="30.543303" y2="30.985245" gradientUnits="userSpaceOnUse"/>
+    <linearGradient xlink:href="#g" id="o" x1="32.350136" x2="21.213203" y1="28.083355" y2="30.293064" gradientTransform="translate(-3.836549 .345971)" gradientUnits="userSpaceOnUse"/>
+    <radialGradient xlink:href="#h" id="y" cx="15.415101" cy="35.356506" r="7.5791559" fx="15.415101" fy="35.356506" gradientTransform="matrix(1.572694 0 0 1.532639 -55.36682 -21.35823)" gradientUnits="userSpaceOnUse"/>
+    <radialGradient xlink:href="#i" id="v" cx="69.473244" cy="19.597878" r="3.5153139" fx="69.473244" fy="19.597878" gradientTransform="translate(-22.1264 -6.241691) scale(1.318488)" gradientUnits="userSpaceOnUse"/>
+    <radialGradient xlink:href="#j" id="m" cx="23" cy="33.9375" r="18.25" fx="23" fy="33.9375" gradientTransform="matrix(1 0 0 .284247 0 24.29088)" gradientUnits="userSpaceOnUse"/>
+    <radialGradient xlink:href="#k" id="r" cx="6.0242186" cy="25.271027" r="4.8310289" fx="6.0242186" fy="25.271027" gradientTransform="matrix(.916159 .09318684 -.108765 1.069309 3.253668 -3.029272)" gradientUnits="userSpaceOnUse"/>
+    <radialGradient xlink:href="#l" id="n" cx="18.557627" cy="22.300018" r="19.2292" fx="18.557627" fy="22.300018" gradientTransform="matrix(1.77275 0 0 1.29668 -16.3404 -6.615959)" gradientUnits="userSpaceOnUse"/>
+    <radialGradient xlink:href="#i" id="q" cx="69.473244" cy="19.597878" r="3.5153139" fx="69.473244" fy="19.597878" gradientTransform="translate(-22.1264 -6.241691) scale(1.318488)" gradientUnits="userSpaceOnUse"/>
+  </defs>
+  <g color="#000">
+    <path fill="url(#m)" fill-rule="evenodd" d="M41.25 33.9375a18.25 5.1875 0 1 1-36.5 0 18.25 5.1875 0 1 1 36.5 0z" overflow="visible" style="marker:none" transform="matrix(1 0 0 1.53012 .125 -19.99096)"/>
+    <path fill="url(#n)" fill-rule="evenodd" stroke="#2e3436" stroke-miterlimit="10" stroke-width=".9999997" d="M10.374369 12.467884s2.874509 5.927634 9.599242 5.760407c14.092515-.353553 16.563709-7.70495 16.917262-8.7656106.353554-1.0606602.894534-.8999979 1.019607.0802666 4.596194 41.7193-31.8969312 23.819176-33.1929656 16.71352 7.2478446-2.12132 5.4800776-6.187185 5.4800776-6.187185l.176777-7.601398z" overflow="visible" style="marker:none"/>
+    <path fill="url(#o)" fill-rule="evenodd" d="M15.73779 30.066049c6.7389 1.347837 10.170691.098093 12.179175-1.452776-.53033-.68501-1.43631-1.436311-1.43631-1.436311s2.353317.653942 3.18198 1.723573c.82629 1.066568.306808 1.723707.090561 3.08837-.481411-1.198599-1.379981-1.648092-1.501634-2.124332-1.806268 2.496927-6.306442 2.3932-12.513772.201476z" overflow="visible" style="marker:none"/>
+    <path fill="none" stroke="url(#p)" stroke-miterlimit="10" stroke-width=".9999997" d="M36.96875 11.84375c-.561978.926895-1.406492 2.033166-2.6875 3.09375C31.649332 17.116542 27.230687 19.099847 20 19.28125c-4.224373.105049-6.952741-1.934149-8.625-3.75L11.25 20c.136107.418802.415455 1.390498-.0625 2.71875-.514314 1.429296-2.154514 2.891363-4.96875 4 .2503304.522033.4954845 1.04362 1.25 1.78125 1.0279503 1.004945 2.4570333 2.088049 4.15625 3.0625 3.398433 1.948902 7.801583 3.493212 11.90625 3.5625 4.104667.069288 7.857126-1.23455 10.4375-5 2.378744-3.471218 3.682473-9.347943 3-18.28125z" opacity=".18539327" overflow="visible" style="marker:none"/>
+    <path fill="url(#q)" fill-rule="evenodd" stroke="#888a85" stroke-miterlimit="10" stroke-width=".78260845" d="M72.655224 21.837049a3.1819806 3.1819806 0 1 1-6.363961 0 3.1819806 3.1819806 0 1 1 6.363961 0z" overflow="visible" style="marker:none" transform="translate(-75.12661 -6.507784) scale(1.277778)"/>
+    <path fill="url(#r)" fill-rule="evenodd" stroke="#000" stroke-miterlimit="10" stroke-width=".9999997" d="M10.429825 27.228739a4.3310289 6.0987959 0 1 1-8.662058 0 4.3310289 6.0987959 0 1 1 8.662058 0z" overflow="visible" style="marker:none" transform="rotate(-35.80785 3.36287611 26.34483917)"/>
+    <use xlink:href="#s" fill-rule="evenodd" stroke-miterlimit="10" stroke-width="1.17391276" overflow="visible" style="marker:none" transform="translate(-3.926759 3.395528) scale(.851852)"/>
+    <path fill="none" stroke="url(#t)" stroke-miterlimit="10" stroke-width="1.00000012" d="M6.09375 22.15625c-.7982492 0-1.5531304.446171-2.1875 1.34375-.6343696.897579-1.09375 2.234204-1.09375 3.71875s.4593804 2.821171 1.09375 3.71875c.6343696.897579 1.3892511 1.34375 2.1875 1.34375.7982492 0 1.5772839-.476389 2.21875-1.375.6414661-.898611 1.09375-2.206186 1.09375-3.6875 0-1.481314-.4522838-2.788889-1.09375-3.6875-.6414662-.898611-1.4205011-1.375-2.21875-1.375z" opacity=".28089887" overflow="visible" style="marker:none" transform="rotate(-36.83273 3.36645406 26.60031137)"/>
+    <path fill="#fff" fill-rule="evenodd" d="M5.833631 23.251263a1.767767 2.1213202 0 1 1-3.5355339 0 1.767767 2.1213202 0 1 1 3.5355339 0z" overflow="visible" style="marker:none"/>
+    <use xlink:href="#u" fill-rule="evenodd" overflow="visible" style="marker:none" transform="translate(-2.556414 5.029841) scale(.766666)"/>
+    <path fill="url(#v)" fill-rule="evenodd" stroke="#888a85" stroke-miterlimit="10" stroke-width=".66666645" d="M72.655224 21.837049a3.1819806 3.1819806 0 1 1-6.363961 0 3.1819806 3.1819806 0 1 1 6.363961 0z" overflow="visible" style="marker:none" transform="matrix(1.5 0 0 1.5 -82.16821 -10.91852)"/>
+    <use xlink:href="#s" fill-rule="evenodd" stroke-miterlimit="10" stroke-width=".9999997" overflow="visible" style="marker:none" transform="translate(1.414216 .707108)"/>
+    <use xlink:href="#u" fill-rule="evenodd" overflow="visible" style="marker:none" transform="matrix(.9 0 0 .9 3.022883 2.625648)"/>
+    <path fill="url(#w)" stroke="#673907" stroke-linecap="round" stroke-width="2.46045303" d="m-23.364209 23.568336 3.710098 3.469175C-11.307128 20.656664-2.5600338 6.9381374-2.5600338 6.9381374c1.97631487-2.2424123-.1169199-3.7504826-2.1649066-2.3979188 0 0-12.9703626 10.1148664-18.6392686 19.0281174z" overflow="visible" style="marker:none" transform="matrix(-.114852 -.389864 .389864 -.114852 24.71507 29.68942)"/>
+    <path fill="url(#x)" stroke="#888a85" stroke-linecap="round" stroke-width="2.46045303" d="m-30.449715 32.813894 2.24632 1.93382 8.492766-7.367031.275061-.705828 1.094405-.017815c-.4375-1.5625-2.941514-4.383455-4.816514-4.383455l.082019 1.090075-.669991.380027-6.704066 9.070207z" overflow="visible" style="marker:none" transform="matrix(-.114852 -.389864 .389864 -.114852 24.71507 29.68942)"/>
+    <path fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.46045327" d="m-23.801371 28.376767-4.364933 5.266471" overflow="visible" style="marker:none" transform="matrix(-.114852 -.389864 .389864 -.114852 24.71507 29.68942)"/>
+    <path fill="url(#y)" d="M-45.341208 42.769835c10.443958 0 18.370039 1.24373 19.870605-6.354738 1.209249-6.123314-7.210534-9.057368-11.38287-3.590861-4.019277 5.265971-8.487735 9.945599-8.487735 9.945599z" overflow="visible" style="marker:none" transform="matrix(-.114852 -.389864 .389864 -.114852 24.71507 29.68942)"/>
+    <use xlink:href="#z" opacity=".52777782" overflow="visible" style="marker:none" transform="rotate(-106.414712 26.2449128 20.83923957) scale(.84126959)"/>
+    <use xlink:href="#z" overflow="visible" style="marker:none" transform="rotate(-106.414712 26.04110726 15.7329477) scale(.56764745)"/>
+    <path fill="url(#A)" d="M-38.543723 40.909242s3.72152.0943 6.116538-1.411995c.847351-.532923 1.515774.649985.493819 1.087367-2.207394.944732-6.610357.324628-6.610357.324628z" opacity=".42777776" overflow="visible" style="marker:none" transform="matrix(-.114852 -.389864 .389864 -.114852 24.71507 29.68942)"/>
+    <path fill="url(#B)" fill-rule="evenodd" d="M23.003067 31.736544c1.497372.143092 2.849629-.272213 3.411893-.474047.098225-.555386.536552-1.621257 2.046088-1.691468l-.53033-.928077s-1.966641 1.347921-4.065864 1.745669l-.861787 1.347923z" overflow="visible" style="marker:none"/>
+  </g>
+</svg>

static/library/penpot.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 261.92187 345.94141">
+  <path d="m-68.324219 280.3457-36.376951 51.23633v28.96289l-31.65625 15.05664-.28516-.13476v188.95312l123.417971 58.30664 7.5429684 3.56055 7.5410156-3.56055L125.2793 564.41992V375.4668l-.23242.10937-31.666021-15.06055v-28.93359l-1.107421-1.55859-35.271485-49.67774-36.378906 51.23633v.0508l-26.4707032-37.28125-26.2656248 36.99414-.939453-1.32226-35.271485-49.67774zm6.435547 29.76172 14.070313 19.81641h-41.011719l13.90625-19.58399 13.035156-.23242zm125.326172 0 14.070312 19.81641H36.496094l13.904297-19.58399 13.037109-.23242zM.58789062 324.11523 14.658203 343.92969h-41.009765l13.904296-19.58399 13.03515662-.23047zM-92.71875 339.91016h19.451172v65.49609l-19.451172-9.18945v-56.30664zm29.4375 0h19.353516l-.002 79.35546-19.353515-9.14257.002-70.21289zm95.886719 0h19.453125l-.002 70.14648-19.449219 9.1875-.002-79.33398zm29.4375 0h19.353515v56.28515l-19.353515 9.14258v-65.42773zm-92.285157 14.00586h19.451172v81.0039l-19.451172-9.18945v-71.81445zm29.4375005 0H18.548828l-.002 71.9707-19.35351562 9.14453.001953-81.11523zm94.1835935 21.52539 17.125004 7.00195-17.125004 8.08984v-15.09179zm-198.080076.0254v15.08984l-17.12305-8.08984 17.12305-7zm-16.85938 23.80859 108.335941 51.17773v155.58985l-108.335941-51.17774V399.2754zm231.75586 0v155.58984L1.859375 606.04298V450.45313L110.19531 399.2754z" color="#000" font-family="sans-serif" font-weight="400" overflow="visible" style="line-height:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;block-progression:tb;white-space:normal;isolation:auto;mix-blend-mode:normal;solid-color:#000;solid-opacity:1" transform="translate(136.64258 -280.3457)"/>
+</svg>

static/library/reflex-dark.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="56" height="12" viewBox="0 0 56 12" fill="none">
+<path d="M0 11.6V0.400024H8.96V4.88002H6.72V2.64002H2.24V4.88002H6.72V7.12002H2.24V11.6H0ZM6.72 11.6V7.12002H8.96V11.6H6.72Z" fill="#110F1F"/>
+<path d="M11.2 11.6V0.400024H17.92V2.64002H13.44V4.88002H17.92V7.12002H13.44V9.36002H17.92V11.6H11.2Z" fill="#110F1F"/>
+<path d="M20.16 11.6V0.400024H26.88V2.64002H22.4V4.88002H26.88V7.12002H22.4V11.6H20.16Z" fill="#110F1F"/>
+<path d="M29.12 11.6V0.400024H31.36V9.36002H35.84V11.6H29.12Z" fill="#110F1F"/>
+<path d="M38.08 11.6V0.400024H44.8V2.64002H40.32V4.88002H44.8V7.12002H40.32V9.36002H44.8V11.6H38.08Z" fill="#110F1F"/>
+<path d="M47.04 4.88002V0.400024H49.28V4.88002H47.04ZM53.76 4.88002V0.400024H56V4.88002H53.76ZM49.28 7.12002V4.88002H53.76V7.12002H49.28ZM47.04 11.6V7.12002H49.28V11.6H47.04ZM53.76 11.6V7.12002H56V11.6H53.76Z" fill="#110F1F"/>
+</svg>

static/library/reflex-light.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="56" height="12" viewBox="0 0 56 12" fill="none">
+<path d="M0 11.6V0.400024H8.96V4.88002H6.72V2.64002H2.24V4.88002H6.72V7.12002H2.24V11.6H0ZM6.72 11.6V7.12002H8.96V11.6H6.72Z" fill="white"/>
+<path d="M11.2 11.6V0.400024H17.92V2.64002H13.44V4.88002H17.92V7.12002H13.44V9.36002H17.92V11.6H11.2Z" fill="white"/>
+<path d="M20.16 11.6V0.400024H26.88V2.64002H22.4V4.88002H26.88V7.12002H22.4V11.6H20.16Z" fill="white"/>
+<path d="M29.12 11.6V0.400024H31.36V9.36002H35.84V11.6H29.12Z" fill="white"/>
+<path d="M38.08 11.6V0.400024H44.8V2.64002H40.32V4.88002H44.8V7.12002H40.32V9.36002H44.8V11.6H38.08Z" fill="white"/>
+<path d="M47.04 4.88002V0.400024H49.28V4.88002H47.04ZM53.76 4.88002V0.400024H56V4.88002H53.76ZM49.28 7.12002V4.88002H53.76V7.12002H49.28ZM47.04 11.6V7.12002H49.28V11.6H47.04ZM53.76 11.6V7.12002H56V11.6H53.76Z" fill="white"/>
+</svg>

static/library/sketch.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" color="#000" viewBox="0 0 32 32">
+  <path fill="currentcolor" fill-rule="evenodd" d="m.38 11.986 6.412-8.704a.8.8 0 0 1 .556-.32l8.564-.952a.8.8 0 0 1 .176 0l8.564.951a.8.8 0 0 1 .556.32l6.413 8.705a.8.8 0 0 1-.04.997L16.455 30.475a.6.6 0 0 1-.908 0L.418 12.983a.8.8 0 0 1-.039-.997zm17.826-7.403 6.047 5.712a.4.4 0 0 0 .674-.32l-.29-4.054a.2.2 0 0 1 .392-.07l1.326 4.642a1 1 0 0 0 .645.674l2.83.943a.2.2 0 0 1-.062.39h-2.72a1 1 0 0 0-.843.463l-7.414 11.65a.3.3 0 0 1-.523-.291l5.314-10.96a.6.6 0 0 0-.54-.862H8.958a.6.6 0 0 0-.54.862l5.314 10.96a.3.3 0 0 1-.523.292l-7.414-11.65a1 1 0 0 0-.844-.464H2.148a.2.2 0 0 1-.062-.39l2.908-.945a1 1 0 0 0 .652-.677l1.325-4.637a.2.2 0 0 1 .392.07l-.29 4.054a.4.4 0 0 0 .674.32l6.047-5.712a.2.2 0 0 1 .293.272L10.03 9.848a.4.4 0 0 0 .31.652h11.32a.4.4 0 0 0 .31-.652l-4.057-4.993a.2.2 0 0 1 .293-.272z"/>
+</svg>

static/library/stripe.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="76.57" height="32" viewBox="0 0 512 214"><path fill="#635BFF" d="M512 110.08c0-36.409-17.636-65.138-51.342-65.138c-33.85 0-54.33 28.73-54.33 64.854c0 42.808 24.179 64.426 58.88 64.426c16.925 0 29.725-3.84 39.396-9.244v-28.445c-9.67 4.836-20.764 7.823-34.844 7.823c-13.796 0-26.027-4.836-27.591-21.618h69.547c0-1.85.284-9.245.284-12.658m-70.258-13.511c0-16.071 9.814-22.756 18.774-22.756c8.675 0 17.92 6.685 17.92 22.756zm-90.31-51.627c-13.939 0-22.899 6.542-27.876 11.094l-1.85-8.818h-31.288v165.83l35.555-7.537l.143-40.249c5.12 3.698 12.657 8.96 25.173 8.96c25.458 0 48.64-20.48 48.64-65.564c-.142-41.245-23.609-63.716-48.498-63.716m-8.534 97.991c-8.391 0-13.37-2.986-16.782-6.684l-.143-52.765c3.698-4.124 8.818-6.968 16.925-6.968c12.942 0 21.902 14.506 21.902 33.137c0 19.058-8.818 33.28-21.902 33.28M241.493 36.551l35.698-7.68V0l-35.698 7.538zm0 10.809h35.698v124.444h-35.698zm-38.257 10.524L200.96 47.36h-30.72v124.444h35.556V87.467c8.39-10.951 22.613-8.96 27.022-7.396V47.36c-4.551-1.707-21.191-4.836-29.582 10.524m-71.112-41.386l-34.702 7.395l-.142 113.92c0 21.05 15.787 36.551 36.836 36.551c11.662 0 20.195-2.133 24.888-4.693V140.8c-4.55 1.849-27.022 8.391-27.022-12.658V77.653h27.022V47.36h-27.022zM35.982 83.484c0-5.546 4.551-7.68 12.09-7.68c10.808 0 24.461 3.272 35.27 9.103V51.484c-11.804-4.693-23.466-6.542-35.27-6.542C19.2 44.942 0 60.018 0 85.192c0 39.252 54.044 32.995 54.044 49.92c0 6.541-5.688 8.675-13.653 8.675c-11.804 0-26.88-4.836-38.827-11.378v33.849c13.227 5.689 26.596 8.106 38.827 8.106c29.582 0 49.92-14.648 49.92-40.106c-.142-42.382-54.329-34.845-54.329-50.774"/></svg>

static/library/ubuntu.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 100 100"><circle cx="50" cy="50" r="45" fill="#f47421"/><circle cx="50" cy="50" r="21.8" fill="none" stroke="#fff" stroke-width="8.6"/><g id="a"><circle cx="19.4" cy="50" r="8.4" fill="#f47421"/><path stroke="#f47421" stroke-width="3.2" d="M67 50h10"/><circle cx="19.4" cy="50" r="6" fill="#fff"/></g><use xlink:href="#a" transform="rotate(120 50 50)"/><use xlink:href="#a" transform="rotate(240 50 50)"/></svg>

tailwind.config.cjs

@@ -16,5 +16,14 @@ module.exports = {
       }
     }
   },
-  plugins: [require('@tailwindcss/typography')]
+  plugins: [
+    require('@tailwindcss/typography'),
+    ({ addUtilities }) => {
+      addUtilities({
+        '.text-balance': {
+          'text-wrap': 'balance'
+        }
+      });
+    }
+  ]
 };