This commit is contained in:
2026-03-30 12:11:44 +09:00
parent 10068a6fdb
commit 99f5f2a507
3 changed files with 32 additions and 33 deletions

View File

@@ -4,7 +4,7 @@ const CompanyInfoMockup = ({
children
}: PropsWithChildren) => {
return (
<div className='bg-base-300 w-full h-min rounded-2xl sm:border-8 sm:border-black'>
<div className='bg-base-300 w-full h-min rounded-4xl sm:border-8 sm:border-black'>
<div className='hidden sm:flex flex-col w-full'>
<div className='w-full grid grid-cols-3 p-2'>
<div className='flex space-x-2 overflow-hidden'>

View File

@@ -24,8 +24,8 @@ const DirectorSection = () => {
Нашей стратегией является превращать сложные задачи сферы ЖКХ <span className='text-blue-500'>в эффективные цифровые решения</span>. Мы разрабатываем автоматизацию для жизненно важной отрасли.
</span>
<div className='flex flex-row gap-2 sm:grid sm:grid-cols-2 justify-end mt-auto'>
<div className="flex justify-center items-center">
<div className='flex flex-row gap-2 justify-end mt-auto'>
<div className="flex justify-center items-center w-full">
<img className="max-w-64 w-full h-auto" src="/assets/sign.png" />
</div>

View File

@@ -1,48 +1,47 @@
import { useInView } from "motion/react";
import { useRef, useEffect, useState } from "react";
export default function TypingEffect({ text = 'Typing Effect', speed = 0.1 }: { text: string, speed?: number }) {
export default function TypingEffect({
text = "Typing Effect",
speed = 0.05,
}: {
text: string;
speed?: number;
}) {
const ref = useRef<HTMLHeadingElement>(null);
const isInView = useInView(ref, { once: true });
const [visibleChars, setVisibleChars] = useState(0);
// Split text into lines
const lines = text.split('\n');
const lines = text.split("\n");
const totalChars = text.replace(/\n/g, "").length;
useEffect(() => {
if (!isInView) return;
let currentIndex = 0;
const totalChars = text.replace(/\n/g, '').length;
const interval = setInterval(() => {
if (currentIndex < totalChars) {
currentIndex++;
setVisibleChars(currentIndex);
} else {
clearInterval(interval);
}
setVisibleChars((prev) => {
if (prev >= totalChars) return 0; // loop
return prev + 1;
});
}, speed * 1000);
return () => clearInterval(interval);
}, [isInView, text, speed]);
// Build visible text based on visible characters
}, [isInView, totalChars, speed]);
// Build visible overlay text
let charsProcessed = 0;
const visibleLines: string[] = [];
for (const line of lines) {
const lineLength = line.length;
if (charsProcessed + lineLength <= visibleChars) {
// Full line is visible
visibleLines.push(line);
charsProcessed += lineLength;
} else {
// Partial line
const remainingChars = visibleChars - charsProcessed;
if (remainingChars > 0) {
visibleLines.push(line.slice(0, remainingChars));
}
const remaining = visibleChars - charsProcessed;
if (remaining > 0) visibleLines.push(line.slice(0, remaining));
break;
}
}
@@ -53,11 +52,11 @@ export default function TypingEffect({ text = 'Typing Effect', speed = 0.1 }: {
ref={ref}
className="text-sm text-left font-mono text-base-content/70 tracking-tighter absolute bottom-0"
>
{lines.map((line, i) => (
<div key={i}>{line}</div>
))}
{visibleLines.map((line, index) => (
<div key={index}>
{line}
{index < visibleLines.length - 1 && <br />}
</div>
<div key={index}>{line}</div>
))}
</h2>
</div>