-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
150 lines (130 loc) · 8.77 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet">
<title>Code Breakers | Itro</title>
<link rel="stylesheet" href="css/intro-page.min.css">
</head>
<body>
<div id="scrollsmoother-container">
<div class="relative overflow-hidden w-full h-[90vh]">
<img class=" hero absolute bottom-0 mx-auto w-full object-cover h-[100%]" data-speed="auto" src="assets/images/Home/hero-intro.jpg">
<span class="our"><span class="code">Code</span> <span class="typing">Breakers</span></span>
</div>
<div class="cursor"></div>
<div class="cursor2"></div>
<div class="relative px-6 lg:px-44">
<div class="grid grid-cols-3 gap-4 border-y-2 border-dashed border-pink-500 my-44">
<div class="relative overflow-hidden aspect-w-1 aspect-h-1 rounded-lg" data-speed="1" data-lag="0.1">
<img data-aos="fade-up" data-aos-duration="3000" class="absolute bottom-0 mx-auto w-full object-cover h-[100%]" data-speed="auto" src="assets/images/Home/My hero picture.jpg">
</div>
<div class="relative overflow-hidden aspect-w-1 aspect-h-1 rounded-lg" data-speed="2" data-lag="0.4">
<img data-aos-duration="2500" data-aos="fade-up" class="absolute bottom-0 mx-auto w-full object-cover h-[100%]" data-speed="auto" src="assets/images/Home/photo_2023-05-01_19-25-40.jpg">
</div>
<div class="relative overflow-hidden aspect-w-1 aspect-h-1 rounded-lg" data-speed="3" data-lag="0.8">
<img data-aos-duration="2000" data-aos="fade-up" class="absolute bottom-0 mx-auto w-full object-cover h-[100%]" data-speed="auto" src="assets/images/Home/nodirboy.jpg">
</div>
</div>
<div class="relative h-96 flex items-center border-y-2 border-dashed border-pink-500 my-44">
<h1 data-aos="fade-up" data-aos-duration="4000" class="js-title team">Code Breakers</h1>
<h1 data-aos="fade-up team" data-aos-duration="3000"class="js-title team">Code Breakers</h1>
<h1 data-aos="fade-up" data-aos-duration="2000"class="js-title team">Code Breakers</h1>
</div>
<div class="grid grid-cols-3 gap-4 border-y-2 border-dashed border-pink-500 my-44">
<div class="relative overflow-hidden aspect-w-3 aspect-h-4 rounded-lg" data-speed="1" data-lag="0.1">
<img data-aos="fade-up" data-aos-duration="3000" class="absolute bottom-0 mx-auto w-full object-cover h-[100%]" data-speed="auto" src="assets/images/Home/photo_2023-05-01_19-19-09.jpg">
</div>
<div class="relative overflow-hidden aspect-w-3 aspect-h-4 rounded-lg" data-speed="1" data-lag="0.4">
<img data-aos="fade-up" data-aos-duration="3000"class="absolute bottom-0 mx-auto w-full object-cover h-[100%]" data-speed="auto" src="assets/images/Home/photo_2023-05-01_19-26-21.jpg">
</div>
<div class="relative overflow-hidden aspect-w-3 aspect-h-4 rounded-lg" data-speed="1" data-lag="0.8">
<img data-aos="fade-up" data-aos-duration="3000" class="absolute bottom-0 mx-auto w-full object-cover h-[150%]" data-speed="auto" src="assets/images/Home/mukhammadali.jpg">
</div>
</div>
<div class="my-24 text-center">
<h1 data-aos="fade-up" data-aos-duration="3000" class=" font js-splittext-lines text-6xl font-bold text-center">
About our <span class="text-pink-500">Team:</span> <span class="p">CodeBreakers</span> is an exceptional team of talented individuals passionate about breaking barriers in the world of coding and software development. Led by the visionary team leader <span class="t_lead">Diyorbek</span> , our team consists of <span class="p">Jurabek</span>, <span class="p">Abdulaziz</span>, <span class="p">Nodirbek</span>, <span class="p">Bekhruzbek</span>, and <span class="p">Mukhammadali</span>, each bringing unique skills and expertise to the table.
With a shared love for technology and a relentless drive for innovation, the CodeBreakers collaborate seamlessly to tackle complex challenges and deliver remarkable solutions. From designing elegant user interfaces to crafting efficient algorithms, our team combines creativity and technical prowess to build cutting-edge software applications.
The CodeBreakers thrive on pushing boundaries, constantly learning and adapting to the ever-evolving tech landscape. Our dedication to excellence and commitment to teamwork enable us to deliver projects that exceed expectations and make a lasting impact.
Join us on our journey as we continue to break the code, unlock new possibilities, and shape the future of technology.
</h1>
</div>
<section class="first_project">
<div class="container">
<h2 data-aos="fade-up" data-aos-duration="3000" class="js-title fonts" >1<sup>st</sup> Project</h2>
<div class="project_container">
<iframe data-aos="fade-up" data-speed="auto" src="https://imperator-8264.netlify.app/" frameborder="0"></iframe>
</div>
<button data-aos="fade-up" data-aos-duration="3000" >
<a href="https://finsweet-2-codebreakers.netlify.app">See project online</a>
</button>
</div>
</section>
<section data-aos="fade-up" data-aos-duration="3000"class="first_project">
<div class="container">
<h2 data-aos="fade-up" data-aos-duration="3000" class="js-title fonts">2<sup>nd</sup> Project</h2>
<div class="project_container">
<iframe data-aos="fade-up" data-aos-duration="3000"data-speed="auto" src="https://finsweet-2-codebreakers.netlify.app/home.html?" frameborder="0"></iframe>
</div>
<button data-aos-duration="3000">
<a href="https://finsweet-2-codebreakers.netlify.app">See project online</a>
</button>
</div>
</section>
<section class="first_project">
<div class="container">
<h2 data-aos="fade-up" data-aos-duration="3000" class="js-title fonts">3<sup>rd</sup> Project</h2>
<div class="project_container">
<iframe data-aos="fade-up" data-aos-duration="3000" data-speed="auto" src="https://finsweet-team-3.netlify.app/home.html" frameborder="0"></iframe>
</div>
<button data-aos="fade-up" data-aos-duration="3000" >
<a href="home.html">See project online</a>
</button>
</div>
</section>
<section data-aos="fade-up" data-aos-duration="3000" class="end ">
<div class="wrapper">
<div class="circle"></div>
<div class="circle"></div>
<div class="circle"></div>
<div class="shadow"></div>
<div class="shadow"></div>
<div class="shadow"></div>
</div>
</section>
<div class="my-44 alohida flex justify-center space-x-12">
<div class="p-16 my-12 bg-pink-500 rounded-lg" data-speed="1" data-lag="0.2"></div>
<div class="p-16 my-12 bg-pink-500 rounded-lg" data-speed="1" data-lag="0.4"></div>
<div class="p-16 my-12 bg-pink-500 rounded-lg" data-speed="1" data-lag="0.6"></div>
<div class="p-16 my-12 bg-pink-500 rounded-lg" data-speed="1" data-lag="0.8"></div>
<div class="p-16 my-12 bg-pink-500 rounded-lg" data-speed="1" data-lag="1"></div>
</div>
<div class="my-44 alohida flex justify-center space-x-12">
<div class="p-16 my-12 bg-pink-500 rounded-lg" data-speed="0.9"></div>
<div class="p-16 my-12 bg-pink-500 rounded-lg" data-speed="1.1"></div>
<div class="p-16 my-12 bg-pink-500 rounded-lg" data-speed="0.75"></div>
<div class="p-16 my-12 bg-pink-500 rounded-lg" data-speed="1.25"></div>
<div class="p-16 my-12 bg-pink-500 rounded-lg" data-speed="1.5"></div>
</div>
<div class=" relative border-y-2 border-dashed border-pink-500 mt-44">
<h2 class="bg-pink-500 text-center text-2xl p-12">The End</h2>
</div>
</div>
</div>
<script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.5/gsap.min.js" integrity="sha512-cOH8ndwGgPo+K7pTvMrqYbmI8u8k6Sho3js0gOqVWTmQMlLIi6TbqGWRTpf1ga8ci9H3iPsvDLr4X7xwhC/+DQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.5/ScrollTrigger.min.js" integrity="sha512-AMl4wfwAmDM1lsQvVBBRHYENn1FR8cfOTpt8QVbb/P55mYOdahHD4LmHM1W55pNe3j/3od8ELzPf/8eNkkjISQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/typed.js/2.0.12/typed.min.js" referrerpolicy="no-referrer"></script>
<!-- <script src="https://assets.codepen.io/16327/ScrollSmoother.min.js?v=987"></script> -->
<script src="https://assets.codepen.io/16327/SplitText3.min.js"></script>
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.tailwindcss.com/?plugins=forms,typography,aspect-ratio,line-clamp"></script>
<script src="JavaScript/intro.js"></script>
<script>
AOS.init();
</script>
</body>
</html>