diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md new file mode 100644 index 0000000..c860dd5 --- /dev/null +++ b/.github/PULL_REQUEST_TEMPLATE.md @@ -0,0 +1,16 @@ +## 📝 About your SVG: + +- **Title**: +- **Category**: +- **Website URL**: +- **Description**: + +## 📷 Screenshots: + +✨ Add screenshots of the logo. + +## ✅ Checklist + +- [ ] I have permission to use this logo. +- [ ] The ``.svg`` file is optimized for web use. +- [ ] The ``.svg`` size is less than **20kb**. diff --git a/README.md b/README.md index 7485fdb..3dd28ed 100644 --- a/README.md +++ b/README.md @@ -10,7 +10,7 @@ Discover  ✦  - + Request logo  ✦  @@ -138,6 +138,19 @@ pnpm install } ``` +- **Add brand guidelines**: + +```json +{ + "title": "Title", + "category": "Category", + "route": "/library/your_logo.svg", + "wordmark": "/library/your_logo_wordmark.svg", + "brandUrl": "https://assets.website.com/brand-guidelines", + "url": "Website" +} +``` + > [!NOTE] > > - The list of categories is here: [`src/types/categories.ts`](https://github.com/pheralb/svgl/blob/main/src/types/categories.ts). You can add a new category if you need it. diff --git a/src/app.css b/src/app.css index f85c976..0f54e63 100644 --- a/src/app.css +++ b/src/app.css @@ -72,3 +72,12 @@ src: url('/fonts/GeistMonoVariableVF.woff2') format('woff2'); font-display: swap; } + +html.dark .shiki, +html.dark .shiki span { + color: var(--shiki-dark) !important; + background-color: transparent !important; + font-style: var(--shiki-dark-font-style) !important; + font-weight: var(--shiki-dark-font-weight) !important; + text-decoration: var(--shiki-dark-text-decoration) !important; +} diff --git a/src/components/copySvg.svelte b/src/components/copySvg.svelte index 80f0746..526319d 100644 --- a/src/components/copySvg.svelte +++ b/src/components/copySvg.svelte @@ -15,11 +15,13 @@ import { buttonStyles } from '@/ui/styles'; import { cn } from '@/utils/cn'; import { componentTemplate } from '@/utils/componentTemplate'; + import { generateAngularComponent } from '@/utils/generateAngularComponent'; //Icons: import ReactIcon from './icons/reactIcon.svelte'; import VueIcon from './icons/vueIcon.svelte'; import SvelteIcon from './icons/svelteIcon.svelte'; + import AngularIcon from './icons/angularIcon.svelte'; // Props: export let iconSize = 24; @@ -163,6 +165,33 @@ toast.error(`Failed to copy ${framework} component`); } }; + + // Copy SVG as Standalone Angular component: + const convertSvgAngularComponent = async () => { + isLoading = true; + optionsOpen = false; + + const title = svgInfo.title.split(' ').join(''); + const svgUrlToCopy = getSvgUrl(); + const content = await getSvgContent(svgUrlToCopy); + + if (!content) { + toast.error('Failed to fetch the SVG content', { + duration: 5000 + }); + isLoading = false; + return; + } + + const angularComponent = generateAngularComponent(content, title); + await clipboard(angularComponent); + + toast.success(`Copied as Standalone Angular component`, { + description: `${svgInfo.title} - ${svgInfo.category}` + }); + + isLoading = false; + }; (optionsOpen = isOpen)}> @@ -185,6 +214,7 @@ React Vue Svelte + Angular
@@ -265,6 +295,27 @@
+ +
+ +
+ +
+

+ Remember to request permission from the creators for the use of the SVG. Modification is not + allowed. +

+
diff --git a/src/components/icons/angularIcon.svelte b/src/components/icons/angularIcon.svelte new file mode 100644 index 0000000..361850a --- /dev/null +++ b/src/components/icons/angularIcon.svelte @@ -0,0 +1,46 @@ + + + + + diff --git a/src/components/svgCard.svelte b/src/components/svgCard.svelte index 078370b..09cc8ab 100644 --- a/src/components/svgCard.svelte +++ b/src/components/svgCard.svelte @@ -13,7 +13,8 @@ Sparkles, EllipsisIcon, TagIcon, - XIcon + XIcon, + PaletteIcon } from 'lucide-svelte'; // Components & styles: @@ -57,8 +58,10 @@ let maxVisibleCategories = 1; let moreTagsOptions = false; - // Global Images Styles: + // Global Styles: const globalImageStyles = 'mb-4 mt-2 h-10 select-none pointer-events-none'; + const btnStyles = + 'flex items-center space-x-2 rounded-md p-2 duration-100 hover:bg-neutral-200 dark:hover:bg-neutral-700/40';
@@ -200,7 +203,7 @@ title="Website" target="_blank" rel="noopener noreferrer" - class="flex items-center space-x-2 rounded-md p-2 duration-100 hover:bg-neutral-200 dark:hover:bg-neutral-700/40" + class={btnStyles} > @@ -210,7 +213,7 @@ on:click={() => { wordmarkSvg = !wordmarkSvg; }} - class="flex items-center space-x-2 rounded-md p-2 duration-100 hover:bg-neutral-200 dark:hover:bg-neutral-700/40" + class={btnStyles} > {#if wordmarkSvg} @@ -219,5 +222,16 @@ {/if} {/if} + {#if svgInfo.brandUrl !== undefined} + + + + {/if}
diff --git a/src/components/warning.svelte b/src/components/warning.svelte index 8a7b9a3..dd3e224 100644 --- a/src/components/warning.svelte +++ b/src/components/warning.svelte @@ -5,28 +5,28 @@ import { cn } from '@/utils/cn'; let warning = false; - let warningName = 'svgl_warning_message'; + let warningName = 'svgl_warn_message'; const initialValue = browser ? window.localStorage.getItem(warningName) : true; {#if !warning && !initialValue}

All SVGs include links to the respective products or companies that own them. Please contact the owner directly if you intend to use their logo.Please contact the owner directly if you need to use their logo. - If you are the owner of an SVG and prefer it not to be displayed here, + If you are the owner of an SVG and would like it removed, create an issue on GitHub.

diff --git a/src/data/svgs.ts b/src/data/svgs.ts index a4469d2..2cd4ab6 100644 --- a/src/data/svgs.ts +++ b/src/data/svgs.ts @@ -1,6 +1,13 @@ import type { iSVG } from '../types/svg'; export const svgs: iSVG[] = [ + { + title: 'PayPal', + category: 'Payment', + route: '/library/paypal.svg', + wordmark: '/library/paypal-wordmark.svg', + url: 'https://paypal.com' + }, { title: 'Google Drive', category: 'Google', @@ -214,7 +221,7 @@ export const svgs: iSVG[] = [ }, { title: 'JWT', - category: 'Library', + category: ['Library', 'Authentication'], route: '/library/jwt.svg', url: 'https://jwt.io/' }, @@ -239,7 +246,7 @@ export const svgs: iSVG[] = [ }, { title: 'WorkOS', - category: 'Software', + category: ['Software', 'Authentication'], route: { light: '/library/workos.svg', dark: '/library/workos-light.svg' @@ -575,7 +582,7 @@ export const svgs: iSVG[] = [ }, { title: 'Twilio', - category: 'Software', + category: ['Software', 'Authentication'], route: '/library/twilio.svg', url: 'https://twilio.com' }, @@ -615,7 +622,7 @@ export const svgs: iSVG[] = [ }, { title: 'Authy', - category: 'Software', + category: ['Software', 'Authentication'], route: '/library/authy.svg', url: 'https://authy.com/' }, @@ -736,7 +743,10 @@ export const svgs: iSVG[] = [ { title: 'Amazon Web Services', category: 'Software', - route: '/library/aws.svg', + route: { + light: '/library/aws_light.svg', + dark: '/library/aws_dark.svg' + }, url: 'https://aws.amazon.com/' }, { @@ -810,7 +820,7 @@ export const svgs: iSVG[] = [ }, { title: 'Auth0', - category: 'Library', + category: ['Library', 'Authentication'], route: '/library/auth0.svg', url: 'https://auth0.com/' }, @@ -1070,11 +1080,17 @@ export const svgs: iSVG[] = [ url: 'https://es.wikipedia.org/wiki/HTML5' }, { - title: 'CSS', + title: 'CSS (New)', category: 'Language', route: '/library/css.svg', url: 'https://es.wikipedia.org/wiki/CSS' }, + { + title: 'CSS', + category: 'Language', + route: '/library/css_old.svg', + url: 'https://es.wikipedia.org/wiki/CSS' + }, { title: 'midudev', category: 'Community', @@ -1399,6 +1415,13 @@ export const svgs: iSVG[] = [ route: '/library/webkit.svg', url: 'https://webkit.org/' }, + { + title: 'DuckDuckGo', + category: ['Software', 'Browser'], + route: '/library/duckduckgo.svg', + wordmark: '/library/duckduckgo-wordmark.svg', + url: 'https://duckduckgo.com/' + }, { title: 'Gemini', category: ['Google', 'AI'], @@ -2644,6 +2667,7 @@ export const svgs: iSVG[] = [ light: '/library/vercel_wordmark.svg', dark: '/library/vercel_wordmark_dark.svg' }, + brandUrl: 'https://vercel.com/geist/brands', url: 'https://vercel.com/' }, { @@ -3049,6 +3073,147 @@ export const svgs: iSVG[] = [ }, url: 'https://polar.sh/' }, + { + title: 'bolt', + category: 'Devtool', + route: { + light: '/library/bolt-new.svg', + dark: '/library/bolt-new_dark.svg' + }, + url: 'https://bolt.new/' + }, + { + title: 'JSON', + category: 'Language', + route: '/library/json.svg', + url: 'https://json.org/' + }, + { + title: 'nuqs', + category: 'Library', + route: { + light: '/library/nuqs.svg', + dark: '/library/nuqs_dark.svg' + }, + wordmark: { + light: '/library/nuqs-wordmark.svg', + dark: '/library/nuqs-wordmark_dark.svg' + }, + url: 'https://nuqs.47ng.com/' + }, + { + title: 'SoundCloud', + category: 'Music', + route: { + light: '/library/soundcloud-logo.svg', + dark: '/library/soundcloud-logo_dark.svg' + }, + wordmark: { + light: '/library/soundcloud-wordmark.svg', + dark: 'library/soundcloud-wordmark_dark.svg' + }, + url: 'https://soundcloud.com/' + }, + { + title: 'Clerk', + category: ['Software', 'Authentication'], + route: { + light: '/library/clerk-light.svg', + dark: '/library/clerk-dark.svg' + }, + url: 'https://clerk.com/' + }, + { + title: 'Mermaid', + category: ['Library'], + route: { + light: '/library/mermaid-logo-light.svg', + dark: '/library/mermaid-logo-dark.svg' + }, + url: 'https://mermaid.js.org/' + }, + { + title: 'Home Assistant', + category: ['IoT', 'Home Automation', 'Software'], + route: '/library/home-assistant.svg', + wordmark: { + light: '/library/home-assistant-wordmark.svg', + dark: '/library/home-assistant-wordmark-dark.svg' + }, + url: 'https://github.com/home-assistant/assets/tree/master/logo' + }, + { + title: 'UXAnaRangel', + category: ['Community'], + route: { + light: '/library/uxanarangel-light.svg', + dark: '/library/uxanarangel-dark.svg' + }, + url: 'https://uxanarangel.com/' + }, + { + title: 'UXCorpRangel', + category: ['Community'], + route: { + light: '/library/uxcorprangel-light.svg', + dark: '/library/uxcorprangel-dark.svg' + }, + url: 'https://github.com/UXCorpRangel/' + }, + { + title: 'PostHog', + category: 'Devtool', + route: '/library/posthog.svg', + wordmark: { + light: '/library/posthog-wordmark.svg', + dark: '/library/posthog-wordmark_dark.svg' + }, + url: 'https://posthog.com/' + }, + { + title: 'Lottielab', + category: 'Design', + route: '/library/lottielab.svg', + url: 'https://www.lottielab.com/' + }, + { + title: 'TanStack', + category: ['Software', 'Library'], + route: '/library/tanstack.svg', + url: 'https://tanstack.com/' + }, + { + title: 'TypeGPU', + category: ['Software', 'Library'], + route: { + light: '/library/typegpu-light.svg', + dark: '/library/typegpu-dark.svg' + }, + wordmark: { + light: '/library/typegpu-wordmark-light.svg', + dark: '/library/typegpu-wordmark-dark.svg' + }, + url: 'https://typegpu.com' + }, + { + title: 'dotenv', + category: ['Config', 'Library', 'Devtool'], + route: '/library/dotenv.svg', + url: 'https://github.com/motdotla/dotenv' + }, + { + title: 'dotenvx', + category: ['Secrets', 'Config', 'Devtool'], + route: '/library/dotenvx.svg', + url: 'https://dotenvx.com' + }, + { + title: 'Apache Kafka', + category: 'Software', + route: '/library/apache-kafka.svg', + wordmark: '/library/apache-kafka-wordmark.svg', + url: 'https://kafka.apache.org' + }, { title: 'Motion', category: 'Library', diff --git a/src/docs/api.md b/src/docs/api.md index 76dc803..fd8e41f 100644 --- a/src/docs/api.md +++ b/src/docs/api.md @@ -39,17 +39,18 @@ export interface Category { - For SVGs: ```ts -type ThemeOptions = { - light: string; +export type ThemeOptions = { dark: string; + light: string; }; export interface iSVG { - id: number; + id?: number; title: string; - category: string | string[]; + category: tCategory | tCategory[]; route: string | ThemeOptions; wordmark?: string | ThemeOptions; + brandUrl?: string; url: string; } ``` diff --git a/src/routes/api/+page.svelte b/src/routes/api/+page.svelte index b6d4ae5..323430c 100644 --- a/src/routes/api/+page.svelte +++ b/src/routes/api/+page.svelte @@ -42,7 +42,7 @@ 'prose dark:prose-invert', 'mx-auto max-w-3xl px-4 py-10', 'prose-h2:font-medium prose-h2:tracking-tight prose-h2:underline prose-h2:decoration-neutral-300 prose-h2:underline-offset-[6px] prose-h2:transition-opacity hover:prose-h2:opacity-70 dark:prose-h2:decoration-neutral-700/65', - 'prose-pre:m-0 prose-pre:border-neutral-200 dark:prose-pre:border dark:prose-pre:border-neutral-800/65' + 'prose-pre:m-0 prose-pre:border prose-pre:border-neutral-200 dark:prose-pre:border dark:prose-pre:border-neutral-800/65' )} > diff --git a/src/types/categories.ts b/src/types/categories.ts index cbb184a..3a92a49 100644 --- a/src/types/categories.ts +++ b/src/types/categories.ts @@ -25,4 +25,9 @@ export type tCategory = | 'Vercel' | 'Google' | 'Payment' - | 'void(0)'; + | 'void(0)' + | 'Authentication' + | 'IoT' + | 'Home Automation' + | 'Config' + | 'Secrets'; diff --git a/src/types/svg.ts b/src/types/svg.ts index 6d568e3..6402e5b 100644 --- a/src/types/svg.ts +++ b/src/types/svg.ts @@ -11,5 +11,6 @@ export interface iSVG { category: tCategory | tCategory[]; route: string | ThemeOptions; wordmark?: string | ThemeOptions; + brandUrl?: string; url: string; } diff --git a/src/ui/popover/popover-content.svelte b/src/ui/popover/popover-content.svelte index d6e3f76..796ce56 100644 --- a/src/ui/popover/popover-content.svelte +++ b/src/ui/popover/popover-content.svelte @@ -21,7 +21,7 @@ {sideOffset} {...$$restProps} class={cn( - 'z-50 w-auto rounded-md border border-neutral-200 bg-white p-3 shadow-md outline-none dark:border-neutral-800 dark:bg-neutral-900', + 'z-50 w-auto max-w-96 rounded-md border border-neutral-200 bg-white p-3 shadow-md outline-none dark:border-neutral-800 dark:bg-neutral-900', className )} > diff --git a/src/ui/tabs/tabs-list.svelte b/src/ui/tabs/tabs-list.svelte index f3c0672..bacbcf4 100644 --- a/src/ui/tabs/tabs-list.svelte +++ b/src/ui/tabs/tabs-list.svelte @@ -9,7 +9,7 @@ diff --git a/src/utils/generateAngularComponent.ts b/src/utils/generateAngularComponent.ts new file mode 100644 index 0000000..1644c88 --- /dev/null +++ b/src/utils/generateAngularComponent.ts @@ -0,0 +1,28 @@ +export function generateAngularComponent(svgContent: string, componentName: string): string { + const updatedSvgContent = svgContent.replace( + /]*)>/, + `` + ); + + return ` +/** + * ------------------------------------------------------------------------- + * This Angular standalone component was generated by svgl.app + * 🧩 A beautiful library with SVG logos + * ------------------------------------------------------------------------- + */ + +import { Component, Input } from '@angular/core'; + +@Component({ + selector: 'svg-${componentName}', + standalone: true, + template: \` + ${updatedSvgContent.trim()} + \`, +}) +export class ${componentName}Component { + @Input({ required: true }) size: { width: number; height: number }; +} +`; +} diff --git a/static/library/apache-kafka-wordmark.svg b/static/library/apache-kafka-wordmark.svg new file mode 100644 index 0000000..fdf52d4 --- /dev/null +++ b/static/library/apache-kafka-wordmark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/apache-kafka.svg b/static/library/apache-kafka.svg new file mode 100644 index 0000000..270d48c --- /dev/null +++ b/static/library/apache-kafka.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/aws.svg b/static/library/aws.svg deleted file mode 100644 index aa22f43..0000000 --- a/static/library/aws.svg +++ /dev/null @@ -1,8 +0,0 @@ - - - - - - diff --git a/static/library/aws_dark.svg b/static/library/aws_dark.svg new file mode 100644 index 0000000..25ea3b0 --- /dev/null +++ b/static/library/aws_dark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/aws_light.svg b/static/library/aws_light.svg new file mode 100644 index 0000000..b2d9005 --- /dev/null +++ b/static/library/aws_light.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/bolt-new.svg b/static/library/bolt-new.svg new file mode 100644 index 0000000..412b98a --- /dev/null +++ b/static/library/bolt-new.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/bolt-new_dark.svg b/static/library/bolt-new_dark.svg new file mode 100644 index 0000000..b4ad193 --- /dev/null +++ b/static/library/bolt-new_dark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/clerk-dark.svg b/static/library/clerk-dark.svg new file mode 100644 index 0000000..4b66bd3 --- /dev/null +++ b/static/library/clerk-dark.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/static/library/clerk-light.svg b/static/library/clerk-light.svg new file mode 100644 index 0000000..294837b --- /dev/null +++ b/static/library/clerk-light.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/static/library/css_old.svg b/static/library/css_old.svg new file mode 100644 index 0000000..c2f6209 --- /dev/null +++ b/static/library/css_old.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/dotenv.svg b/static/library/dotenv.svg new file mode 100644 index 0000000..72b2dab --- /dev/null +++ b/static/library/dotenv.svg @@ -0,0 +1 @@ +.ENV diff --git a/static/library/dotenvx.svg b/static/library/dotenvx.svg new file mode 100644 index 0000000..390d470 --- /dev/null +++ b/static/library/dotenvx.svg @@ -0,0 +1 @@ +dotenvx diff --git a/static/library/duckduckgo-wordmark.svg b/static/library/duckduckgo-wordmark.svg new file mode 100644 index 0000000..1f93725 --- /dev/null +++ b/static/library/duckduckgo-wordmark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/duckduckgo.svg b/static/library/duckduckgo.svg new file mode 100644 index 0000000..7c6aae2 --- /dev/null +++ b/static/library/duckduckgo.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/home-assistant-wordmark-dark.svg b/static/library/home-assistant-wordmark-dark.svg new file mode 100644 index 0000000..f4ab146 --- /dev/null +++ b/static/library/home-assistant-wordmark-dark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/home-assistant-wordmark.svg b/static/library/home-assistant-wordmark.svg new file mode 100644 index 0000000..4fcb416 --- /dev/null +++ b/static/library/home-assistant-wordmark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/home-assistant.svg b/static/library/home-assistant.svg new file mode 100644 index 0000000..f7ffe8b --- /dev/null +++ b/static/library/home-assistant.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/json.svg b/static/library/json.svg new file mode 100644 index 0000000..d334daa --- /dev/null +++ b/static/library/json.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/lottielab.svg b/static/library/lottielab.svg new file mode 100644 index 0000000..2f9f2d9 --- /dev/null +++ b/static/library/lottielab.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/mermaid-logo-dark.svg b/static/library/mermaid-logo-dark.svg new file mode 100644 index 0000000..23ff457 --- /dev/null +++ b/static/library/mermaid-logo-dark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/mermaid-logo-light.svg b/static/library/mermaid-logo-light.svg new file mode 100644 index 0000000..1af8d88 --- /dev/null +++ b/static/library/mermaid-logo-light.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/nuqs-wordmark.svg b/static/library/nuqs-wordmark.svg new file mode 100644 index 0000000..1c52695 --- /dev/null +++ b/static/library/nuqs-wordmark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/nuqs-wordmark_dark.svg b/static/library/nuqs-wordmark_dark.svg new file mode 100644 index 0000000..e1f1e7b --- /dev/null +++ b/static/library/nuqs-wordmark_dark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/nuqs.svg b/static/library/nuqs.svg new file mode 100644 index 0000000..5824bb5 --- /dev/null +++ b/static/library/nuqs.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/nuqs_dark.svg b/static/library/nuqs_dark.svg new file mode 100644 index 0000000..10335d2 --- /dev/null +++ b/static/library/nuqs_dark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/paypal-wordmark.svg b/static/library/paypal-wordmark.svg new file mode 100644 index 0000000..038725e --- /dev/null +++ b/static/library/paypal-wordmark.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/static/library/paypal.svg b/static/library/paypal.svg new file mode 100644 index 0000000..cf14b63 --- /dev/null +++ b/static/library/paypal.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/posthog-wordmark.svg b/static/library/posthog-wordmark.svg new file mode 100644 index 0000000..ec55c78 --- /dev/null +++ b/static/library/posthog-wordmark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/posthog-wordmark_dark.svg b/static/library/posthog-wordmark_dark.svg new file mode 100644 index 0000000..0ed6861 --- /dev/null +++ b/static/library/posthog-wordmark_dark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/posthog.svg b/static/library/posthog.svg new file mode 100644 index 0000000..8a3fcab --- /dev/null +++ b/static/library/posthog.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/shadcn-ui.svg b/static/library/shadcn-ui.svg index 49bb9bf..c1043b5 100644 --- a/static/library/shadcn-ui.svg +++ b/static/library/shadcn-ui.svg @@ -1 +1 @@ - \ No newline at end of file + diff --git a/static/library/shadcn-ui_dark.svg b/static/library/shadcn-ui_dark.svg index 70f3f0c..1634d56 100644 --- a/static/library/shadcn-ui_dark.svg +++ b/static/library/shadcn-ui_dark.svg @@ -1 +1 @@ - \ No newline at end of file + diff --git a/static/library/soundcloud-logo.svg b/static/library/soundcloud-logo.svg new file mode 100644 index 0000000..f8f4cec --- /dev/null +++ b/static/library/soundcloud-logo.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/soundcloud-logo_dark.svg b/static/library/soundcloud-logo_dark.svg new file mode 100644 index 0000000..4014e90 --- /dev/null +++ b/static/library/soundcloud-logo_dark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/soundcloud-wordmark.svg b/static/library/soundcloud-wordmark.svg new file mode 100644 index 0000000..43c05a2 --- /dev/null +++ b/static/library/soundcloud-wordmark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/soundcloud-wordmark_dark.svg b/static/library/soundcloud-wordmark_dark.svg new file mode 100644 index 0000000..2bd0c89 --- /dev/null +++ b/static/library/soundcloud-wordmark_dark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/soundcloud.svg b/static/library/soundcloud.svg new file mode 100644 index 0000000..ce40631 --- /dev/null +++ b/static/library/soundcloud.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/tanstack.svg b/static/library/tanstack.svg new file mode 100644 index 0000000..9c596b7 --- /dev/null +++ b/static/library/tanstack.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/twitch.svg b/static/library/twitch.svg index db5f52e..d9b2fdb 100644 --- a/static/library/twitch.svg +++ b/static/library/twitch.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/static/library/typegpu-dark.svg b/static/library/typegpu-dark.svg new file mode 100644 index 0000000..39a50e5 --- /dev/null +++ b/static/library/typegpu-dark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/typegpu-light.svg b/static/library/typegpu-light.svg new file mode 100644 index 0000000..9ca7717 --- /dev/null +++ b/static/library/typegpu-light.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/typegpu-wordmark-dark.svg b/static/library/typegpu-wordmark-dark.svg new file mode 100644 index 0000000..cf1f0a8 --- /dev/null +++ b/static/library/typegpu-wordmark-dark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/typegpu-wordmark-light.svg b/static/library/typegpu-wordmark-light.svg new file mode 100644 index 0000000..f136a2b --- /dev/null +++ b/static/library/typegpu-wordmark-light.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/uxanarangel-dark.svg b/static/library/uxanarangel-dark.svg new file mode 100644 index 0000000..19b463c --- /dev/null +++ b/static/library/uxanarangel-dark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/uxanarangel-light.svg b/static/library/uxanarangel-light.svg new file mode 100644 index 0000000..dad5e79 --- /dev/null +++ b/static/library/uxanarangel-light.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/uxcorprangel-dark.svg b/static/library/uxcorprangel-dark.svg new file mode 100644 index 0000000..7ee9022 --- /dev/null +++ b/static/library/uxcorprangel-dark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/library/uxcorprangel-light.svg b/static/library/uxcorprangel-light.svg new file mode 100644 index 0000000..3e4a0c9 --- /dev/null +++ b/static/library/uxcorprangel-light.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/svelte.config.js b/svelte.config.js index aaa6f5c..4d22dda 100644 --- a/svelte.config.js +++ b/svelte.config.js @@ -36,11 +36,19 @@ const mdsvexOptions = { highlight: { highlighter: async (code, lang = 'text') => { const highlighter = await getHighlighter({ - themes: ['vesper'], + themes: ['github-light', 'github-dark'], langs: ['javascript', 'typescript', 'bash', 'json'] }); await highlighter.loadLanguage('javascript', 'typescript', 'bash'); - const html = escapeSvelte(highlighter.codeToHtml(code, { lang, theme: 'vesper' })); + const html = escapeSvelte( + highlighter.codeToHtml(code, { + lang, + themes: { + light: 'github-light', + dark: 'github-dark' + } + }) + ); return `{@html \`${html}\` }`; } }