-
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
executable file
·208 lines (205 loc) · 7.39 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
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
<!DOCTYPE html>
<html lang='en'>
<head>
<meta class="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>OpenArk Studio - an open source organization</title>
<!-- Don't forget to add your metadata here -->
<link rel='stylesheet' href='css/style.min.css' />
</head>
<body>
<!-- Hero(extended) navbar -->
<div class="navbar navbar--extended">
<nav class="nav__mobile"></nav>
<div class="container">
<div class="navbar__inner">
<a href="index.html" class="navbar__logo">OpenArk Studio</a>
<nav class="navbar__menu">
<ul>
<li><a href="page.html">More Projects</a></li>
</ul>
</nav>
<div class="navbar__menu-mob"><a href="" id='toggle'><svg role="img" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 448 512">
<path fill="currentColor"
d="M16 132h416c8.837 0 16-7.163 16-16V76c0-8.837-7.163-16-16-16H16C7.163 60 0 67.163 0 76v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16z"
class=""></path>
</svg></a></div>
</div>
</div>
</div>
<!-- Hero unit -->
<div class="hero">
<div class="hero__overlay hero__overlay--gradient"></div>
<div class="hero__mask"></div>
<div class="hero__inner">
<div class="container">
<div class="hero__content">
<div class="hero__content__inner" id='navConverter'>
<h1 class="hero__title">An open source organization of internet</h1>
<p class="hero__text">Our open-source team is specialized in agile development and try
to help different teams develop complex
projects quickly and easily.</p>
<a href="https://github.com/OpenArkStudio/ARK" class="button button__accent">Download ARK</a>
<a href="page.html" class="button hero__button">Learn more</a>
</div>
</div>
</div>
</div>
</div>
<div class="hero__sub">
<span id="scrollToNext" class="scroll">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
y="0px" class='hero__sub__down' fill="currentColor" width="512px" height="512px" viewBox="0 0 512 512"
style="enable-background:new 0 0 512 512;" xml:space="preserve">
<path
d="M256,298.3L256,298.3L256,298.3l174.2-167.2c4.3-4.2,11.4-4.1,15.8,0.2l30.6,29.9c4.4,4.3,4.5,11.3,0.2,15.5L264.1,380.9c-2.2,2.2-5.2,3.2-8.1,3c-3,0.1-5.9-0.9-8.1-3L35.2,176.7c-4.3-4.2-4.2-11.2,0.2-15.5L66,131.3c4.4-4.3,11.5-4.4,15.8-0.2L256,298.3z" />
</svg>
</span>
</div>
<!-- Steps -->
<div class="steps landing__section">
<div class="container">
<h2>Team features</h2>
<p>Who we are, what we done, and what we focus on.</p>
</div>
<div class="container">
<div class="steps__inner">
<div class="step">
<div class="step__media">
<img src="./images/undraw_designer.svg" class="step__image">
</div>
<h4>Professional team</h4>
<p class="step__text">Our team are working in different business companies.</p>
</div>
<div class="step">
<div class="step__media">
<img src="./images/undraw_create.svg" class="step__image">
</div>
<h4>Open source</h4>
<p class="step__text">After using many OS projects, we are feeding back to them.
</p>
</div>
<div class="step">
<div class="step__media">
<img src="./images/undraw_interaction_design.svg" class="step__image">
</div>
<h4>Highly experience</h4>
<p class="step__text">Our team have industry experience 8+ years average. </p>
</div>
</div>
<div class="steps__inner">
<div class="step">
<div class="step__media">
<img src="./images/undraw_experts.svg" class="step__image">
</div>
<h4>Expert fields</h4>
<p class="step__text">Game client and server, telecom communication, etc. </p>
</div>
<div class="step">
<div class="step__media">
<img src="./images/undraw_project_completed.svg" class="step__image">
</div>
<h4>Projects developed</h4>
<p class="step__text">Our teammates developed different fields and projects for more than 10+. </p>
</div>
<div class="step">
<div class="step__media">
<img src="./images/undraw_creation.svg" class="step__image">
</div>
<h4>Direction of interest</h4>
<p class="step__text">Agile development, big data, AI, IoT, DevOps, etc.</p>
</div>
</div>
</div>
</div>
<!-- Expanded sections -->
<div class="expanded landing__section">
<div class="container">
<div class="expanded__inner">
<div class="expanded__media">
<img src="./images/undraw_browser.svg" class="expanded__image">
</div>
<div class="expanded__content">
<h2 class="expanded__title">Plugin framework</h2>
<p class="expanded__text">ARK is a lightweight, agility, elastic, distributed plugin framework
written by C++, making it easier and faster to create
your own application services.</p>
</div>
</div>
</div>
</div>
<div class="expanded landing__section">
<div class="container">
<div class="expanded__inner">
<div class="expanded__media">
<img src="./images/undraw_setup_wizard.svg" class="expanded__image">
</div>
<div class="expanded__content">
<h2 class="expanded__title">Plentiful plugins</h2>
<p class="expanded__text">Network, Kernel, MySQL, Redis, Log, etc.</p>
</div>
</div>
</div>
</div>
<div class="expanded landing__section">
<div class="container">
<div class="expanded__inner">
<div class="expanded__media">
<img src="./images/undraw_trendy_interface.svg" class="expanded__image">
</div>
<div class="expanded__content">
<h2 class="expanded__title">IOP & DOP</h2>
<p class="expanded__text">With the general abstract data system, we can use Interface-oriented and
data-oriented programming, make the logic more
easier.</p>
</div>
</div>
</div>
</div>
<div class="expanded landing__section">
<div class="container">
<div class="expanded__inner">
<div class="expanded__media">
<img src="./images/undraw_fast_loading.svg" class="expanded__image">
</div>
<div class="expanded__content">
<h2 class="expanded__title">High performance</h2>
<p class="expanded__text">After the logic and base layer optimization, we have a wonderful
performance.</p>
</div>
</div>
</div>
</div>
<!-- Call To Action -->
<div class="cta cta--reverse">
<div class="container">
<div class="cta__inner">
<h2 class="cta__title">Get started now</h2>
<p class="cta__sub cta__sub--center">Grab our open-source project and begin your project instantly.</p>
<a href="page.html" class="button button__accent">Learn more</a>
</div>
</div>
</div>
<!-- Footer -->
<div class="footer footer--dark">
<div class="container">
<div class="footer__inner">
<div class="footer__data">
<div class="footer__data__item">
<div class="footer__row">Copyright © 2016-2023 <a href="index.html" target="_blank"
class="footer__link">OpenARK
Studio</a>. All rights reserved.
</div>
</div>
<div class="footer__data__item">
<div class="footer__row">
<a href="https://github.com/OpenArkStudio" target="_blank" class="footer__link">GitHub</a>
</div>
</div>
</div>
</div>
</div>
<script src='js/app.min.js'></script>
</body>
</html>