-
{title}
- {description && ( -{description}
- )} - + {title &&
+ {sections.length &&
+ sections.map(({ type, color, title, description, paragraphs }) => {
+ const contentData = subjects.find((sub) => sub.type === type);
+
+ return (
+
+ );
+}
+
+export default Sections;
diff --git a/code/common/lottie-player/index.js b/code/common/lottie-player/index.js
new file mode 100644
index 0000000..46fe88f
--- /dev/null
+++ b/code/common/lottie-player/index.js
@@ -0,0 +1,16 @@
+import React from "react";
+
+function LottiePlayer({ src, width, height }) {
+ return (
+
+
+ {contentData && contentData.content}
+
+
+ );
+ })}
+ {marquee}
{contact}
diff --git a/code/common/titleSection/index.js b/code/common/titleSection/index.js
new file mode 100644
index 0000000..05bd0ee
--- /dev/null
+++ b/code/common/titleSection/index.js
@@ -0,0 +1,12 @@
+import React from "react";
+
+const TitleSection = ({ title, description }) => {
+ return (
+
+
+ );
+};
+
+export default TitleSection;
diff --git a/code/screens/case-studies/components/listProjects.js b/code/screens/case-studies/components/listProjects.js
new file mode 100644
index 0000000..f562ab5
--- /dev/null
+++ b/code/screens/case-studies/components/listProjects.js
@@ -0,0 +1,24 @@
+import Left from "./left";
+import React from "react";
+import Right from "./right";
+import { PROJECTS_INFO } from "../../../../assets/js/common/case-studies-projects";
+
+function ListProjects() {
+ const projects = Object.values(PROJECTS_INFO);
+
+ return (
+ {title}
+ {description &&{description}
} +
+ {projects.length &&
+ projects.map(({ type }, i) => {
+ const isEven = i % 2 === 0;
+ return (
+
+ );
+}
+
+export default ListProjects;
diff --git a/code/screens/case-studies/index.js b/code/screens/case-studies/index.js
index 29cb7f0..de708a2 100644
--- a/code/screens/case-studies/index.js
+++ b/code/screens/case-studies/index.js
@@ -1,36 +1,30 @@
-import ColorSection from "../../common/ColorSection";
+import ListProjects from "./components/listProjects";
import PageWrapper from "../../common/pageWrapper";
import React from "react";
-import { COLORS } from "../../../assets/js/common/colors";
+import { CASE_STUDIES_DETAILS } from "../../../assets/js/common/case-studies-details";
+import { SECTIONS } from "../../../assets/js/common/sections";
-const isEmpty = "Right now we don't have a new examples for you!";
+const subjects = [
+ {
+ type: SECTIONS.ALPHA,
+ content:
+ {isEven ?
+ );
+ })}
+ {project}
;
- })
- ) : (
-
+ {clients.length &&
+ clients.map(({ src, alt }) => {
+ return (
+
+ );
+};
+
+export default Clients;
diff --git a/code/screens/home/sections/contact/index.js b/code/screens/home/components/contact/index.js
similarity index 100%
rename from code/screens/home/sections/contact/index.js
rename to code/screens/home/components/contact/index.js
diff --git a/code/screens/home/sections/header/components/blobs/index.js b/code/screens/home/header/components/blobs.js
similarity index 100%
rename from code/screens/home/sections/header/components/blobs/index.js
rename to code/screens/home/header/components/blobs.js
diff --git a/code/screens/home/header/components/title.js b/code/screens/home/header/components/title.js
new file mode 100644
index 0000000..122b161
--- /dev/null
+++ b/code/screens/home/header/components/title.js
@@ -0,0 +1,31 @@
+import Link from "../../../../common/btns/link";
+import React from "react";
+import animations from "../../../../../assets/js/animations";
+
+const Title = ({ title, sub_title, description, url, btnText }) => {
+ return (
+
+
+ );
+ })}
+
+ 
+
+
+
+ );
+};
+
+export default Title;
diff --git a/code/screens/home/header/index.js b/code/screens/home/header/index.js
new file mode 100644
index 0000000..e6edeed
--- /dev/null
+++ b/code/screens/home/header/index.js
@@ -0,0 +1,26 @@
+import Blobs from "./components/blobs";
+import React from "react";
+import Title from "./components/title";
+
+const BLOBS_SIZE = {
+ ORANGE: 1300,
+ GREEN: 1100,
+};
+
+const HomeHeader = ({ title, sub_title, description, url, btnText }) => {
+ return (
+
+
+
+
+
+ + {title} +
+ ++ {sub_title} +
+ ++ {description} +
+
+
+
+
+
+ );
+};
+
+export default HomeHeader;
diff --git a/code/screens/home/index.js b/code/screens/home/index.js
index 4a6a7ca..cfeddc2 100644
--- a/code/screens/home/index.js
+++ b/code/screens/home/index.js
@@ -1,29 +1,53 @@
+import CircleDiagram from "../../common/circleDiagram";
+import Clients from "./components/clients";
+import HomeHeader from "./header";
+import LottiePlayer from "../../common/lottie-player";
import React from "react";
+import Sections from "../../common/listSection";
import animations from "../../../assets/js/animations";
+import { MAIN_PAGE_DETAILS } from "../../../assets/js/common/main-page";
+import { SECTIONS } from "../../../assets/js/common/sections";
import { handleUrl } from "../../utils";
-const Home = ({
- header,
- services,
- clients,
- about,
- join,
- team,
- contact,
- navbar,
- _relativeURL,
- _ID,
-}) => {
+const subjects = [
+ {
+ type: SECTIONS.GAMMA,
+ content:
{navbar}
- {header}
- {services}
- {clients}
- {about}
- {join}
- {team}
+
+
+
+
+ {contact}
+