Merge version_1 into main #2

Merged
bender merged 2 commits from version_1 into main 2026-03-12 10:39:00 +00:00
2 changed files with 37 additions and 43 deletions

View File

@@ -54,7 +54,7 @@ export default function LandingPage() {
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-lipstick-arrangement-plain-background_23-2148306680.jpg", imageAlt: "Premium lipstick product showcase"
},
{
imageSrc: "http://img.b2bpic.net/free-photo/fashion-woman-hand-holding-lip-care_1150-14163.jpg?_wi=1", imageAlt: "Red luxury lipstick"
imageSrc: "http://img.b2bpic.net/free-photo/fashion-woman-hand-holding-lip-care_1150-14163.jpg", imageAlt: "Red luxury lipstick"
}
]}
rating={5}
@@ -74,7 +74,7 @@ export default function LandingPage() {
tagIcon={Palette}
products={[
{
id: "1", name: "Crimson Dream", price: "$28", variant: "Classic Red • 5 Colors", imageSrc: "http://img.b2bpic.net/free-photo/fashion-woman-hand-holding-lip-care_1150-14163.jpg?_wi=2", imageAlt: "Crimson Dream red lipstick"
id: "1", name: "Crimson Dream", price: "$28", variant: "Classic Red • 5 Colors", imageSrc: "http://img.b2bpic.net/free-photo/fashion-woman-hand-holding-lip-care_1150-14163.jpg", imageAlt: "Crimson Dream red lipstick"
},
{
id: "2", name: "Nude Romance", price: "$28", variant: "Warm Nude • 4 Colors", imageSrc: "http://img.b2bpic.net/free-photo/top-view-lipsticks-red-silk_23-2148978202.jpg", imageAlt: "Nude Romance nude lipstick"
@@ -116,11 +116,11 @@ export default function LandingPage() {
features={[
{
id: "1", title: "Long-Lasting Color", author: "24-Hour Wear", description: "Vibrant color that stays put from morning to night. Smudge-proof formula that doesn't fade.", tags: ["Durability", "Professional"],
imageSrc: "http://img.b2bpic.net/free-photo/smiling-female-visagiste-applying-makeup_23-2148113125.jpg?_wi=1", imageAlt: "Long-lasting lipstick application"
imageSrc: "http://img.b2bpic.net/free-photo/smiling-female-visagiste-applying-makeup_23-2148113125.jpg", imageAlt: "Long-lasting lipstick application"
},
{
id: "2", title: "Hydrating Formula", author: "Comfort First", description: "Enriched with natural oils and vitamins. Your lips stay soft, moisturized, and beautiful all day.", tags: ["Care", "Natural"],
imageSrc: "http://img.b2bpic.net/free-photo/smiling-female-visagiste-applying-makeup_23-2148113125.jpg?_wi=2", imageAlt: "Hydrating lipstick formula"
imageSrc: "http://img.b2bpic.net/free-photo/smiling-female-visagiste-applying-makeup_23-2148113125.jpg", imageAlt: "Hydrating lipstick formula"
}
]}
animationType="slide-up"
@@ -154,8 +154,8 @@ export default function LandingPage() {
tagIcon={Award}
textboxLayout="default"
useInvertedBackground={false}
logos={[
"http://img.b2bpic.net/free-photo/purple-lipstick-shade-pink-background-flat-lay_23-2149518337.jpg", "http://img.b2bpic.net/free-vector/gradient-luxury-logo-template_23-2150816442.jpg", "http://img.b2bpic.net/free-vector/flat-design-fashion-week-youtube-thumbnail_23-2151084398.jpg", "http://img.b2bpic.net/free-vector/books-logo-set-different-colors_60389-96.jpg", "http://img.b2bpic.net/free-vector/set-flat-design-ai-logo-template_23-2148914664.jpg", "http://img.b2bpic.net/free-vector/minimalist-wedding-monograms-pastel-colors_52683-30203.jpg", "http://img.b2bpic.net/free-vector/flat-slow-fashion-badge-set_23-2148828530.jpg"
names={[
"Sephora", "Ulta Beauty", "Vogue", "Harper's Bazaar", "Allure", "Elle", "Nylon"
]}
speed={40}
showCard={true}

View File

@@ -1,51 +1,45 @@
"use client";
import { memo } from "react";
import useSvgTextLogo from "./useSvgTextLogo";
import { cls } from "@/lib/utils";
import React from 'react';
interface SvgTextLogoProps {
logoText: string;
adjustHeightFactor?: number;
verticalAlign?: "top" | "center";
text: string;
className?: string;
fontSize?: number;
fontFamily?: string;
fontWeight?: number | string;
letterSpacing?: number;
fillColor?: 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,
className = '',
fontSize = 48,
fontFamily = 'system-ui, -apple-system, sans-serif',
fontWeight = 700,
letterSpacing = 0,
fillColor = 'currentColor',
}) => {
return (
<svg
ref={svgRef}
viewBox={viewBox}
className={cls("w-full", className)}
style={{ aspectRatio: aspectRatio }}
preserveAspectRatio="none"
role="img"
aria-label={`${logoText} logo`}
viewBox={`0 0 ${text.length * fontSize * 0.6} ${fontSize * 1.2}`}
className={className}
xmlns="http://www.w3.org/2000/svg"
>
<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="50%"
y="50%"
textAnchor="middle"
dominantBaseline="middle"
fontSize={fontSize}
fontFamily={fontFamily}
fontWeight={fontWeight}
letterSpacing={letterSpacing}
fill={fillColor}
>
{logoText}
{text}
</text>
</svg>
);
});
};
SvgTextLogo.displayName = "SvgTextLogo";
export default SvgTextLogo;
export default SvgTextLogo;