diff --git a/index.html b/index.html index 5942559..15cdb76 100644 --- a/index.html +++ b/index.html @@ -6,17 +6,14 @@ - + - Graff.event - Интерактивные выставочные решения + Интерактивные выставочные решения
diff --git a/public/video/interactions/1.mp4 b/public/video/interactions/1.mp4 index c9781f6..97934f4 100644 Binary files a/public/video/interactions/1.mp4 and b/public/video/interactions/1.mp4 differ diff --git a/public/video/interactions/2.mp4 b/public/video/interactions/2.mp4 index 5ee371e..70a90db 100644 Binary files a/public/video/interactions/2.mp4 and b/public/video/interactions/2.mp4 differ diff --git a/public/video/interactions/3.mp4 b/public/video/interactions/3.mp4 index 84026e2..7271ded 100644 Binary files a/public/video/interactions/3.mp4 and b/public/video/interactions/3.mp4 differ diff --git a/public/video/interactions/4.mp4 b/public/video/interactions/4.mp4 index 0ecd299..aee4c7d 100644 Binary files a/public/video/interactions/4.mp4 and b/public/video/interactions/4.mp4 differ diff --git a/src/components/Contacts.tsx b/src/components/Contacts.tsx index a5a5118..2f9c361 100644 --- a/src/components/Contacts.tsx +++ b/src/components/Contacts.tsx @@ -15,7 +15,7 @@ export function Contacts() { return (

Хотите использовать интерактивные тренажеры в обучении? diff --git a/src/components/Devices.tsx b/src/components/Devices.tsx index 03ccd33..4982142 100644 --- a/src/components/Devices.tsx +++ b/src/components/Devices.tsx @@ -156,7 +156,7 @@ function Device({ title, description, img }: IDevice) { exit={{ opacity: 0, transition: { delay: 0 } }} transition={{ duration: 0.4 }} src={img} - alt="" + alt={title} /> )} diff --git a/src/components/Form.tsx b/src/components/Form.tsx index c3fa514..244a4d7 100644 --- a/src/components/Form.tsx +++ b/src/components/Form.tsx @@ -16,12 +16,12 @@ export function Form() {
@@ -29,43 +29,43 @@ export function Form() {

-
+
-
+
-
+
-
+
diff --git a/src/components/InteractionsWithClients/Slider/DesktopInteractionsSlide.tsx b/src/components/InteractionsWithClients/Slider/DesktopInteractionsSlide.tsx index 6178b5d..be05243 100644 --- a/src/components/InteractionsWithClients/Slider/DesktopInteractionsSlide.tsx +++ b/src/components/InteractionsWithClients/Slider/DesktopInteractionsSlide.tsx @@ -10,8 +10,8 @@ import { AnimatePresence, motion } from 'framer-motion'; export const DesktopInteractionSlide = forwardRef< { animationing: boolean }, - IInteraction & { active: boolean; onClick: () => void; bordered: boolean } ->(({ active, video, onClick, bordered, title }, ref) => { + IInteraction & { active: boolean; onClick: () => void } +>(({ active, video, onClick, title }, ref) => { const videoRef = useRef(null); const [animationing, setAnimationing] = useState(false); @@ -45,8 +45,7 @@ export const DesktopInteractionSlide = forwardRef< duration: 1, }} className={ - 'bg-[#14161F] first:border-l last:border-r flex flex-col transition-all border-[#3D425C] h-fit ' + - (bordered ? 'border' : 'border-y') + + 'bg-[#14161F] border flex flex-col border-[#3D425C] h-fit [&:not(:first-child)]:relative [&:not(:first-child)]:right-px [&:nth-child(3)]:right-0.5 [&:nth-child(4)]:right-[3px] ' + (active ? ' p-8 justify-between' : ' content-center justify-center') } > @@ -55,8 +54,9 @@ export const DesktopInteractionSlide = forwardRef< {title} diff --git a/src/components/InteractionsWithClients/Slider/DesktopInteractionsSlider.tsx b/src/components/InteractionsWithClients/Slider/DesktopInteractionsSlider.tsx index af64a7d..ad01eae 100644 --- a/src/components/InteractionsWithClients/Slider/DesktopInteractionsSlider.tsx +++ b/src/components/InteractionsWithClients/Slider/DesktopInteractionsSlider.tsx @@ -29,7 +29,7 @@ export function DesktopInteractionsSlider() { onRightClick={() => goToSlide('next')} className="flex justify-end" /> -
+
{interactions.map(({ video, title }, index) => ( goToSlide(index)} - bordered={index === current || Math.abs(index - current) === 2} ref={index === current ? currentSlideRef : null} /> ))} diff --git a/src/components/Layout/Footer.tsx b/src/components/Layout/Footer.tsx index e24168b..fa76ac5 100644 --- a/src/components/Layout/Footer.tsx +++ b/src/components/Layout/Footer.tsx @@ -23,7 +23,7 @@ export function Footer() {
- +
RU @@ -31,7 +31,7 @@ export function Footer() {
- +
diff --git a/src/components/Layout/Header.tsx b/src/components/Layout/Header.tsx index f30983d..eb17e14 100644 --- a/src/components/Layout/Header.tsx +++ b/src/components/Layout/Header.tsx @@ -103,6 +103,11 @@ function HashLink({ path, text }: { path: string; text: string }) { { + document + .getElementById(path.slice(2)) + ?.scrollIntoView({ behavior: 'smooth' }); + }} > {text} diff --git a/src/components/Motivation.tsx b/src/components/Motivation.tsx index f9e2a9c..ff962b2 100644 --- a/src/components/Motivation.tsx +++ b/src/components/Motivation.tsx @@ -3,9 +3,9 @@ import { Showreel } from './Showreel'; export function Motivation() { return ( -
-
-

+
+
+

Создаем интерактивные выставочные решения

@@ -19,6 +19,17 @@ export function Motivation() { key={solution} className="h4 font-medium flex gap-x-[7px]" to={`#${index === 0 ? 'vr_ar' : index == 1 ? 'interactive' : '3d_makets'}`} + onClick={() => + document + .getElementById( + index === 0 + ? 'vr_ar' + : index == 1 + ? 'interactive' + : '3d_makets', + ) + ?.scrollIntoView({ behavior: 'smooth', block: 'start' }) + } > {solution} {count} diff --git a/src/components/Promotion.tsx b/src/components/Promotion.tsx index 0237158..fd23fad 100644 --- a/src/components/Promotion.tsx +++ b/src/components/Promotion.tsx @@ -133,7 +133,7 @@ function DesktopFeature({ c.iso === currentCountry)?.flag} className="w-4 sm:w-6" - alt="" + alt={currentCountry} />

{currentPhoneCode}

c.iso === country)?.flag} - alt="" + alt={country} className="w-4 sm:w-6" />

{phoneCode}

diff --git a/src/components/icons/Logo.tsx b/src/components/icons/Logo.tsx index 9a0af70..cf46936 100644 --- a/src/components/icons/Logo.tsx +++ b/src/components/icons/Logo.tsx @@ -1,243 +1,238 @@ export function Logo() { return ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - + - + - + - + - + - + - + - - - ); diff --git a/src/components/icons/LogoWithoutText.tsx b/src/components/icons/LogoWithoutText.tsx index 44ae0f7..30365f6 100644 --- a/src/components/icons/LogoWithoutText.tsx +++ b/src/components/icons/LogoWithoutText.tsx @@ -1,148 +1,243 @@ export function LogoWithoutText() { return ( - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ); diff --git a/src/index.css b/src/index.css index 861986f..0e16698 100644 --- a/src/index.css +++ b/src/index.css @@ -16,7 +16,6 @@ body { *::-webkit-scrollbar-thumb { background-color: #798fff; - /* border: 3.5px solid transparent; */ border-radius: 4px; } @@ -26,21 +25,18 @@ body { @layer components { .h1 { - @apply -tracking-[.02em] text-[clamp(36px,36px+(100vw-360px)/1240*76,112px)] leading-[90%] - /* leading-[clamp(36px,36px+(100vw-360px)/1240*50.4,86.4px)]; */; + @apply -tracking-[.02em] text-[clamp(36px,36px+(100vw-360px)/1240*76,112px)] leading-[90%]; } .h2 { @apply -tracking-[.02em] text-[clamp(24px,24px+(100vw-360px)/1240*40,64px)] lg:leading-[90%] leading-none; } .h3 { - @apply text-[clamp(18px,18px+(100vw-360px)/1240*22,40px)] leading-none - /* leading-[clamp(22px,22px+(100vw-360px)/1240*6.8,28.8px)]; */; + @apply text-[clamp(18px,18px+(100vw-360px)/1240*22,40px)] leading-none; } .h4 { - @apply text-[clamp(14px,14px+(100vw-360px)/1240*6,20px)] leading-[120%] - /* leading-[clamp(17.6px,17.6px+(100vw-360px)/1240*6.4,24px)]; */; + @apply text-[clamp(14px,14px+(100vw-360px)/1240*6,20px)] leading-[120%]; } .accent { @@ -48,19 +44,13 @@ body { } .l-text { - @apply text-[clamp(14px,14px+(100vw-360px)/1240*6,20px)] leading-[135%] - /* leading-[clamp(21.6px,21.6px+(100vw-360px)/1240*5.4,27px)]; */; + @apply text-[clamp(14px,14px+(100vw-360px)/1240*6,20px)] leading-[135%]; } .m-text { - @apply text-[clamp(12px,12px+(100vw-360px)/1240*4,16px)] leading-[140%] - /* leading-[clamp(19.6px,19.6px+(100vw-360px)/1240*2.4,22.4px)]; */; + @apply text-[clamp(12px,12px+(100vw-360px)/1240*4,16px)] leading-[140%]; } - /* .l-caption { - @apply text-[clamp(14px,14px+(100vw-360px)/1240*2,16px)] leading-none; - } */ - .m-caption { @apply text-[clamp(10px,10px+(100vw-360px)/1240*2,12px)] leading-[clamp(12px,12px+(100vw-360px)/1240*2.4,14.4px)]; } @@ -74,30 +64,9 @@ body { } .descriptor { - @apply text-[clamp(14px,14px+(100vw-360px)/1240*2,16px)] leading-[120%] - /* leading-[clamp(15.6px,15.6px+(100vw-360px)/1240*2.6,18.2px)]; */; + @apply text-[clamp(14px,14px+(100vw-360px)/1240*2,16px)] leading-[120%]; } - /* .feedback-field:focus ~ .feedback-placeholder { - top: 0; - } - - .feedback-field:focus ~ .feedback-placeholder-2 { - opacity: 0; - } - - .feedback-field:valid ~ .feedback-placeholder { - top: 0; - } - - .feedback-field:valid ~ .feedback-placeholder-2 { - opacity: 0; - } - - .feedback-field::placeholder { - @apply lg:text-base text-sm font-semibold text-[#77787d]; - } */ - .text-gradient { -webkit-background-clip: text; -webkit-text-fill-color: transparent;