-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
214 lines (192 loc) · 9.21 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
209
210
211
212
213
214
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ICE CUBE 🧊</title>
<link rel="icon" href="./favicon.png">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./style.css">
</head>
<body>
<div class="bouncing-blobs-container">
<div class="bouncing-blobs-glass"></div>
<div class="bouncing-blobs">
<div class="bouncing-blob bouncing-blob--blue"></div>
<div class="bouncing-blob bouncing-blob--blue"></div>
<div class="bouncing-blob bouncing-blob--blue"></div>
<div class="bouncing-blob bouncing-blob--white"></div>
<div class="bouncing-blob bouncing-blob--purple"></div>
<div class="bouncing-blob bouncing-blob--purple"></div>
<div class="bouncing-blob bouncing-blob--pink"></div>
</div>
</div>
<div class="logo" data-animation="fadeIn">
<a href="#">
<img src="./img/logo.png" data-animation="slideInDown" data-animation-delay="0s" alt="Logo">
</a>
</div>
<div class="logo-phone">
<a href="#">
<img src="./img/logo.png" alt="Logo">
</a>
</div>
<header data-animation="fadeIn">
<h1>
<div class="title" data-animation="slideInDown" data-animation-delay="0.5s">
<b>
👋Social Media,
<br>
Back to the People.
</b>
<p>
Join a decentralized social network where you control your data and connect freely.
<br>
Experience a platform built on individual
<span>S</span><span>o</span><span>v</span><span>e</span><span>r</span><span>e</span><span>i</span><span>g</span><span>n</span><span>t</span><span>y</span>
and community collaboration.
</p>
</div>
<div class="subtitle" data-animation="slideInUp" data-animation-delay="1s">
<div class="app-link">
<a href="https://mjlwf-iqaaa-aaaan-qmtna-cai.icp0.io/" target="_blank" rel="noopener noreferer">
Launch APP
</a>
</div>
</div>
</h1>
</header>
<div class="part1" data-animation="fadeIn">
<img class="part1-img" src="./img/img1.webp" data-animation="slideInDown" data-animation-delay="0.3s">
<div class="part1-word" data-animation="slideInUp" data-animation-delay="0.2s">
<div class="part1-title">
Your Creation is Worth Owning
</div>
<p>
IceCube securely stores all your data on <a href="https://internetcomputer.org/how-it-works/canister-lifecycle/" target="_blank" rel="noopener noreferrer"></a>a decentralized cloud computing network</a> - <a href="https://internetcomputer.org" target="_blank" rel="noopener noreferrer">Internet Computer</a>. Pictures, memes, videos or texts, every post is owned and entirely controlled by your Internet Identity.
<br>
<br>
You created them, why not own them?
</p>
</div>
</div>
<div class="part2" data-animation="fadeIn">
<div class="part2-word" data-animation="slideInUp" data-animation-delay="0.2s">
<div class="part2-title">Decentralization's Avant-Garde</div>
<p>
By leveraging decentralized cloud computing, we are dedicated to empowering individuals to reclaim control over their data and online presence. We uphold the principles of privacy, security, and autonomy, enabling users to connect and interact without reliance on centralized authorities.
<br>
Through this innovative approach, we aim to revolutionize the social networking landscape, fostering a truly democratic and user-centric digital ecosystem.
</p>
<a href="https://github.com/NeutronStarDAO/icecube" target="_blank" rel="noopener noreferrer">
<div class="github">
<img src="./img/GitHub.png" alt="Github">
Github
</div>
</a>
</div>
<img class="part2-img" src="./img/img2.png" data-animation="slideInDown" data-animation-delay="0.3s">
</div>
<div class="part3" data-animation="fadeIn">
<img class="part3-img" src="./img/img3.png" data-animation="slideInDown" data-animation-delay="0.3s">
<div class="part3-word part1-word" data-animation="slideInUp" data-animation-delay="0.2s">
<div class="part3-title part1-title">
Permanent Independence
</div>
<ul>
<li>
Developed by the nonprofit organization <a href="https://kvisi-raaaa-aaaag-abj7a-cai.ic0.app/" target="_blank" rel="noopener noreferrer">NeutronStar</a>, its code is open-source and welcomes contributions from community developers.
</li>
<li>
The DApp is deployed on the IC and belongs to Service Nervous System (DAO).
</li>
</ul>
</div>
</div>
<div class="card-title">
Embrace True Digital Freedom
</div>
<div class="future" data-animation="fadeIn">
<div class="future-card" data-animation="slideInDown" data-animation-delay="0.3s">
<img class="future-img1" src="./img/f1.png">
A social network for sharing posts.
</div>
<div class="future-card" data-animation="slideInDown" data-animation-delay="0.3s">
<img class="future-img2" src="./img/f2.png">
Global payments as easy as texting,<br>linking @username with wallet addresses.
</div>
<div class="future-card" data-animation="slideInDown" data-animation-delay="0.3s">
<img class="future-img3" src="./img/f3.png">
Purchase content shares,<br>rewarding both buyers and creators.
</div>
<div class="future-card" data-animation="slideInDown" data-animation-delay="0.3s">
<img class="future-img4" src="./img/f4.png">
Peer-to-peer chat based on cloud terminals.
</div>
</div>
<div class="card">
<div class="box" data-animation="zoomIn">
<span class="box-icon">🔒</span>
<div class="card-header">Secure and Private</div>
<div class="card-word">
Our cutting-edge technology keeps you in control.
</div>
<a href="./technology/index.html" rel="noopener noreferrer">
<div id="card-button-container">
<button class="learn-more">
<span class="circle" aria-hidden="true">
<span class="icon arrow"></span>
</span>
<span class="button-text">How it works</span>
</button>
</div>
</a>
</div>
<div class="box" data-animation="zoomIn" data-animation-delay="300ms">
<span class="box-icon">📝</span>
<div class="card-header">Community-driven</div>
<div class="card-word">
See plans for a better social future.
</div>
<a href="./roadmap/index.html" rel="noopener noreferrer">
<div id="card-button-container">
<button class="learn-more">
<span class="circle" aria-hidden="true">
<span class="icon arrow"></span>
</span>
<span class="button-text">Roadmap</span>
</button>
</div>
</a>
</div>
<div class="box" data-animation="zoomIn" data-animation-delay="600ms">
<span class="box-icon">👀</span>
<div class="card-header">Stay Tuned</div>
<div class="card-word">
Connect with community that values your voice and privacy.
</div>
<div class="card-button">
<a href="https://x.com/icecubeapp" target="_blank" rel="noopener noreferrer">
<div class="card-button-social">
<img src="./img/X.svg" alt="X">
</div>
</a>
<a href="https://discord.com/invite/YWfSs68h9P" target="_blank" rel="noopener noreferrer">
<div class="card-button-social">
<img class="card-dc" src="./img/Discord.svg" alt="Discord">
</div>
</a>
<a href="https://oc.app/community/ss62t-uiaaa-aaaar-bfwka-cai/channel/238363527281904163644722771500903270691/?ref=ywy2k-tiaaa-aaaaf-bkjoq-cai" target="_blank" rel="noopener noreferrer">
<div class="card-button-social">
<img src="./img/Openchat.svg" alt="Openchat">
</div>
</a>
</div>
</div>
</div>
<footer>
Copyright © 2025 ICE CUBE
</footer>
<script src="./script.js"></script>
<script src="./instantpage-5.2.0.js"></script>
</body>
</html>