mirror of
https://github.com/stackblitz-labs/bolt.diy
synced 2025-06-26 10:16:01 +00:00
e30035cec5
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.
39 lines
1.2 KiB
TypeScript
39 lines
1.2 KiB
TypeScript
import React from 'react';
|
|
import type { Template } from '~/types/template';
|
|
import { STARTER_TEMPLATES } from '~/utils/constants';
|
|
|
|
interface FrameworkLinkProps {
|
|
template: Template;
|
|
}
|
|
|
|
const FrameworkLink: React.FC<FrameworkLinkProps> = ({ template }) => (
|
|
<a
|
|
href={`/git?url=https://github.com/${template.githubRepo}.git`}
|
|
data-state="closed"
|
|
data-discover="true"
|
|
className="items-center justify-center"
|
|
>
|
|
<div
|
|
className={`inline-block ${template.icon} w-8 h-8 text-4xl transition-theme opacity-25 hover:opacity-100 hover:text-purple-500 dark:text-white dark:opacity-50 dark:hover:opacity-100 dark:hover:text-purple-400 transition-all`}
|
|
title={template.label}
|
|
/>
|
|
</a>
|
|
);
|
|
|
|
const StarterTemplates: React.FC = () => {
|
|
return (
|
|
<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 flex-wrap justify-center items-center gap-4 max-w-sm">
|
|
{STARTER_TEMPLATES.map((template) => (
|
|
<FrameworkLink key={template.name} template={template} />
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default StarterTemplates;
|