48c41e8733
Transform qualifying scenarios into marketing-ready use cases with: - AI-generated titles, descriptions, ROI estimates, business value - Persona/industry/category taxonomy for targeting - Browseable feed with filtering and ranking - SEO-optimized case study pages - Daily cron job for generation and ranking Database: - Add Persona, Industry, Category lookup tables - Add UseCase model with marketing content fields - Add junction tables for personas/industries/categories - Add SocialProof model for cached metrics API: - GET /api/use-cases - Global directory with filtering - GET /api/use-cases/[id] - Individual use case details - GET /api/public/users/[username]/collections/[slug]/use-cases - POST /api/cron/use-cases - Nightly generation job Frontend: - /use-cases - Global feed with persona dropdown - /use-cases/[slug] - SEO case study page - /[username]/collections/[slug]/use-cases - Collection feed - UseCasesFeed component - Sortable table component - UseCaseCaseStudy component - Full case study layout
147 lines
3.3 KiB
TypeScript
147 lines
3.3 KiB
TypeScript
import { createVariants } from '../system/variants';
|
|
|
|
/**
|
|
* InstallSnippet container variant definitions
|
|
*/
|
|
export const installSnippetVariants = createVariants({
|
|
base: ['w-full', 'border border-border', 'rounded-none', 'overflow-hidden'].join(' '),
|
|
|
|
variants: {
|
|
variant: {
|
|
default: 'bg-surface',
|
|
minimal: 'border-0 bg-transparent',
|
|
dark: 'bg-foreground border-foreground',
|
|
},
|
|
},
|
|
|
|
defaultVariants: {
|
|
variant: 'default',
|
|
},
|
|
});
|
|
|
|
/**
|
|
* InstallSnippet tabs variant definitions
|
|
*/
|
|
export const installSnippetTabsVariants = createVariants({
|
|
base: ['flex items-center', 'border-b border-border', 'px-1', 'gap-0'].join(' '),
|
|
|
|
variants: {
|
|
variant: {
|
|
default: 'bg-surface',
|
|
minimal: 'bg-transparent border-0',
|
|
dark: 'bg-foreground border-foreground/20',
|
|
},
|
|
},
|
|
|
|
defaultVariants: {
|
|
variant: 'default',
|
|
},
|
|
});
|
|
|
|
/**
|
|
* InstallSnippet tab variant definitions
|
|
*/
|
|
export const installSnippetTabVariants = createVariants({
|
|
base: [
|
|
'px-3 py-2',
|
|
'font-mono text-xs',
|
|
'border-b-2 border-transparent',
|
|
'-mb-px',
|
|
'cursor-pointer',
|
|
'transition-colors duration-150',
|
|
].join(' '),
|
|
|
|
variants: {
|
|
variant: {
|
|
default: 'text-foreground-muted hover:text-foreground',
|
|
minimal: 'text-foreground-muted hover:text-foreground',
|
|
dark: 'text-background/60 hover:text-background',
|
|
},
|
|
active: {
|
|
true: '',
|
|
false: '',
|
|
},
|
|
},
|
|
|
|
defaultVariants: {
|
|
variant: 'default',
|
|
active: 'false',
|
|
},
|
|
|
|
compoundVariants: [
|
|
{
|
|
conditions: { variant: 'default', active: 'true' },
|
|
className: 'text-foreground border-primary',
|
|
},
|
|
{
|
|
conditions: { variant: 'minimal', active: 'true' },
|
|
className: 'text-foreground border-primary',
|
|
},
|
|
{
|
|
conditions: { variant: 'dark', active: 'true' },
|
|
className: 'text-background border-background',
|
|
},
|
|
],
|
|
});
|
|
|
|
/**
|
|
* InstallSnippet code area variant definitions
|
|
*/
|
|
export const installSnippetCodeVariants = createVariants({
|
|
base: [
|
|
'flex items-center justify-between',
|
|
'px-4 py-3',
|
|
'font-mono text-sm',
|
|
'overflow-x-auto',
|
|
].join(' '),
|
|
|
|
variants: {
|
|
variant: {
|
|
default: 'text-foreground',
|
|
minimal: 'text-foreground',
|
|
dark: 'text-background',
|
|
},
|
|
},
|
|
|
|
defaultVariants: {
|
|
variant: 'default',
|
|
},
|
|
});
|
|
|
|
/**
|
|
* InstallSnippet copy button variant definitions
|
|
*/
|
|
export const installSnippetCopyButtonVariants = createVariants({
|
|
base: [
|
|
'flex-shrink-0',
|
|
'p-1.5',
|
|
'-m-1',
|
|
'ml-3',
|
|
'rounded-none',
|
|
'transition-colors duration-150',
|
|
'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary',
|
|
].join(' '),
|
|
|
|
variants: {
|
|
variant: {
|
|
default: 'text-foreground-muted hover:text-foreground hover:bg-accent/10',
|
|
minimal: 'text-foreground-muted hover:text-foreground hover:bg-accent/10',
|
|
dark: 'text-background/60 hover:text-background hover:bg-background/10',
|
|
},
|
|
copied: {
|
|
true: '',
|
|
false: '',
|
|
},
|
|
},
|
|
|
|
defaultVariants: {
|
|
variant: 'default',
|
|
copied: 'false',
|
|
},
|
|
|
|
compoundVariants: [
|
|
{ conditions: { variant: 'default', copied: 'true' }, className: 'text-success' },
|
|
{ conditions: { variant: 'minimal', copied: 'true' }, className: 'text-success' },
|
|
{ conditions: { variant: 'dark', copied: 'true' }, className: 'text-success' },
|
|
],
|
|
});
|