diff --git a/src/components/pages/MainPage/Winners.tsx b/src/components/pages/MainPage/Winners.tsx
index b3dd347b..c3200427 100644
--- a/src/components/pages/MainPage/Winners.tsx
+++ b/src/components/pages/MainPage/Winners.tsx
@@ -6,8 +6,8 @@ import Link from 'next/link';
export function Winners() {
return (
-
-
+ <div className="grid grid-cols-4 py-40 gap-y-4">
+ <Title className="text-[96px] col-start-2 col-span-2">
<span className="text-gradient block">Победители</span>
<span className="text-gradient text-right block">BuildUP 2023</span>
<span className="block">в номинации IT</span>
@@ -15,15 +15,15 @@ export function Winners() {
<Image
src={'/img/pages/home/winners/nomination.png'}
fill
- className="!relative"
+ className="!relative col-start-2 col-span-2"
alt={''}
/>
- <p className="accent font-medium mb-2">
+ <p className="accent font-medium mb-2 col-start-2 col-span-2">
В 2023 году наш продукт для застройщиков GRAFF.estate был признан лучшим
в категории IT на Акселераторе технологических стартапов от лидеров в
строительстве и девелопменте Build UP от Фонда «Сколково»
</p>
- <Link href={'/'} className="flex gap-x-1 py-2 w-fit">
+ <Link href={'/'} className="flex gap-x-1 py-2 w-fit col-start-2">
<p className="text-[#9299BD] font-medium btn-text self-center">
Как это было
</p>
diff --git a/src/consts/reviews.json b/src/consts/reviews.json
index e1fd8dd9..f3e44b3c 100644
--- a/src/consts/reviews.json
+++ b/src/consts/reviews.json
@@ -1,7 +1,7 @@
[
{
"image": "/img/pages/home/reviews/1.png",
- "text": "«Эффективность инструмента была подтверждена буквально в первый день после его внедрения.»",
+ "text": "«Эффективность инструмента была подтверждена буквально в первый день после его внедрения»",
"author": "Егор Бобров, Коммерческий директор авторского квартала «Машаров»"
},
{
@@ -11,7 +11,7 @@
},
{
"image": "/img/pages/home/reviews/3.jpg",
- "text": "«Одним из преимуществ инструмента является возможность посмотреть 3D-модель квартиры с готовым дизайнерским ремонтом и оценить видовые характеристиками, изменяя время суток (день или ночь)»",
+ "text": "«Клиенты особенно ценят возможность легко выбрать квартиру с помощью 3D-модель жилого комплекса»",
"author": "Алина Веселова, Ведущий специалист отдела продаж"
}
]
diff --git a/src/hocs/ClassNameWrapper.tsx b/src/hocs/ClassNameWrapper.tsx
index 815a73d2..0a89b282 100644
--- a/src/hocs/ClassNameWrapper.tsx
+++ b/src/hocs/ClassNameWrapper.tsx
@@ -16,7 +16,7 @@ export function ClassNameWrapper({ element, className }: Props) {
ref.current?.children
.item(0)
?.classList.add(...className.split(' ').filter(Boolean));
- }, [className]);
+ }, [className, element]);
return <div ref={ref}>{element}</div>;
}
diff --git a/src/ui/LineThrow.tsx b/src/ui/LineThrow.tsx
index 773e8089..d6048fb4 100644
--- a/src/ui/LineThrow.tsx
+++ b/src/ui/LineThrow.tsx
@@ -6,9 +6,8 @@ export function LineThrow({
}: PropsWithChildren<{ className?: string }>) {
return (
<span
- className={`line-through decoration-white text-[#52587A] + ${className}`}
+ className={'line-through decoration-white text-[#52587A]' + className}
>
- {' '}
{children}
</span>
);
diff --git a/src/ui/SliderWithScaling.tsx b/src/ui/SliderWithScaling.tsx
index 1ad513b3..3e494ffe 100644
--- a/src/ui/SliderWithScaling.tsx
+++ b/src/ui/SliderWithScaling.tsx
@@ -37,15 +37,18 @@ export function SliderWithScaling<T>({
const [itemRef, scale] = useAnimate<HTMLDivElement>();
const [slide, setSlide] = useState(0);
+ const [sliderOffset, setSliderOffset] = useState(baseoffset);
const [order, dispatch] = useReducer(
(state: typeof slides, action: 'prev' | 'next') => {
switch (action) {
case 'prev':
setSlide(slide => (slide === 0 ? slides.length - 1 : slide - 1));
+ setSliderOffset(2 * baseoffset);
return [state[state.length - 3], ...state.slice(0, -1)];
case 'next':
setSlide(slide => (slide === slides.length - 1 ? 0 : slide + 1));
+ setSliderOffset(0);
return [...state.slice(1), state[2]];
default:
return state;
@@ -54,13 +57,6 @@ export function SliderWithScaling<T>({
[slides[slides.length - 1], ...slides, slides[0]],
);
- useEffect(() => {
- console.log(
- sliderRef.current.children.item(0)?.children.item(0)?.clientWidth,
- sliderRef.current.children.item(0)?.children.item(0)?.clientHeight,
- );
- }, [sliderRef]);
-
const nextSlide = async () => {
await scale(
itemRef.current!,
@@ -69,23 +65,21 @@ export function SliderWithScaling<T>({
minHeight,
},
{ duration: 0.5 },
- ).then(() => {
- dispatch('next');
- });
- await move(
- sliderRef.current!,
- { transform: `translateX(0px)` },
- { duration: 0.000001 },
- );
- await move(
- sliderRef.current!,
- {
- transform: `translateX(${baseoffset}px)`,
- },
- {
- duration: 0.5,
- },
- );
+ )
+ .then(async () => {
+ dispatch('next');
+ console.log(sliderOffset);
+ move(
+ sliderRef.current!,
+ {
+ transform: `translateX(${baseoffset}px)`,
+ },
+ {
+ duration: 0.5,
+ },
+ );
+ })
+ .then(() => setSliderOffset(baseoffset));
};
const prevSlide = async () => {
@@ -96,14 +90,7 @@ export function SliderWithScaling<T>({
minHeight,
},
{ duration: 0.5 },
- ).then(() => {
- dispatch('prev');
- });
- await move(
- sliderRef.current!,
- { transform: `translateX(${2 * baseoffset}px)` },
- { duration: 0.000001 },
- );
+ ).then(() => dispatch('prev'));
await move(
sliderRef.current!,
{
@@ -123,6 +110,10 @@ export function SliderWithScaling<T>({
touchEventOptions: { passive: false },
});
+ useEffect(() => {
+ console.log(sliderRef.current.style.transform);
+ }, [sliderRef]);
+
return (
<div className={'flex flex-col relative ' + className}>
<div className="flex items-center justify-between mb-10">
@@ -133,7 +124,7 @@ export function SliderWithScaling<T>({
<motion.div
ref={sliderRef}
className={`flex items-${alignItems} gap-x-4 -mr-6 relative select-none`}
- initial={{ transform: `translateX(${baseoffset}px)` }}
+ style={{ transform: `translateX(${sliderOffset}px)` }}
>
{order.map((slide, index) => (
<SlideElement