bender/83c9f877-ba3c-448b-ad42-0b08beacd7c1
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_1 into main #2

Merged
bender merged 2 commits from version_1 into main 2026-03-12 20:31:18 +00:00
Conversation 0 Commits 2 Files Changed 2 +73 -56
2 changed files with 73 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
src/app/page.tsx
View File

@@ -23,7 +23,7 @@ export default function LandingPage() {
borderRadius="soft"
contentWidth="compact"
sizing="mediumLargeSizeLargeTitles"
background="floatingGradient"
background="circleGradient"
cardStyle="solid"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="glass"
@@ -50,14 +50,14 @@ export default function LandingPage() {
tag="Diseño Profesional"
tagIcon={Sparkles}
tagAnimation="slide-up"
background={{ variant: "floatingGradient" }}
background={{ variant: "radial-gradient" }}
buttons={[
{ text: "Solicitar presupuesto", href: "contact" },
{ text: "Ver ejemplos", href: "portfolio" }
]}
buttonAnimation="slide-up"
mediaItems={[
{ imageSrc: "http://img.b2bpic.net/free-vector/geometric-gradient-shapes-landing-page-template_23-2148203339.jpg?_wi=1", imageAlt: "agencia digital website profesional moderno" }
{ imageSrc: "http://img.b2bpic.net/free-vector/geometric-gradient-shapes-landing-page-template_23-2148203339.jpg", imageAlt: "agencia digital website profesional moderno" }
]}
mediaAnimation="slide-up"
/>
@@ -90,27 +90,27 @@ export default function LandingPage() {
features={[
{
id: "1", title: "Webs para Restaurantes y Bares", author: "Diseño Gastronómico", description: "Menús digitales, galería de platos, reservas online y ubicación. Convierte visitantes en comensales desde el primer vistazo.", tags: ["Menú Digital", "Reservas", "Galería"],
imageSrc: "http://img.b2bpic.net/free-psd/landing-page-cook-book-template_23-2148652115.jpg?_wi=1", imageAlt: "sitio web restaurante moderno elegante"
imageSrc: "http://img.b2bpic.net/free-psd/landing-page-cook-book-template_23-2148652115.jpg", imageAlt: "sitio web restaurante moderno elegante"
},
{
id: "2", title: "Webs para Peluquerías y Barberías", author: "Estilo Moderno", description: "Galería de trabajos, citas online, portafolio de estilos. Demuestra tu talento y permite que clientes agenden directamente.", tags: ["Citas Online", "Portafolio", "Estilos"],
imageSrc: "http://img.b2bpic.net/free-psd/landing-page-barber-shop-template_23-2148712466.jpg?_wi=1", imageAlt: "sitio web peluqueria barberia moderno"
imageSrc: "http://img.b2bpic.net/free-psd/landing-page-barber-shop-template_23-2148712466.jpg", imageAlt: "sitio web peluqueria barberia moderno"
},
{
id: "3", title: "Webs para Clínicas y Dentales", author: "Confianza Médica", description: "Información de servicios, perfiles de profesionales, citas médicas. Genera confianza y facilita que pacientes agendan citas.", tags: ["Citas Médicas", "Equipo", "Servicios"],
imageSrc: "http://img.b2bpic.net/free-vector/flat-design-financial-consultancy-landing-page_23-2150863943.jpg?_wi=1", imageAlt: "sitio web clinica dental medica moderno"
imageSrc: "http://img.b2bpic.net/free-vector/flat-design-financial-consultancy-landing-page_23-2150863943.jpg", imageAlt: "sitio web clinica dental medica moderno"
},
{
id: "4", title: "Webs para Gimnasios y Entrenadores", author: "Fitness Digital", description: "Clases, membresías, galería, testimonios. Inspira a nuevos miembros y facilita la inscripción online.", tags: ["Membresías", "Clases", "Logros"],
imageSrc: "http://img.b2bpic.net/free-vector/exercise-sport-landing-page_52683-23222.jpg?_wi=1", imageAlt: "sitio web gimnasio fitness moderno"
imageSrc: "http://img.b2bpic.net/free-vector/exercise-sport-landing-page_52683-23222.jpg", imageAlt: "sitio web gimnasio fitness moderno"
},
{
id: "5", title: "Webs para Discotecas y Eventos", author: "Entretenimiento", description: "Eventos, promociones, galerías de noches, reservas. Crea expectativa y convierte visitantes en clientes.", tags: ["Eventos", "Promociones", "Reservas"],
imageSrc: "http://img.b2bpic.net/free-psd/party-entertainment-landing-page-template_23-2151203613.jpg?_wi=1", imageAlt: "sitio web discoteca eventos moderno"
imageSrc: "http://img.b2bpic.net/free-psd/party-entertainment-landing-page-template_23-2151203613.jpg", imageAlt: "sitio web discoteca eventos moderno"
},
{
id: "6", title: "Webs para Negocios Locales", author: "Soluciones Personalizadas", description: "Agencias, tiendas, servicios y más. Cualquier negocio local merece una web que lo represente profesionalmente.", tags: ["Personalizado", "Profesional", "Resultados"],
imageSrc: "http://img.b2bpic.net/free-vector/minimal-architecture-project-landing-page_23-2149447724.jpg?_wi=1", imageAlt: "sitio web inmobiliaria bienes raices moderno"
imageSrc: "http://img.b2bpic.net/free-vector/minimal-architecture-project-landing-page_23-2149447724.jpg", imageAlt: "sitio web inmobiliaria bienes raices moderno"
}
]}
animationType="slide-up"
@@ -156,22 +156,22 @@ export default function LandingPage() {
tagAnimation="slide-up"
products={[
{
id: "1", name: "Restaurante La Tradición", price: "Web Premium", variant: "Diseño Gastronómico • Menú Digital • Reservas", imageSrc: "http://img.b2bpic.net/free-psd/landing-page-cook-book-template_23-2148652115.jpg?_wi=2", imageAlt: "Sitio web restaurante"
id: "1", name: "Restaurante La Tradición", price: "Web Premium", variant: "Diseño Gastronómico • Menú Digital • Reservas", imageSrc: "http://img.b2bpic.net/free-psd/landing-page-cook-book-template_23-2148652115.jpg", imageAlt: "Sitio web restaurante"
},
{
id: "2", name: "Barbería The Gentleman", price: "Web Profesional", variant: "Portafolio • Citas Online • Galería", imageSrc: "http://img.b2bpic.net/free-psd/landing-page-barber-shop-template_23-2148712466.jpg?_wi=2", imageAlt: "Sitio web barbería"
id: "2", name: "Barbería The Gentleman", price: "Web Profesional", variant: "Portafolio • Citas Online • Galería", imageSrc: "http://img.b2bpic.net/free-psd/landing-page-barber-shop-template_23-2148712466.jpg", imageAlt: "Sitio web barbería"
},
{
id: "3", name: "Clínica Dental SmilePro", price: "Web Médica", variant: "Citas • Equipo • Servicios", imageSrc: "http://img.b2bpic.net/free-vector/flat-design-financial-consultancy-landing-page_23-2150863943.jpg?_wi=2", imageAlt: "Sitio web clínica"
id: "3", name: "Clínica Dental SmilePro", price: "Web Médica", variant: "Citas • Equipo • Servicios", imageSrc: "http://img.b2bpic.net/free-vector/flat-design-financial-consultancy-landing-page_23-2150863943.jpg", imageAlt: "Sitio web clínica"
},
{
id: "4", name: "Gimnasio FitZone", price: "Web Fitness", variant: "Membresías • Clases • Resultados", imageSrc: "http://img.b2bpic.net/free-vector/exercise-sport-landing-page_52683-23222.jpg?_wi=2", imageAlt: "Sitio web gimnasio"
id: "4", name: "Gimnasio FitZone", price: "Web Fitness", variant: "Membresías • Clases • Resultados", imageSrc: "http://img.b2bpic.net/free-vector/exercise-sport-landing-page_52683-23222.jpg", imageAlt: "Sitio web gimnasio"
},
{
id: "5", name: "Club Nocturno Vibe", price: "Web Entretenimiento", variant: "Eventos • Promociones • Reservas", imageSrc: "http://img.b2bpic.net/free-psd/party-entertainment-landing-page-template_23-2151203613.jpg?_wi=2", imageAlt: "Sitio web discoteca"
id: "5", name: "Club Nocturno Vibe", price: "Web Entretenimiento", variant: "Eventos • Promociones • Reservas", imageSrc: "http://img.b2bpic.net/free-psd/party-entertainment-landing-page-template_23-2151203613.jpg", imageAlt: "Sitio web discoteca"
},
{
id: "6", name: "Agencia Inmobiliaria Elite", price: "Web Inmobiliaria", variant: "Propiedades • Búsqueda • Contacto", imageSrc: "http://img.b2bpic.net/free-vector/minimal-architecture-project-landing-page_23-2149447724.jpg?_wi=2", imageAlt: "Sitio web inmobiliaria"
id: "6", name: "Agencia Inmobiliaria Elite", price: "Web Inmobiliaria", variant: "Propiedades • Búsqueda • Contacto", imageSrc: "http://img.b2bpic.net/free-vector/minimal-architecture-project-landing-page_23-2149447724.jpg", imageAlt: "Sitio web inmobiliaria"
}
]}
animationType="slide-up"
@@ -190,16 +190,16 @@ export default function LandingPage() {
tagAnimation="slide-up"
blogs={[
{
id: "1", category: "Paso 1", title: "Contacto", excerpt: "Te contamos sobre tu negocio, tus objetivos y tus clientes. Entendemos exactamente qué necesitas.", imageSrc: "http://img.b2bpic.net/free-vector/geometric-gradient-shapes-landing-page-template_23-2148203339.jpg?_wi=2", imageAlt: "Reunión inicial", authorName: "ClickLocal", authorAvatar: "http://img.b2bpic.net/free-vector/geometric-gradient-shapes-landing-page-template_23-2148203339.jpg", date: "Reunión inicial"
id: "1", category: "Paso 1", title: "Contacto", excerpt: "Te contamos sobre tu negocio, tus objetivos y tus clientes. Entendemos exactamente qué necesitas.", imageSrc: "http://img.b2bpic.net/free-vector/geometric-gradient-shapes-landing-page-template_23-2148203339.jpg", imageAlt: "Reunión inicial", authorName: "ClickLocal", authorAvatar: "http://img.b2bpic.net/free-vector/geometric-gradient-shapes-landing-page-template_23-2148203339.jpg", date: "Reunión inicial"
},
{
id: "2", category: "Paso 2", title: "Propuesta", excerpt: "Diseño y presupuesto personalizados. Todo claro, sin sorpresas. Apruebas antes de empezar.", imageSrc: "http://img.b2bpic.net/free-psd/landing-page-cook-book-template_23-2148652115.jpg?_wi=3", imageAlt: "Propuesta clara", authorName: "ClickLocal", authorAvatar: "http://img.b2bpic.net/free-psd/landing-page-cook-book-template_23-2148652115.jpg", date: "Propuesta clara"
id: "2", category: "Paso 2", title: "Propuesta", excerpt: "Diseño y presupuesto personalizados. Todo claro, sin sorpresas. Apruebas antes de empezar.", imageSrc: "http://img.b2bpic.net/free-psd/landing-page-cook-book-template_23-2148652115.jpg", imageAlt: "Propuesta clara", authorName: "ClickLocal", authorAvatar: "http://img.b2bpic.net/free-psd/landing-page-cook-book-template_23-2148652115.jpg", date: "Propuesta clara"
},
{
id: "3", category: "Paso 3", title: "Diseño y Desarrollo", excerpt: "Nuestro equipo trabaja en tu web. Profesional, moderna, rápida. Te mantenemos informado.", imageSrc: "http://img.b2bpic.net/free-psd/landing-page-barber-shop-template_23-2148712466.jpg?_wi=3", imageAlt: "Desarrollo ágil", authorName: "ClickLocal", authorAvatar: "http://img.b2bpic.net/free-psd/landing-page-barber-shop-template_23-2148712466.jpg", date: "Desarrollo ágil"
id: "3", category: "Paso 3", title: "Diseño y Desarrollo", excerpt: "Nuestro equipo trabaja en tu web. Profesional, moderna, rápida. Te mantenemos informado.", imageSrc: "http://img.b2bpic.net/free-psd/landing-page-barber-shop-template_23-2148712466.jpg", imageAlt: "Desarrollo ágil", authorName: "ClickLocal", authorAvatar: "http://img.b2bpic.net/free-psd/landing-page-barber-shop-template_23-2148712466.jpg", date: "Desarrollo ágil"
},
{
id: "4", category: "Paso 4", title: "Entrega", excerpt: "Tu web lista, funcionando perfectamente. Incluye hosting, dominio y soporte inicial.", imageSrc: "http://img.b2bpic.net/free-vector/exercise-sport-landing-page_52683-23222.jpg?_wi=3", imageAlt: "Lanzamiento", authorName: "ClickLocal", authorAvatar: "http://img.b2bpic.net/free-vector/exercise-sport-landing-page_52683-23222.jpg", date: "Lanzamiento"
id: "4", category: "Paso 4", title: "Entrega", excerpt: "Tu web lista, funcionando perfectamente. Incluye hosting, dominio y soporte inicial.", imageSrc: "http://img.b2bpic.net/free-vector/exercise-sport-landing-page_52683-23222.jpg", imageAlt: "Lanzamiento", authorName: "ClickLocal", authorAvatar: "http://img.b2bpic.net/free-vector/exercise-sport-landing-page_52683-23222.jpg", date: "Lanzamiento"
}
]}
animationType="slide-up"
@@ -322,7 +322,7 @@ export default function LandingPage() {
description="No esperes más. Cada día sin una web profesional es un cliente potencial que no tienes. Solicita tu presupuesto hoy y descubre qué podemos hacer por tu negocio."
tagIcon={Rocket}
tagAnimation="slide-up"
background={{ variant: "floatingGradient" }}
background={{ variant: "radial-gradient" }}
useInvertedBackground={false}
inputPlaceholder="Tu email"
buttonText="Solicitar presupuesto"

89
src/components/shared/SvgTextLogo/SvgTextLogo.tsx
View File

@@ -1,51 +1,68 @@
"use client";
import { memo } from "react";
import useSvgTextLogo from "./useSvgTextLogo";
import { cls } from "@/lib/utils";
import React, { useMemo } from 'react';
interface SvgTextLogoProps {
logoText: string;
adjustHeightFactor?: number;
verticalAlign?: "top" | "center";
text: string;
fontSize?: number;
fontWeight?: number | string;
fontFamily?: string;
fill?: string;
letterSpacing?: number;
lineHeight?: number;
className?: string;
}
const SvgTextLogo = memo<SvgTextLogoProps>(function SvgTextLogo({
logoText,
adjustHeightFactor,
verticalAlign = "top",
className = "",
}) {
const { svgRef, textRef, viewBox, aspectRatio } = useSvgTextLogo(logoText, false, adjustHeightFactor);
const SvgTextLogo: React.FC<SvgTextLogoProps> = ({
text,
fontSize = 48,
fontWeight = 700,
fontFamily = 'Arial, sans-serif',
fill = '#000000',
letterSpacing = 0,
lineHeight = 1.2,
className = '',
}) => {
const measurements = useMemo(() => {
const tempSvg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
const tempText = document.createElementNS('http://www.w3.org/2000/svg', 'text');
tempText.setAttribute('font-size', fontSize.toString());
tempText.setAttribute('font-weight', fontWeight.toString());
tempText.setAttribute('font-family', fontFamily);
tempText.setAttribute('dominant-baseline', 'auto');
tempText.textContent = text;
tempSvg.appendChild(tempText);
document.body.appendChild(tempSvg);
const bbox = tempText.getBBox();
document.body.removeChild(tempSvg);
return { width: bbox.width, height: bbox.height, x: bbox.x, y: bbox.y };
}, [text, fontSize, fontWeight, fontFamily]);
const svgWidth = measurements.width + 20;
const svgHeight = measurements.height + 10;
return (
<svg
ref={svgRef}
viewBox={viewBox}
className={cls("w-full", className)}
style={{ aspectRatio: aspectRatio }}
preserveAspectRatio="none"
role="img"
aria-label={`${logoText} logo`}
width={svgWidth}
height={svgHeight}
viewBox={`0 0 ${svgWidth} ${svgHeight}`}
xmlns="http://www.w3.org/2000/svg"
className={className}
>
<text
ref={textRef}
x="0"
y={verticalAlign === "center" ? "50%" : "0"}
className="font-bold fill-current"
style={{
fontSize: "20px",
letterSpacing: "-0.02em",
dominantBaseline: verticalAlign === "center" ? "middle" : "text-before-edge"
}}
x="10"
y="5"
fontSize={fontSize}
fontWeight={fontWeight}
fontFamily={fontFamily}
fill={fill}
letterSpacing={letterSpacing}
dominantBaseline="auto"
>
{logoText}
{text}
</text>
</svg>
);
});
};
SvgTextLogo.displayName = "SvgTextLogo";
export default SvgTextLogo;
export default SvgTextLogo;