-
+
Конверсия из консультации в бронирование
увеличивается на
@@ -57,7 +57,7 @@ export function Statistics() {
48%
-
+
Конверсия из консультации в бронирование
увеличивается на
@@ -86,7 +86,7 @@ export function Statistics() {
42%
-
+
Время реализации проекта
сокращается до
-
+
Время на подготовку рекламных
материалов сокращается до
(null);
+
+ useEffect(() => {
+ if (!className.split(' ').length) return;
+
+ ref.current?.children
+ .item(0)
+ ?.classList.add(...className.split(' ').filter(Boolean));
+ }, [className]);
+
+ return {element}
;
+}
diff --git a/src/ui/InfinitySlider.tsx b/src/ui/InfinitySlider.tsx
index df3dd7f2..36ab3a2f 100644
--- a/src/ui/InfinitySlider.tsx
+++ b/src/ui/InfinitySlider.tsx
@@ -1,4 +1,5 @@
import { ArrowLeftIcon } from '@/components/icons/ArrowLeftIcon';
+import { ClassNameWrapper } from '@/hocs/ClassNameWrapper';
import { useWindowWidth } from '@/hooks/useWindowWidth';
import {
ReactNode,
@@ -160,7 +161,10 @@ export function InfinitySlider({
/>
)}
diff --git a/src/ui/SliderControls.tsx b/src/ui/SliderControls.tsx
index 9a4ac1e0..557dc388 100644
--- a/src/ui/SliderControls.tsx
+++ b/src/ui/SliderControls.tsx
@@ -1,4 +1,5 @@
import { ArrowLeftIcon } from '@/components/icons/ArrowLeftIcon';
+import { ClassNameWrapper } from '@/hocs/ClassNameWrapper';
export function SliderControls({
slidesCount = 6,
@@ -63,7 +64,7 @@ export function SliderControls({
onClick={onRightClick}
className="rounded-full p-5 border border-[#3D425C]"
>
-
+
} />
);
diff --git a/src/ui/SliderWithScaling.tsx b/src/ui/SliderWithScaling.tsx
index f71fd9e4..2ba20824 100644
--- a/src/ui/SliderWithScaling.tsx
+++ b/src/ui/SliderWithScaling.tsx
@@ -2,6 +2,7 @@
import { useWindowWidth } from '@/hooks/useWindowWidth';
import {
+ Fragment,
ReactElement,
useCallback,
useEffect,
@@ -17,11 +18,13 @@ export function SliderWithScaling
({
slides,
slideElement,
className = '',
+ alignItems = 'start',
title,
}: {
slides: T[];
slideElement: (_: T & { current: boolean }) => ReactElement;
className?: string;
+ alignItems?: 'start' | 'center' | 'end';
title: string;
}) {
const width = useWindowWidth();
@@ -97,15 +100,17 @@ export function SliderWithScaling({
- {order.map((slide, index) =>
- slideElement({ current: index === 1, ...slide }),
- )}
+ {order.map((slide, index) => (
+
+ {slideElement({ current: index === 1, ...slide })}
+
+ ))}
diff --git a/tailwind.config.ts b/tailwind.config.ts
index afbe26b5..2a0550bd 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -12,23 +12,6 @@ const config: Config = {
'gradient-conic':
'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))',
},
- keyframes: {
- scaling: {
- '0%': {
- transition: 'all 1s ease',
- minHeight: '31.8vw',
- minWidth: '31.6vw',
- },
- '100%': {
- transition: 'all 1s ease',
- minHeight: '43.2vw',
- minWidth: '48vw',
- },
- },
- },
- animation: {
- scaling: 'scaling 1s ease-in-out both',
- },
},
},
plugins: [],
diff --git a/tsconfig.json b/tsconfig.json
index 6b5fcde6..b9e7aa81 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -21,6 +21,7 @@
"@/*": ["./src/*"],
"@/components/*": ["./src/components/*"],
"@/hooks/*": ["./src/hooks/*"],
+ "@/hocs/*": ["./src/hocs/*"],
"@/stores/*": ["./src/stores/*"],
"@/pages/*": ["./src/pages/*"],
"@/utils/*": ["./src/utils/*"]