add_in_project + adaptive_mobile

Qurence · Dec 1, 2024 · 30b9416 · 30b9416
1 parent 0e241e9
commit 30b9416
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 8 deletions.
diff --git a/project3/css/main.css b/project3/css/main.css
@@ -89,6 +89,19 @@ body {
     font-size: calc(var(--index) * .73);
     line-height: 3;
 }
+
+@media (max-width: 1370px) {
+    .hero-content {
+        font-size: calc(var(--index) * 2.3);
+    }
+    .hero-content__p {
+        font-size: calc(var(--index) * 1.3);
+    }
+    .layer-4 {
+        display: none;
+    }
+}
+
 .button-start {
     font-family: Arial;
     font-weight: 600;

diff --git a/project3/index.html b/project3/index.html
@@ -4,7 +4,7 @@
     <meta charset="UTF-8">
     <link rel="icon" type="image/svg+xml" href="../img/icon.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>3dProject</title>
+    <title>Weather</title>
     <link rel="stylesheet" href="css/main.css">
     <script src="js/app.js" defer></script>
     <script src="libs/rain.js" defer></script>

diff --git a/src/App.tsx b/src/App.tsx
@@ -89,11 +89,11 @@ function App() {
       technologies: ['HTML', 'CSS', 'JS', 'SwiperJS'],
     },
     {
-      title: 'Сайт1',
-      description: 'A modern web application built with React',
-      image: 'https://images.unsplash.com/photo-1517694712202-14dd9538aa97',
-      link: '#',
-      technologies: ['HTML', 'CSS', 'Tailwind'],
+      title: 'Weather',
+      description: t.projects.descProject3,
+      image: 'project3/img/demo.png',
+      link: 'project3/index.html',
+      technologies: ['HTML', 'CSS', 'JS'],
     },
     {
       title: 'Project 2',

diff --git a/src/i18n/translations.ts b/src/i18n/translations.ts
@@ -21,7 +21,8 @@ export const translations = {
       title: 'My Projects',
       viewProject: 'View Project',
       descProject1: 'A site with a developed parallax effect, as well as the use of a library GSAP for smooth scrolling',
-      descProject2: 'Simple website with a gallery with parallax effect with SwiperJS'
+      descProject2: 'Simple website with a gallery with parallax effect with SwiperJS',
+      descProject3: 'A project in which perspective work was implemented to achieve a 3D effect that responds to mouse movement ',
     },
     scrollTop: 'Scroll to Top',
     contactForm: { // Перевод для формы связи
@@ -56,7 +57,8 @@ export const translations = {
       title: 'Мої Проекти',
       viewProject: 'Переглянути',
       descProject1: 'Сайт з ефектом паралакса, а також використанням бібліотеки GSAP для плавної прокрутки',
-      descProject2: 'Простий веб-сайт з галереєю з ефектом паралакса за допомогою SwiperJS'
+      descProject2: 'Простий веб-сайт з галереєю з ефектом паралакса за допомогою SwiperJS',
+      descProject3: 'Проект, в якому реалізована робота з перспективою, щоб досягти 3D єфекту, який реагує на рух миші ',
     },
     scrollTop: 'Вгору',
     contactForm: { // Перевод для формы связи