popovspiridon99/commit-it
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

upd

Browse Source
This commit is contained in:
popovspiridon99
2026-03-27 17:03:20 +09:00
parent bdb16d5935
commit 71c31b3477
28 changed files with 411 additions and 107 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
bun.lock
View File

@@ -6,6 +6,7 @@
"name": "commit-it",
"dependencies": {
"@tailwindcss/vite": "^4.2.2",
"embla-carousel-react": "^8.6.0",
"motion": "^12.38.0",
"react": "^19.2.4",
"react-dom": "^19.2.4",
@@ -265,6 +266,12 @@
"electron-to-chromium": ["electron-to-chromium@1.5.322", "", {}, "sha512-vFU34OcrvMcH66T+dYC3G4nURmgfDVewMIu6Q2urXpumAPSMmzvcn04KVVV8Opikq8Vs5nUbO/8laNhNRqSzYw=="],
"embla-carousel": ["embla-carousel@8.6.0", "", {}, "sha512-SjWyZBHJPbqxHOzckOfo8lHisEaJWmwd23XppYFYVh10bU66/Pn5tkVkbkCMZVdbUE5eTCI2nD8OyIP4Z+uwkA=="],
"embla-carousel-react": ["embla-carousel-react@8.6.0", "", { "dependencies": { "embla-carousel": "8.6.0", "embla-carousel-reactive-utils": "8.6.0" }, "peerDependencies": { "react": "^16.8.0 || ^17.0.1 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc" } }, "sha512-0/PjqU7geVmo6F734pmPqpyHqiM99olvyecY7zdweCw+6tKEXnrE90pBiBbMMU8s5tICemzpQ3hi5EpxzGW+JA=="],
"embla-carousel-reactive-utils": ["embla-carousel-reactive-utils@8.6.0", "", { "peerDependencies": { "embla-carousel": "8.6.0" } }, "sha512-fMVUDUEx0/uIEDM0Mz3dHznDhfX+znCCDCeIophYb1QGVM7YThSWX+wz11zlYwWFOr74b4QLGg0hrGPJeG2s4A=="],
"enhanced-resolve": ["enhanced-resolve@5.20.1", "", { "dependencies": { "graceful-fs": "^4.2.4", "tapable": "^2.3.0" } }, "sha512-Qohcme7V1inbAfvjItgw0EaxVX5q2rdVEZHRBrEQdRZTssLDGsL8Lwrznl8oQ/6kuTJONLaDcGjkNP247XEhcA=="],
"escalade": ["escalade@3.2.0", "", {}, "sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA=="],

1
package.json
View File

@@ -11,6 +11,7 @@
},
"dependencies": {
"@tailwindcss/vite": "^4.2.2",
"embla-carousel-react": "^8.6.0",
"motion": "^12.38.0",
"react": "^19.2.4",
"react-dom": "^19.2.4",

BIN
public/legal/Политика_обработки_персональных_данных_КОММИТ.pdf Normal file
View File

Binary file not shown.

BIN
public/licenses/sv_accr.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 104 KiB

BIN
public/licenses/sv_fuel.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 803 KiB

BIN
public/licenses/sv_jur.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 796 KiB

BIN
public/licenses/sv_kv.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 796 KiB

BIN
public/licenses/sv_resident.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 MiB

BIN
public/withLogo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 148 KiB

30
src/App.tsx
View File

@@ -14,6 +14,7 @@ import LicenseSection from './components/LicenseSection'
import MissionSection from './components/MissionSection'
import { TypingSpan } from './components/TypingSpan'
import DirectorSection from './components/DirectorSection'
import DiscussSection from './components/DiscussSection'
function App() {
const { scrollY } = useScroll()
@@ -80,11 +81,11 @@ function App() {
</div>
<form method="dialog" className='flex flex-col gap-4'>
<a onClick={handleLink} href="#about" className='text-xl text-gray-500 hover:text-blue-500'>О компании</a>
<a onClick={handleLink} href="#products" className='text-xl text-gray-500 hover:text-blue-500'>Программные продукты</a>
<a onClick={handleLink} href="#services" className='text-xl text-gray-500 hover:text-blue-500'>Услуги</a>
<a onClick={handleLink} href="#case" className='text-xl text-gray-500 hover:text-blue-500'>Главный кейс</a>
<a onClick={handleLink} href="#contacts" className='text-xl text-gray-500 hover:text-blue-500'>Контакты</a>
<a onClick={handleLink} href="#about" className='text-xl text-base-content/70 hover:text-blue-500'>О компании</a>
<a onClick={handleLink} href="#products" className='text-xl text-base-content/70 hover:text-blue-500'>Программные продукты</a>
<a onClick={handleLink} href="#services" className='text-xl text-base-content/70 hover:text-blue-500'>Услуги</a>
<a onClick={handleLink} href="#case" className='text-xl text-base-content/70 hover:text-blue-500'>Главный кейс</a>
<a onClick={handleLink} href="#contacts" className='text-xl text-base-content/70 hover:text-blue-500'>Контакты</a>
</form>
</div>
<form method="dialog" className="modal-backdrop backdrop-blur-xs">
@@ -115,22 +116,29 @@ function App() {
<div className='relative grid sm:grid-cols-2 h-auto grow gap-8 rounded-2xl bg-base-200 p-8'>
<div className='z-1 h-auto grow flex flex-col gap-4'>
<span className='text-xs text-gray-500 bg-base-100 rounded-2xl p-2 flex justify-center'>Все наши специалисты имеют профессиональное образование и опыт более 15 лет работы</span>
<span className='text-xs text-base-content/70 bg-base-100 rounded-2xl p-2 flex justify-center'>Все наши специалисты имеют профессиональное образование и опыт более 15 лет работы</span>
<div className='text-3xl grid grid-rows-[repeat(4,1fr)] md:grid-rows-[1fr_1fr]'>
<span className='row-span-2 md:row-span-1'>Программное обеспечение</span>
<div className='row-span-2 inline-flex flex-wrap w-full text-blue-400 h-min'>
<div className='row-span-2 inline-flex flex-wrap w-full text-blue-500 h-min'>
<TypingSpan typingSpeed={40} deletingSpeed={20} pauseTime={2000} />
</div>
{/* <span> — полный цикл разработки и технической поддержки</span> */}
</div>
<span className='text-gray-500'>
<span className='text-base-content/70'>
Берём ответственность за ваши ИТ-решения, снимая риски и операционную нагрузку, выступая надёжным технологическим партнёром по разработке и сопровождению
</span>
<div>
<a href='#discuss' className='btn btn-lg font-light bg-blue-500 text-white rounded-full'>
Консультация
</a>
</div>
<div className='flex flex-col gap-4'>
<span className='text-xs text-gray-500'>
<span className='text-xs text-base-content/70'>
✳︎ Работаем с такими языками программирования, как:
</span>
@@ -142,7 +150,7 @@ function App() {
))}
</div>
<span className='text-xs text-gray-500'>
<span className='text-xs text-base-content/70'>
✳︎ Работаем с такими программами, как:
</span>
@@ -215,6 +223,8 @@ function App() {
<CaseSection />
<DiscussSection />
<Footer />
</main>
)

9
src/components/Braces.tsx Normal file
View File

@@ -0,0 +1,9 @@
const Braces = ({ text }: { text: string }) => {
return (
<span className="text-blue-500 text-xs">
{`{ ${text} }`}
</span>
)
}
export default Braces

28
src/components/CardsSection.tsx
View File

@@ -1,5 +1,6 @@
import { motion, useMotionValueEvent, useScroll, useTransform } from "motion/react"
import { useRef, useState } from "react"
import Braces from "./Braces"
const CardsSection = () => {
const containerRef = useRef(null)
@@ -25,15 +26,15 @@ const CardsSection = () => {
return (
<div ref={containerRef} style={{ height: "300vh" }} className='p-2 sm:p-0 flex justify-center overflow-clip'>
<div style={{ position: "sticky", top: 0, height: "100vh" }} className='py-16 sm:py-24 max-w-7xl overflow-clip'>
<div style={{ position: "sticky", top: 0, height: "100vh" }} className='min-h-screen flex flex-col py-16 sm:py-24 max-w-7xl overflow-clip'>
<div className='w-full flex justify-center mb-8'>
<span className='px-4 text-3xl sm:text-4xl sm:text-center'>
<span className='text-blue-400'>Преимущества</span> работы с нами
<span className='px-4 text-3xl sm:text-4xl py-2 sm:text-center'>
<span className='text-blue-500'>Преимущества</span> работы с нами
</span>
</div>
<motion.div
className='hidden sm:grid grid-cols-4 overflow-visible'
className='hidden sm:grid grid-cols-4 overflow-visible h-min min-h-96'
>
{items.map((item, index) => (
<motion.div
@@ -43,14 +44,12 @@ const CardsSection = () => {
marginLeft: `${xValue * index}px`,
zIndex: index,
}}>
<span className="text-blue-500 text-xs">
{`{${index + 1}}`}
</span>
<Braces text={(index + 1).toString()} />
<span className='text-xl'>
{item.label}
</span>
<span className="text-gray-500">
<span className="text-base-content/70">
{item.description}
</span>
@@ -73,9 +72,9 @@ const CardsSection = () => {
return (
<motion.div
key={item.id}
className="absolute grid grid-rows-[min-content_min-content_min-content_1fr] gap-2 w-full px-8 pt-4 h-min shrink-0 overflow-visible"
className="absolute grid grid-rows-[min-content_min-content_min-content_1fr] gap-2 w-full px-8 pt-4 h-auto shrink-0 overflow-visible"
style={{
top: index === items.length - 1 ? '0%' : `${100 * (progress)+ (5 * (n - index - 1))}%`, // from bottom → top
top: index === items.length - 1 ? '0%' : `${100 * (progress) + (5 * (n - index - 1))}%`, // from bottom → top
zIndex: n - index,
}}
initial={{ opacity: 0, y: 20 }}
@@ -83,14 +82,15 @@ const CardsSection = () => {
transition={{ duration: 0.4 }}
viewport={{ once: true, margin: "-100px" }}
>
<span className="text-blue-500 text-xs">
{`{${n - index}}`}
</span>
<Braces
text={(n - index).toString()}
/>
<span className='text-xl'>
{item.label}
</span>
<span className="text-gray-500">
<span className="text-base-content/70">
{item.description}
</span>

12
src/components/Carousel.css Normal file
View File

@@ -0,0 +1,12 @@
.embla__viewport {
overflow: hidden;
}
.embla__container {
display: flex;
touch-action: pan-y pinch-zoom;
}
.embla__slide {
min-width: 0;
}

82
src/components/Carousel.tsx Normal file
View File

@@ -0,0 +1,82 @@
import { useState, useEffect } from 'react'
import useEmblaCarousel from 'embla-carousel-react'
import './Carousel.css'
import { motion } from 'motion/react'
export default function Carousel({ images }: { images: string[] }) {
const [emblaRef, emblaApi] = useEmblaCarousel({
loop: true,
slidesToScroll: 1,
align: 'start'
})
const [selectedImage, setSelectedImage] = useState<string | null>(null)
const scrollPrev = () => emblaApi?.scrollPrev()
const scrollNext = () => emblaApi?.scrollNext()
// close on ESC
useEffect(() => {
const handler = (e: KeyboardEvent) => {
if (e.key === 'Escape') setSelectedImage(null)
}
window.addEventListener('keydown', handler)
return () => window.removeEventListener('keydown', handler)
}, [])
return (
<>
<div className="embla">
<div className="embla__viewport" ref={emblaRef}>
<div className="embla__container">
{images.map((image, i) => (
<div
key={i}
className="embla__slide shrink-0 grow-0 flex basis-1/2 sm:basis-1/4 cursor-pointer"
onClick={() => setSelectedImage(image)}
>
<img
src={image}
className="w-full h-full object-cover rounded-lg"
/>
</div>
))}
</div>
</div>
<div className='flex flex-row gap-4 w-full justify-center mt-8'>
<button onClick={scrollPrev} className='cursor-pointer'>
<svg width="42" height="42" viewBox="0 0 42 42" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="21" cy="21" r="21" fill="#FBFBFB" />
<path d="M21 0C32.598 0 42 9.40202 42 21C42 32.598 32.598 42 21 42C9.40202 42 0 32.598 0 21C0 9.40202 9.40202 0 21 0ZM20.707 14.793C20.3165 14.4024 19.6835 14.4024 19.293 14.793L13.293 20.793C12.9024 21.1835 12.9024 21.8165 13.293 22.207L19.293 28.207C19.6835 28.5976 20.3165 28.5976 20.707 28.207C21.0976 27.8165 21.0976 27.1835 20.707 26.793L16.4141 22.5H28C28.5523 22.5 29 22.0523 29 21.5C29 20.9477 28.5523 20.5 28 20.5H16.4141L20.707 16.207C21.0976 15.8165 21.0976 15.1835 20.707 14.793Z" fill="#1C8EFF" />
</svg>
</button>
<button onClick={scrollNext} className='cursor-pointer'>
<svg width="42" height="42" viewBox="0 0 42 42" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="21" cy="21" r="21" fill="#FBFBFB" />
<path d="M21 0C32.598 0 42 9.40202 42 21C42 32.598 32.598 42 21 42C9.40202 42 0 32.598 0 21C0 9.40202 9.40202 0 21 0ZM22.707 14.793C22.3165 14.4024 21.6835 14.4024 21.293 14.793C20.9024 15.1835 20.9024 15.8165 21.293 16.207L25.5859 20.5H14C13.4477 20.5 13 20.9477 13 21.5C13 22.0523 13.4477 22.5 14 22.5H25.5859L21.293 26.793C20.9024 27.1835 20.9024 27.8165 21.293 28.207C21.6835 28.5976 22.3165 28.5976 22.707 28.207L28.707 22.207C29.0976 21.8165 29.0976 21.1835 28.707 20.793L22.707 14.793Z" fill="#1C8EFF" />
</svg>
</button>
</div>
</div>
{/* Modal */}
{selectedImage && (
<motion.div
className="fixed inset-0 bg-black/50 backdrop-blur-xs z-50 flex items-center justify-center"
onClick={() => setSelectedImage(null)}
>
<img
src={selectedImage}
className="max-h-screen max-w-screen object-contain"
onClick={(e) => e.stopPropagation()}
/>
</motion.div>
)}
</>
)
}

51
src/components/CaseSection.tsx
View File

@@ -1,9 +1,19 @@
import CheckLabel from "./CheckLabel"
const CaseSection = () => {
const done = [
'Модернизация биллинговых систем (физ. и юр. лица)',
'Внедрение ПО «Топливо и транспорт»',
'Запуск чат-бота и личного кабинета',
'Модернизация серверного оборудования',
'Внедрение IP-телефонии'
]
return (
<section id='case' className='max-w-7xl w-full h-auto'>
<div className='w-full h-auto flex flex-col items-center mb-8 p-2 xl:p-0'>
<span className='px-4 text-3xl sm:text-4xl sm:text-center my-8'>
Главный <span className='text-blue-400'>кейс</span>
Главный <span className='text-blue-500'>кейс</span>
</span>
<div className='rounded-2xl h-full overflow-hidden grid grid-cols-1 sm:grid-cols-2 font-light'>
@@ -46,46 +56,15 @@ const CaseSection = () => {
<div className='flex flex-col gap-4 bg-base-300 p-4'>
<div className='p-8 bg-base-100 flex flex-col gap-4 rounded-2xl'>
<span className='text-xl'>Основная задача:</span>
<span className='text-gray-500'>Реализация стратегии цифровой трансформации</span>
<span className='text-base-content/70'>Реализация стратегии цифровой трансформации</span>
</div>
<div className='p-8 bg-base-100 rounded-2xl flex flex-col gap-4'>
<span className='text-xl'>Выполненные работы:</span>
<div className='flex flex-col gap-6'>
<div className='flex flex-row gap-2'>
<svg className='shrink-0' width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11 2.0625C6.07191 2.0625 2.0625 6.07191 2.0625 11C2.0625 15.9281 6.07191 19.9375 11 19.9375C15.9281 19.9375 19.9375 15.9281 19.9375 11C19.9375 6.07191 15.9281 2.0625 11 2.0625ZM15.6514 8.00465L9.87637 14.8796C9.81302 14.9551 9.73419 15.0161 9.64523 15.0584C9.55627 15.1007 9.45925 15.1234 9.36074 15.125H9.34914C9.25278 15.125 9.1575 15.1047 9.06948 15.0654C8.98147 15.0262 8.90269 14.9689 8.83824 14.8973L6.36324 12.1473C6.30039 12.0806 6.25149 12.002 6.21943 11.9162C6.18737 11.8304 6.17279 11.739 6.17655 11.6474C6.1803 11.5559 6.20232 11.466 6.24131 11.3831C6.2803 11.3002 6.33547 11.2259 6.40358 11.1646C6.47169 11.1033 6.55136 11.0563 6.63791 11.0262C6.72447 10.9961 6.81616 10.9837 6.9076 10.9896C6.99904 10.9954 7.08838 11.0195 7.17037 11.0604C7.25236 11.1013 7.32534 11.1582 7.38504 11.2277L9.33109 13.3899L14.5986 7.12035C14.7168 6.98375 14.884 6.89912 15.064 6.88478C15.244 6.87043 15.4225 6.92751 15.5608 7.04368C15.6991 7.15985 15.7861 7.32578 15.8031 7.5056C15.82 7.68542 15.7655 7.86469 15.6514 8.00465Z" fill="#1C8EFF" />
</svg>
<span className='text-gray-500'>Модернизация биллинговых систем (физ. и юр. лица)</span>
</div>
<div className='flex flex-row gap-2'>
<svg className='shrink-0' width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11 2.0625C6.07191 2.0625 2.0625 6.07191 2.0625 11C2.0625 15.9281 6.07191 19.9375 11 19.9375C15.9281 19.9375 19.9375 15.9281 19.9375 11C19.9375 6.07191 15.9281 2.0625 11 2.0625ZM15.6514 8.00465L9.87637 14.8796C9.81302 14.9551 9.73419 15.0161 9.64523 15.0584C9.55627 15.1007 9.45925 15.1234 9.36074 15.125H9.34914C9.25278 15.125 9.1575 15.1047 9.06948 15.0654C8.98147 15.0262 8.90269 14.9689 8.83824 14.8973L6.36324 12.1473C6.30039 12.0806 6.25149 12.002 6.21943 11.9162C6.18737 11.8304 6.17279 11.739 6.17655 11.6474C6.1803 11.5559 6.20232 11.466 6.24131 11.3831C6.2803 11.3002 6.33547 11.2259 6.40358 11.1646C6.47169 11.1033 6.55136 11.0563 6.63791 11.0262C6.72447 10.9961 6.81616 10.9837 6.9076 10.9896C6.99904 10.9954 7.08838 11.0195 7.17037 11.0604C7.25236 11.1013 7.32534 11.1582 7.38504 11.2277L9.33109 13.3899L14.5986 7.12035C14.7168 6.98375 14.884 6.89912 15.064 6.88478C15.244 6.87043 15.4225 6.92751 15.5608 7.04368C15.6991 7.15985 15.7861 7.32578 15.8031 7.5056C15.82 7.68542 15.7655 7.86469 15.6514 8.00465Z" fill="#1C8EFF" />
</svg>
<span className='text-gray-500'>Внедрение ПО «Топливо и транспорт»</span>
</div>
<div className='flex flex-row gap-2'>
<svg className='shrink-0' width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11 2.0625C6.07191 2.0625 2.0625 6.07191 2.0625 11C2.0625 15.9281 6.07191 19.9375 11 19.9375C15.9281 19.9375 19.9375 15.9281 19.9375 11C19.9375 6.07191 15.9281 2.0625 11 2.0625ZM15.6514 8.00465L9.87637 14.8796C9.81302 14.9551 9.73419 15.0161 9.64523 15.0584C9.55627 15.1007 9.45925 15.1234 9.36074 15.125H9.34914C9.25278 15.125 9.1575 15.1047 9.06948 15.0654C8.98147 15.0262 8.90269 14.9689 8.83824 14.8973L6.36324 12.1473C6.30039 12.0806 6.25149 12.002 6.21943 11.9162C6.18737 11.8304 6.17279 11.739 6.17655 11.6474C6.1803 11.5559 6.20232 11.466 6.24131 11.3831C6.2803 11.3002 6.33547 11.2259 6.40358 11.1646C6.47169 11.1033 6.55136 11.0563 6.63791 11.0262C6.72447 10.9961 6.81616 10.9837 6.9076 10.9896C6.99904 10.9954 7.08838 11.0195 7.17037 11.0604C7.25236 11.1013 7.32534 11.1582 7.38504 11.2277L9.33109 13.3899L14.5986 7.12035C14.7168 6.98375 14.884 6.89912 15.064 6.88478C15.244 6.87043 15.4225 6.92751 15.5608 7.04368C15.6991 7.15985 15.7861 7.32578 15.8031 7.5056C15.82 7.68542 15.7655 7.86469 15.6514 8.00465Z" fill="#1C8EFF" />
</svg>
<span className='text-gray-500'>Запуск чат-бота и личного кабинета</span>
</div>
<div className='flex flex-row gap-2'>
<svg className='shrink-0' width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11 2.0625C6.07191 2.0625 2.0625 6.07191 2.0625 11C2.0625 15.9281 6.07191 19.9375 11 19.9375C15.9281 19.9375 19.9375 15.9281 19.9375 11C19.9375 6.07191 15.9281 2.0625 11 2.0625ZM15.6514 8.00465L9.87637 14.8796C9.81302 14.9551 9.73419 15.0161 9.64523 15.0584C9.55627 15.1007 9.45925 15.1234 9.36074 15.125H9.34914C9.25278 15.125 9.1575 15.1047 9.06948 15.0654C8.98147 15.0262 8.90269 14.9689 8.83824 14.8973L6.36324 12.1473C6.30039 12.0806 6.25149 12.002 6.21943 11.9162C6.18737 11.8304 6.17279 11.739 6.17655 11.6474C6.1803 11.5559 6.20232 11.466 6.24131 11.3831C6.2803 11.3002 6.33547 11.2259 6.40358 11.1646C6.47169 11.1033 6.55136 11.0563 6.63791 11.0262C6.72447 10.9961 6.81616 10.9837 6.9076 10.9896C6.99904 10.9954 7.08838 11.0195 7.17037 11.0604C7.25236 11.1013 7.32534 11.1582 7.38504 11.2277L9.33109 13.3899L14.5986 7.12035C14.7168 6.98375 14.884 6.89912 15.064 6.88478C15.244 6.87043 15.4225 6.92751 15.5608 7.04368C15.6991 7.15985 15.7861 7.32578 15.8031 7.5056C15.82 7.68542 15.7655 7.86469 15.6514 8.00465Z" fill="#1C8EFF" />
</svg>
<span className='text-gray-500'>Модернизация серверного оборудования</span>
</div>
<div className='flex flex-row gap-2'>
<svg className='shrink-0' width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11 2.0625C6.07191 2.0625 2.0625 6.07191 2.0625 11C2.0625 15.9281 6.07191 19.9375 11 19.9375C15.9281 19.9375 19.9375 15.9281 19.9375 11C19.9375 6.07191 15.9281 2.0625 11 2.0625ZM15.6514 8.00465L9.87637 14.8796C9.81302 14.9551 9.73419 15.0161 9.64523 15.0584C9.55627 15.1007 9.45925 15.1234 9.36074 15.125H9.34914C9.25278 15.125 9.1575 15.1047 9.06948 15.0654C8.98147 15.0262 8.90269 14.9689 8.83824 14.8973L6.36324 12.1473C6.30039 12.0806 6.25149 12.002 6.21943 11.9162C6.18737 11.8304 6.17279 11.739 6.17655 11.6474C6.1803 11.5559 6.20232 11.466 6.24131 11.3831C6.2803 11.3002 6.33547 11.2259 6.40358 11.1646C6.47169 11.1033 6.55136 11.0563 6.63791 11.0262C6.72447 10.9961 6.81616 10.9837 6.9076 10.9896C6.99904 10.9954 7.08838 11.0195 7.17037 11.0604C7.25236 11.1013 7.32534 11.1582 7.38504 11.2277L9.33109 13.3899L14.5986 7.12035C14.7168 6.98375 14.884 6.89912 15.064 6.88478C15.244 6.87043 15.4225 6.92751 15.5608 7.04368C15.6991 7.15985 15.7861 7.32578 15.8031 7.5056C15.82 7.68542 15.7655 7.86469 15.6514 8.00465Z" fill="#1C8EFF" />
</svg>
<span className='text-gray-500'>Внедрение IP-телефонии</span>
</div>
{done.map(text => (
<CheckLabel text={text}/>
))}
</div>
</div>

16
src/components/CheckLabel.tsx Normal file
View File

@@ -0,0 +1,16 @@
const CheckLabel = ({
text
}: {
text: string
}) => {
return (
<div className='flex flex-row gap-2'>
<svg className='shrink-0' width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11 2.0625C6.07191 2.0625 2.0625 6.07191 2.0625 11C2.0625 15.9281 6.07191 19.9375 11 19.9375C15.9281 19.9375 19.9375 15.9281 19.9375 11C19.9375 6.07191 15.9281 2.0625 11 2.0625ZM15.6514 8.00465L9.87637 14.8796C9.81302 14.9551 9.73419 15.0161 9.64523 15.0584C9.55627 15.1007 9.45925 15.1234 9.36074 15.125H9.34914C9.25278 15.125 9.1575 15.1047 9.06948 15.0654C8.98147 15.0262 8.90269 14.9689 8.83824 14.8973L6.36324 12.1473C6.30039 12.0806 6.25149 12.002 6.21943 11.9162C6.18737 11.8304 6.17279 11.739 6.17655 11.6474C6.1803 11.5559 6.20232 11.466 6.24131 11.3831C6.2803 11.3002 6.33547 11.2259 6.40358 11.1646C6.47169 11.1033 6.55136 11.0563 6.63791 11.0262C6.72447 10.9961 6.81616 10.9837 6.9076 10.9896C6.99904 10.9954 7.08838 11.0195 7.17037 11.0604C7.25236 11.1013 7.32534 11.1582 7.38504 11.2277L9.33109 13.3899L14.5986 7.12035C14.7168 6.98375 14.884 6.89912 15.064 6.88478C15.244 6.87043 15.4225 6.92751 15.5608 7.04368C15.6991 7.15985 15.7861 7.32578 15.8031 7.5056C15.82 7.68542 15.7655 7.86469 15.6514 8.00465Z" fill="#1C8EFF" />
</svg>
<span className='text-base-content/70'>{text}</span>
</div>
)
}
export default CheckLabel

10
src/components/DirectorSection.tsx
View File

@@ -1,15 +1,13 @@
import React from 'react'
import Braces from "./Braces"
const DirectorSection = () => {
return (
<div className='w-full max-w-7xl grid grid-cols-3 gap-4 p-2 xl:p-2'>
<div className='w-full max-w-7xl grid grid-cols-3 gap-4 px-2 py-4 xl:p-0'>
<div className='col-span-1'>
<img src='/director.png' />
</div>
<div className='col-span-2 flex flex-col gap-2 sm:gap-8 font-light'>
<span className="text-blue-500 text-xs">
{`{ Наша миссия }`}
</span>
<Braces text={'Наша миссия'} />
<div className='w-4 sm:w-10 flex'>
<svg className='h-auto w-auto' width="40" height="31" viewBox="0 0 40 31" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3.55112 28.3277C1.24054 25.8481 0 23.067 0 18.5587C0 10.6257 5.51175 3.51546 13.527 0L15.5303 3.12335C8.0489 7.21225 6.58628 12.5183 6.00303 15.8638C7.20767 15.2337 8.7847 15.0138 10.3303 15.1589C14.3772 15.5374 17.5672 18.8942 17.5672 23.067C17.5672 25.1709 16.74 27.1887 15.2675 28.6765C13.7951 30.1642 11.798 31 9.71566 31C8.56407 30.99 7.42597 30.7485 6.36763 30.2897C5.30929 29.8309 4.35186 29.164 3.55112 28.3277ZM25.984 28.3277C23.6734 25.8481 22.4328 23.067 22.4328 18.5587C22.4328 10.6257 27.9446 3.51546 35.9598 0L37.9631 3.12335C30.4817 7.21225 29.0191 12.5183 28.4359 15.8638C29.6405 15.2337 31.2175 15.0138 32.7632 15.1589C36.8101 15.5374 40 18.8942 40 23.067C40 25.1709 39.1728 27.1887 37.7004 28.6765C36.2279 30.1642 34.2309 31 32.1485 31C30.9969 30.99 29.8588 30.7485 28.8005 30.2897C27.7421 29.8309 26.7847 29.164 25.984 28.3277Z" fill="black" />
@@ -23,7 +21,7 @@ const DirectorSection = () => {
<div className='flex flex-row justify-end mt-auto'>
<span className='flex flex-col gap-4 text-end mb-8'>
<span className='text-lg sm:text-xl'>— Саввинов Николай Афанасьевич</span>
<span className='text-sm text-gray-500'>директор ООО «КОММИТ»</span>
<span className='text-sm text-base-content/70'>директор ООО «КОММИТ»</span>
</span>
</div>

84
src/components/DiscussSection.tsx Normal file
View File

@@ -0,0 +1,84 @@
import CheckLabel from './CheckLabel'
import Braces from './Braces'
import Thesis from './Thesis'
const DiscussSection = () => {
return (
<section id='discuss' className='max-w-7xl w-full h-auto flex flex-col sm:grid sm:grid-cols-5 gap-4'>
<div className='flex flex-col col-span-3 gap-4 p-8'>
<span className='text-3xl sm:text-4xl'>
Обсудить <span className='text-blue-500'>проект</span>
</span>
<span className='text-base-content/70'>
От концепции до релиза — подберём оптимальную стратегию разработки за 1 рабочий день
</span>
<CheckLabel text='Ответим в течение 1 рабочего дня' />
<CheckLabel text='Оценка стоимости и сроков' />
<CheckLabel text='Обсудим формат сотрудничества' />
<form className='flex flex-col gap-4'>
<input type="name" placeholder="Введите ваше имя *" required className="input rounded-full w-full" />
<input type="tel" placeholder="+7(000)000-00-00 *" required className="input rounded-full w-full" />
<input type="email" placeholder="mail@company.ru *" required className="input validator rounded-full w-full" />
<textarea className="textarea rounded-2xl w-full" placeholder="Опишите вашу ситуацию (необязательно)"></textarea>
<label className="label flex flex-row items-start">
<input type="checkbox" defaultChecked className="mt-1 checkbox checkbox-xs checked:border-blue-500 checked:bg-blue-400 checked:text-white rounded-sm" />
<span className='text-wrap'>
Я согласен(-на) с условиями <a className='text-blue-500'>Политики конфиденциальности</a> и разрешаю обработку моих персональных данных согласно <a className='text-blue-500'>Политики обработки персональных данных</a>
</span>
</label>
<button className='btn btn-lg bg-blue-500 text-white rounded-full'>
Оставить заявку
</button>
<span className='text-base-content/70'>Отправляя форму, вы даёте согласие на обработку ваших персональных данных (ФИО, номер телефона, электронную почту и комментарий) для связи c вами и обработки вашей заявки. Данные будут храниться в течение <span className='underline text-blue-500'>12 месяцев</span>. Вы можете отозвать своё согласие в любой момент</span>
</form>
</div>
<div className='flex flex-col col-span-2 bg-base-200 rounded-2xl gap-8'>
<div className='flex flex-col p-8 gap-8'>
<Braces text='С нами надёжно и безопасно' />
<div className='flex flex-col gap-4'>
<Thesis info={{
icon: <svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="11" cy="11" r="11" fill="#1C8EFF" />
<path d="M5.75008 15.0837H6.33341V7.71036C6.33343 7.52669 6.39125 7.34768 6.49866 7.1987C6.60608 7.04972 6.75766 6.93832 6.93191 6.88028L11.5986 5.32511C11.7301 5.2813 11.8701 5.26937 12.0072 5.2903C12.1442 5.31123 12.2743 5.36441 12.3868 5.44547C12.4992 5.52654 12.5908 5.63315 12.654 5.75655C12.7171 5.87994 12.7501 6.01657 12.7501 6.15519V15.0837H13.3334V9.82786C13.3334 9.78472 13.343 9.74213 13.3615 9.70315C13.38 9.66417 13.4069 9.62977 13.4402 9.60243C13.4736 9.57509 13.5126 9.55549 13.5545 9.54505C13.5963 9.5346 13.6399 9.53357 13.6822 9.54203L14.9632 9.79869C15.1615 9.83832 15.34 9.94541 15.4682 10.1017C15.5965 10.2581 15.6666 10.454 15.6667 10.6562V15.0837H16.2501C16.4048 15.0837 16.5532 15.1451 16.6626 15.2545C16.772 15.3639 16.8334 15.5123 16.8334 15.667C16.8334 15.8217 16.772 15.9701 16.6626 16.0795C16.5532 16.1889 16.4048 16.2504 16.2501 16.2504H5.75008C5.59537 16.2504 5.447 16.1889 5.3376 16.0795C5.22821 15.9701 5.16675 15.8217 5.16675 15.667C5.16675 15.5123 5.22821 15.3639 5.3376 15.2545C5.447 15.1451 5.59537 15.0837 5.75008 15.0837Z" fill="white" />
</svg>
, title: '110+ компаний', description: 'Уже доверили нам разработку ПО'
}} />
<Thesis info={{
icon: <svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="11" cy="11" r="11" fill="#1C8EFF" />
<path d="M10.2999 11.953L9.11059 10.7637C9.04525 10.6988 8.96859 10.6643 8.88059 10.6603C8.79259 10.6563 8.71192 10.6908 8.63859 10.7637C8.56525 10.8366 8.52836 10.9159 8.52792 11.0017C8.52747 11.0874 8.56436 11.1668 8.63859 11.2397L9.92325 12.5277C10.0308 12.6357 10.1564 12.6897 10.2999 12.6897C10.4435 12.6897 10.5693 12.6357 10.6773 12.5277L13.3693 9.83567C13.4341 9.77078 13.4688 9.69367 13.4733 9.60433C13.4777 9.515 13.443 9.43367 13.3693 9.36033C13.2955 9.287 13.2161 9.25011 13.1313 9.24967C13.0464 9.24922 12.9673 9.28611 12.8939 9.36033L10.2999 11.953ZM10.9999 16.895C10.9395 16.895 10.8759 16.8894 10.8093 16.8783C10.7426 16.8672 10.6801 16.8506 10.6219 16.8283C9.30947 16.3279 8.26659 15.4797 7.49325 14.2837C6.71992 13.0877 6.33325 11.793 6.33325 10.3997V7.54433C6.33325 7.31767 6.39881 7.11256 6.52992 6.929C6.66103 6.74544 6.82881 6.61211 7.03325 6.529L10.6233 5.19567C10.753 5.14856 10.8786 5.125 10.9999 5.125C11.1213 5.125 11.247 5.14856 11.3773 5.19567L14.9666 6.529C15.171 6.61211 15.3388 6.74544 15.4699 6.929C15.601 7.11256 15.6666 7.31767 15.6666 7.54433V10.3997C15.6666 11.793 15.2799 13.0877 14.5066 14.2837C13.7333 15.4797 12.6904 16.3277 11.3779 16.8277C11.3201 16.8499 11.2579 16.8666 11.1913 16.8777C11.1246 16.8888 11.0608 16.8943 10.9999 16.8943" fill="white" />
</svg>
, title: '15+ лет опыта', description: 'Оценка стоимости и сроков'
}} />
</div>
<div className='flex flex-col gap-2 p-4 bg-base-100 rounded-2xl'>
<Thesis showDescription={false} info={{
icon: <svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="11" cy="11" r="11" fill="#1C8EFF" />
<path d="M11 8.66634C11.1547 8.66634 11.3031 8.7278 11.4125 8.8372C11.5219 8.94659 11.5833 9.09496 11.5833 9.24967C11.5833 9.40438 11.5219 9.55276 11.4125 9.66215C11.3031 9.77155 11.1547 9.83301 11 9.83301C10.8453 9.83301 10.6969 9.77155 10.5875 9.66215C10.4781 9.55276 10.4167 9.40438 10.4167 9.24967C10.4167 9.09496 10.4781 8.94659 10.5875 8.8372C10.6969 8.7278 10.8453 8.66634 11 8.66634ZM16.25 10.4163C16.25 13.6538 14.01 16.6813 11 17.4163C7.99 16.6813 5.75 13.6538 5.75 10.4163V6.91634L11 4.58301L16.25 6.91634V10.4163ZM11 7.49967C10.5359 7.49967 10.0908 7.68405 9.76256 8.01224C9.43437 8.34043 9.25 8.78555 9.25 9.24967C9.25 10.0138 9.73417 10.6613 10.4167 10.9005V14.4997H11.5833V13.333H12.75V12.1663H11.5833V10.9005C12.2658 10.6613 12.75 10.0138 12.75 9.24967C12.75 8.78555 12.5656 8.34043 12.2374 8.01224C11.9092 7.68405 11.4641 7.49967 11 7.49967Z" fill="white" />
</svg>
, title: 'Ваши данные под защитой', description: 'Мы используем SSL-шифрование и обеспечиваем полную защиту ваших данных'
}} />
<span className='text-sm text-base-content/70 font-light'>Мы используем SSL-шифрование и обеспечиваем полную защиту ваших данных</span>
</div>
</div>
<div className='flex justify-center'>
<img src='/withLogo.png' />
</div>
</div>
</section>
)
}
export default DiscussSection

33
src/components/Footer.tsx
View File

@@ -8,46 +8,41 @@ const Footer = () => {
<img className='dark:invert dark:hue-rotate-180' width={200} src='/logo-commit.png' />
</div>
<span className='text-gray-500'>Разработка и сопровождение программного обеспечения для сферы ЖКХ и государственных организаций</span>
<span className='text-base-content/70'>Разработка и сопровождение программного обеспечения для сферы ЖКХ и государственных организаций</span>
</div>
<div className='flex flex-col text-nowrap gap-4 text-gray-500'>
<div className='flex flex-col text-nowrap gap-4 text-base-content/70'>
<span className='text-2xl text-base-content'>Компания</span>
<a href='#about'>О компании</a>
<a href='#products'>Программные продукты</a>
<a href='#seervices'>Услуги</a>
<a href='#case'>Портфолио</a>
<a href='#about' className='text-base-content/70 hover:text-blue-500'>О компании</a>
<a href='#products' className='text-base-content/70 hover:text-blue-500'>Программные продукты</a>
<a href='#seervices' className='text-base-content/70 hover:text-blue-500'>Услуги</a>
<a href='#case' className='text-base-content/70 hover:text-blue-500'>Портфолио</a>
</div>
<div className='flex flex-col text-nowrap gap-4 text-gray-500'>
<div className='flex flex-col text-nowrap gap-4 text-base-content/70'>
<span className='text-2xl text-base-content'>Контакты</span>
<a>commit23@mail.ru</a>
<span>+7(914)273-90-20</span>
</div>
<a className='text-base-content/70 hover:text-blue-500' href="mailto:commit23@mail.ru">commit23@mail.ru</a>
<a className='text-base-content/70 hover:text-blue-500' href="tel:+79142739020">+7 (914) 273-90-20</a>
<div className='flex flex-col gap-4 text-gray-500'>
<span className='text-2xl text-base-content'>Юридический адрес</span>
<span>{`677021, Республика Саха (Якутия),
г. Якутск, ул. К.Д. Уткина, д. 20, стр. 1`}</span>
<span className="text-wrap">{`677021, Республика Саха (Якутия), г. Якутск, ул. К.Д. Уткина, д. 20, стр. 1`}</span>
</div>
</div>
<hr className="my-4 border-gray-300" />
<div className='grid grid-cols-2'>
<span className='flex flex-col text-gray-500'>
<span className='flex flex-col text-base-content/70'>
<span>ООО «КОММИТ»</span>
<span>ИНН 1400023251</span>
<span>ОГРН 1231400006232</span>
</span>
<div className='flex flex-col text-gray-500'>
<a href='#'>Политика конфиденциальности</a>
<a href='#'>Политика обработки персональных данных</a>
<div className='flex flex-col text-base-content/70'>
<a className="hover:text-blue-500" target="_blank" href='/legal/Политика_обработки_персональных_данных_КОММИТ.pdf'>Политика обработки персональных данных</a>
</div>
</div>
<span className='text-gray-500'>Ⓒ 2026 Все права защищены. Информация на сайте имеет исключительно справочно-маркетинговую направленность и не является публичной офертой</span>
<span className='text-base-content/70'>Ⓒ 2026 Все права защищены. Информация на сайте имеет исключительно справочно-маркетинговую направленность и не является публичной офертой</span>
<div className='w-full flex justify-center'>
<svg width="1421" height="150" viewBox="0 0 1421 150" fill="none" xmlns="http://www.w3.org/2000/svg">

20
src/components/LicenseSection.tsx
View File

@@ -1,10 +1,24 @@
import Carousel from "./Carousel"
const LicenseSection = () => {
const licenses = [
'/licenses/sv_fuel.png',
'/licenses/sv_jur.png',
'/licenses/sv_kv.png',
'/licenses/sv_resident.png',
'/licenses/sv_accr.png',
]
return (
<section id='case' className='max-w-7xl w-full h-auto'>
<div className='w-full h-auto flex flex-col items-center mb-8'>
<section id='case' className='max-w-7xl w-full h-auto px-2 xl:px-0'>
<div className='w-full h-auto flex flex-col items-center py-8 bg-base-200 rounded-2xl'>
<span className='px-4 text-3xl sm:text-4xl sm:text-center my-8'>
<span className='text-blue-400'>Наши</span> лицензии и сертификаты
<span className='text-blue-500'>Наши</span> лицензии и сертификаты
</span>
<div>
<Carousel images={licenses} />
</div>
</div>
</section>
)

10
src/components/Navbar.tsx
View File

@@ -5,11 +5,11 @@ const Navbar = () => {
<img className="dark:invert dark:hue-rotate-180" width={200} src='/logo-commit.png' />
</div>
<nav className='p-4 hidden sm:flex'>
<a href="#about" className='text-sm mx-4 text-gray-500 hover:text-blue-500'>О компании</a>
<a href="#products" className='text-sm mx-4 text-gray-500 hover:text-blue-500'>Программные продукты</a>
<a href="#services" className='text-sm mx-4 text-gray-500 hover:text-blue-500'>Услуги</a>
<a href="#case" className='text-sm mx-4 text-gray-500 hover:text-blue-500'>Главный кейс</a>
<a href="#contacts" className='text-sm mx-4 text-gray-500 hover:text-blue-500'>Контакты</a>
<a href="#about" className='text-sm mx-4 text-base-content/70 hover:text-blue-500'>О компании</a>
<a href="#products" className='text-sm mx-4 text-base-content/70tent/70 hover:text-blue-500'>Программные продукты</a>
<a href="#services" className='text-sm mx-4 text-base-content/70 hover:text-blue-500'>Услуги</a>
<a href="#case" className='text-sm mx-4 text-base-content/70 hover:text-blue-500'>Главный кейс</a>
<a href="#contacts" className='text-sm mx-4 text-base-content/70 hover:text-blue-500'>Контакты</a>
</nav>
<nav className="ml-auto sm:hidden">
<div className="btn btn-square btn-ghost" onClick={() => {

4
src/components/ProductsSection.tsx
View File

@@ -59,7 +59,7 @@ const ProductsSection = () => {
<div className='w-full p-2 flex flex-col space-y-8 justify-center'>
<div className='w-full flex justify-center mb-8'>
<span className='px-4 text-3xl sm:text-4xl sm:text-center'>
<span className='text-blue-400'>Ключевые программные</span> продукты собственной разработки
<span className='text-blue-500'>Ключевые программные</span> продукты собственной разработки
</span>
</div>
@@ -89,7 +89,7 @@ const ProductsSection = () => {
<svg className='shrink-0' width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11 2.0625C6.07191 2.0625 2.0625 6.07191 2.0625 11C2.0625 15.9281 6.07191 19.9375 11 19.9375C15.9281 19.9375 19.9375 15.9281 19.9375 11C19.9375 6.07191 15.9281 2.0625 11 2.0625ZM15.6514 8.00465L9.87637 14.8796C9.81302 14.9551 9.73419 15.0161 9.64523 15.0584C9.55627 15.1007 9.45925 15.1234 9.36074 15.125H9.34914C9.25278 15.125 9.1575 15.1047 9.06948 15.0654C8.98147 15.0262 8.90269 14.9689 8.83824 14.8973L6.36324 12.1473C6.30039 12.0806 6.25149 12.002 6.21943 11.9162C6.18737 11.8304 6.17279 11.739 6.17655 11.6474C6.1803 11.5559 6.20232 11.466 6.24131 11.3831C6.2803 11.3002 6.33547 11.2259 6.40358 11.1646C6.47169 11.1033 6.55136 11.0563 6.63791 11.0262C6.72447 10.9961 6.81616 10.9837 6.9076 10.9896C6.99904 10.9954 7.08838 11.0195 7.17037 11.0604C7.25236 11.1013 7.32534 11.1582 7.38504 11.2277L9.33109 13.3899L14.5986 7.12035C14.7168 6.98375 14.884 6.89912 15.064 6.88478C15.244 6.87043 15.4225 6.92751 15.5608 7.04368C15.6991 7.15985 15.7861 7.32578 15.8031 7.5056C15.82 7.68542 15.7655 7.86469 15.6514 8.00465Z" fill="#1C8EFF" />
</svg>
<span className='text-gray-500'>{description}</span>
<span className='text-base-content/70'>{description}</span>
</div>
))}
</div>

2
src/components/Section.tsx
View File

@@ -7,7 +7,7 @@ interface SectionProps extends PropsWithChildren {
const Section = ({ id, children }: SectionProps) => {
return (
<section id={id} className='min-h-screen h-auto w-full flex justify-center'>
<div className='max-w-7xl w-full h-auto'>
<div className='max-w-7xl w-full h-auto xl:py-4'>
{children}
</div>
</section>

8
src/components/ServicesSection.tsx
View File

@@ -30,7 +30,7 @@ const ServiceItem = ({ service }: {
style={{
opacity: opacity
}}
className='col-span-1 text-5xl sm:text-8xl leading-12 sm:leading-20 text-blue-500 sm:text-gray-300 sm:group-hover:text-blue-500 transition-colors'>{service.id}</motion.span>
className='col-span-1 text-5xl sm:text-8xl leading-12 sm:leading-20 text-blue-500 sm:text-base-content/10 sm:group-hover:text-blue-500 transition-colors'>{service.id}</motion.span>
<span className='col-span-3 sm:col-span-1 text-2xl sm:text-xl'>{service.title}</span>
<div className='row-start-2 sm:row-start-1 col-span-4 sm:col-start-3 sm:col-span-2 flex flex-col gap-4'>
{service.descriptions.map(desc => (
@@ -38,7 +38,7 @@ const ServiceItem = ({ service }: {
<svg className='shrink-0' width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11 2.0625C6.07191 2.0625 2.0625 6.07191 2.0625 11C2.0625 15.9281 6.07191 19.9375 11 19.9375C15.9281 19.9375 19.9375 15.9281 19.9375 11C19.9375 6.07191 15.9281 2.0625 11 2.0625ZM15.6514 8.00465L9.87637 14.8796C9.81302 14.9551 9.73419 15.0161 9.64523 15.0584C9.55627 15.1007 9.45925 15.1234 9.36074 15.125H9.34914C9.25278 15.125 9.1575 15.1047 9.06948 15.0654C8.98147 15.0262 8.90269 14.9689 8.83824 14.8973L6.36324 12.1473C6.30039 12.0806 6.25149 12.002 6.21943 11.9162C6.18737 11.8304 6.17279 11.739 6.17655 11.6474C6.1803 11.5559 6.20232 11.466 6.24131 11.3831C6.2803 11.3002 6.33547 11.2259 6.40358 11.1646C6.47169 11.1033 6.55136 11.0563 6.63791 11.0262C6.72447 10.9961 6.81616 10.9837 6.9076 10.9896C6.99904 10.9954 7.08838 11.0195 7.17037 11.0604C7.25236 11.1013 7.32534 11.1582 7.38504 11.2277L9.33109 13.3899L14.5986 7.12035C14.7168 6.98375 14.884 6.89912 15.064 6.88478C15.244 6.87043 15.4225 6.92751 15.5608 7.04368C15.6991 7.15985 15.7861 7.32578 15.8031 7.5056C15.82 7.68542 15.7655 7.86469 15.6514 8.00465Z" fill="#1C8EFF" />
</svg>
<span className='text-gray-500'>{desc}</span>
<span className='text-base-content/70'>{desc}</span>
</div>
))}
</div>
@@ -87,7 +87,7 @@ const ServicesSection = () => {
<section id='services' className='max-w-7xl w-full h-auto'>
<div className='w-full h-auto flex flex-col items-center mb-8'>
<span className='px-4 text-3xl sm:text-4xl sm:text-center my-8'>
<span className='text-blue-400'>Предоставляемые услуги</span> нашей компании
<span className='text-blue-500'>Предоставляемые услуги</span> нашей компании
</span>
<div className='h-full grid grid-cols-1 sm:grid-cols-3 font-light sm:gap-4 p-2 xl:p-0'>
@@ -106,7 +106,7 @@ const ServicesSection = () => {
</div>
<div>
<span className='text-[1rem] text-gray-500'>
<span className='text-[1rem] text-base-content/70'>
✳︎ Наши услуги ориентированы на долгосрочную ценность: мы не просто реализуем отдельные задачи, a <span className='text-blue-500'>выстраиваем технологическую основу для роста, масштабирования и развития бизнеса.</span> Надёжность, контроль и ответственность — ключевые принципы нашей работы.
</span>
</div>

57
src/components/StackSection.css Normal file
View File

@@ -0,0 +1,57 @@
.wrapper {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}
.card {
top: 30px;
position: sticky;
border: 1px solid #ccc;
box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);
background-color: white;
color: #333;
padding: 40px;
border-radius: 10px;
margin-bottom: 20px;
}
.card h2 {
padding: 0;
}
.card span {
display: block;
font-size: 14px;
color: #0c4eb9;
}
.card:nth-child(1n) {
top: 20px;
}
.card:nth-child(2n) {
top: 40px;
}
.card:nth-child(3n) {
top: 60px;
}
.card:nth-child(4n) {
top: 80px;
}
.card:nth-child(5n) {
top: 100px;
}
.card:nth-child(6n) {
top: 120px;
}
.card:nth-child(7n) {
top: 140px;
}
.card:nth-child(8n) {
top: 160px;
}

38
src/components/StackSection.tsx Normal file
View File

@@ -0,0 +1,38 @@
import React from 'react'
import './StackSection.css'
const StackSection = () => {
return (
<div className="wrapper h-auto max-h-full">
<div className="card">
<h2><span>Project #1</span>Title of the Project</h2>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Harum, perspiciatis blanditiis accusamus commodi consectetur id tempora rem iure eligendi quos eos et autem ratione exercitationem earum laborum ad a sequi!</p>
</div>
<div className="card">
<h2><span>Project #2</span>Title of the Project</h2>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Harum, perspiciatis blanditiis accusamus commodi consectetur id tempora rem iure eligendi quos eos et autem ratione exercitationem earum laborum ad a sequi!</p>
</div>
<div className="card">
<h2><span>Project #3</span>Title of the Project</h2>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Harum, perspiciatis blanditiis accusamus commodi consectetur id tempora rem iure eligendi quos eos et autem ratione exercitationem earum laborum ad a sequi!</p>
</div>
<div className="card">
<h2><span>Project #4</span>Title of the Project</h2>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Harum, perspiciatis blanditiis accusamus commodi consectetur id tempora rem iure eligendi quos eos et autem ratione exercitationem earum laborum ad a sequi!</p>
</div>
<div className="card">
<h2><span>Project #5</span>Title of the Project</h2>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Harum, perspiciatis blanditiis accusamus commodi consectetur id tempora rem iure eligendi quos eos et autem ratione exercitationem earum laborum ad a sequi!</p>
</div>
<div className="card">
<h2><span>Project #6</span>Title of the Project</h2>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Harum, perspiciatis blanditiis accusamus commodi consectetur id tempora rem iure eligendi quos eos et autem ratione exercitationem earum laborum ad a sequi!</p>
</div>
<div className="card">
<h2><span>Project #7</span>Title of the Project</h2>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Harum, perspiciatis blanditiis accusamus commodi consectetur id tempora rem iure eligendi quos eos et autem ratione exercitationem earum laborum ad a sequi!</p>
</div>
</div>
)
}
export default StackSection

12
src/components/Thesis.tsx
View File

@@ -1,11 +1,12 @@
import { type JSX } from 'react'
const Thesis = ({ info }: {
const Thesis = ({ info, showDescription = true }: {
info: {
icon: JSX.Element;
title: string;
description: string;
}
},
showDescription?: boolean
}) => {
return (
<div className='flex flex-row space-x-3'>
@@ -14,11 +15,12 @@ const Thesis = ({ info }: {
</div>
<div className='flex flex-col space-y-2'>
<span className='text-xl font-light leading-5'>{info.title}</span>
<span className='text-xl font-normal leading-5'>{info.title}</span>
<span className='text-sm text-gray-500 font-light'>
{showDescription &&
<span className='text-sm text-base-content/70 font-light'>
{info.description}
</span>
</span>}
</div>
</div>
)

2
src/components/TypingEffect.tsx
View File

@@ -51,7 +51,7 @@ export default function TypingEffect({ text = 'Typing Effect', speed = 0.1 }: {
<div className="relative max-h-full h-full overflow-hidden">
<h2
ref={ref}
className="text-sm text-left font-mono text-gray-400 tracking-tighter absolute bottom-0"
className="text-sm text-left font-mono text-base-content/70 tracking-tighter absolute bottom-0"
>
{visibleLines.map((line, index) => (
<div key={index}>