feat(templates): add Vite Shadcn starter template

Introduce a new starter template for Vite with shadcn/ui integration. The template includes React, TypeScript, and Tailwind, and is added to the STARTER_TEMPLATES list. Additionally, update the styling in StarterTemplates component to better accommodate the new template and add the shadcn.svg icon.
This commit is contained in:
KevIsDev 2025-04-30 11:37:29 +01:00
parent f430443aef
commit e30035cec5
3 changed files with 30 additions and 1 deletions

View File

@ -25,7 +25,7 @@ const StarterTemplates: React.FC = () => {
<div className="flex flex-col items-center gap-4">
<span className="text-sm text-gray-500">or start a blank app with your favorite stack</span>
<div className="flex justify-center">
<div className="flex w-70 flex-wrap items-center justify-center gap-4">
<div className="flex flex-wrap justify-center items-center gap-4 max-w-sm">
{STARTER_TEMPLATES.map((template) => (
<FrameworkLink key={template.name} template={template} />
))}

View File

@ -49,6 +49,14 @@ export const STARTER_TEMPLATES: Template[] = [
tags: ['nextjs', 'react', 'typescript', 'shadcn', 'tailwind'],
icon: 'i-bolt:nextjs',
},
{
name: 'Vite Shadcn',
label: 'Vite with shadcn/ui',
description: 'Vite starter fullstack template integrated with shadcn/ui components and styling system',
githubRepo: 'xKevIsDev/vite-shadcn',
tags: ['vite', 'react', 'typescript', 'shadcn', 'tailwind'],
icon: 'i-bolt:shadcn',
},
{
name: 'Qwik Typescript',
label: 'Qwik TypeScript',

21
icons/shadcn.svg Normal file
View File

@ -0,0 +1,21 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 256 256">
<!-- Generator: Adobe Illustrator 29.0.1, SVG Export Plug-In . SVG Version: 2.1.0 Build 192) -->
<defs>
<style>
.st0, .st1 {
fill: none;
}
.st1 {
stroke: #7B7B7B; /* Changed from #000 to #7B7B7B */
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 32px;
}
</style>
</defs>
<rect class="st0" width="256" height="256"/>
<line class="st1" x1="208" y1="128" x2="128" y2="208"/>
<line class="st1" x1="192" y1="40" x2="40" y2="192"/>
</svg>

After

Width:  |  Height:  |  Size: 660 B