-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
222 lines (214 loc) · 9.83 KB
/
Copy pathindex.html
File metadata and controls
222 lines (214 loc) · 9.83 KB
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
215
216
217
218
219
220
221
222
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" >
<title>Ballenius</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Ballenius Task is a simple and powerfull ToDo List">
<meta name="keywords" content="ToDo, List, Time Management, Eisenhower Matrix">
<link rel="icon" href="assets/favicon.ico" type="image/x-icon">
<link href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@100;200;300;400;500;600;700;800;900&family=DM+Sans:wght@100;200;300;400;500;600;700;800;900&subset=latin&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<link rel="stylesheet" href="https://unpkg.com/aos@2.3.4/dist/aos.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css">
<!-- build:css -->
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="css/custom.css" />
<!-- endbuild -->
</head>
<body>
<!-- Navigation -->
<nav class="nav-menu bg-light lh-40 navigation_2">
<div class="container px-xl-0">
<div class="row align-items-center justify-content-between">
<div class="col-xl-2 col-lg-3 text-center text-lg-left">
<img src="assets/ballenius-logo.webp" class="brand-logo">
<a href="#" class="brand link mr-20 color-main f-24 bold">Ballenius</a>
</div>
<div class="col-xl-10 col-lg-9 d-flex flex-wrap align-items-center justify-content-center justify-content-md-between">
<div class="text-md-right">
<a href="#why" class="link mr-15 color-main">Purpose</a>
<a href="#features" class="link mx-15 color-main">Features</a>
<a href="https://app.ballenius.com/login" target="_blank" rel="noopener noreferrer" class="btn mx-15 sm color-main border-gray f-16">Log In</a>
</div>
</div>
</div>
</div>
</nav>
<section id="hero">
<div class="container">
<div class="row">
<div class="col-lg-7 pt-5 pt-lg-0 order-2 order-lg-1 d-flex align-items-center">
<div data-aos="zoom-out">
<h1>Your Task Manager</h1>
<h2>A simple way to handle your daily activities</h2>
<div class="text-center text-lg-left">
<div class="hero-icons">
<i class="fab fa-chrome fa-3x"></i>
<i class="fab fa-windows fa-3x"></i>
<i class="fab fa-android fa-3x"></i>
<i class="fab fa-apple fa-3x"></i>
</div>
</div>
</div>
</div>
<div class="col-lg-5 order-1 order-lg-2 hero-img" data-aos="zoom-out" data-aos-delay="300">
<img src="assets/hero-img.png" class="img-fluid animated" alt="">
</div>
</div>
</div>
<svg class="hero-waves" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 24 150 28 " preserveAspectRatio="none">
<defs>
<path id="wave-path" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z">
</defs>
<g class="wave1"><use xlink:href="#wave-path" x="50" y="3" fill="rgba(255,255,255, .1)"></g>
<g class="wave2"><use xlink:href="#wave-path" x="50" y="0" fill="rgba(255,255,255, .2)"></g>
<g class="wave3"><use xlink:href="#wave-path" x="50" y="9" fill="#fff"></g>
</svg>
</section>
<!-- End Hero -->
<!-- Purpose -->
<section id="why" class="pt-105 pb-45 bg-light feature_2">
<div class="container px-xl-0">
<div class="row justify-content-center">
<div class="col-xl-8 col-lg-10">
<h2 class="small">Why we do it?</h2>
<div class="mt-35 mb-65 f-22 color-heading text-adaptive description">
We believe that we don't need a To Do app with lots of functionalitys and configurations, we just need a piece of paper with the digital world versatility.
we believe that we can handle our daily activities without carrying a notebook.
We want a simple way to know that we're doing it's what we should be doing.
</div>
</div>
<div class="col-xl-8 col-lg-10">
<h2 class="small">How we do it?</h2>
<div class="mt-35 mb-65 f-22 color-heading text-adaptive description">
People who works as a freelance, entrepeneure, creatives, home offices, incoworkers and digital nomadas like us need a way to stay in the right path (no procrestination).
We start using Design Thinking and develop a simple task manager with special atention in "wich tasks are the most important."
</div>
</div>
<div class="col-xl-8 col-lg-10">
<h2 class="small">What expect?</h2>
<div class="mt-35 mb-65 f-22 color-heading text-adaptive description">
<ul>
<li>Stay focus in the priority tasks</li>
<li>Check if what you did is what you should have done</li>
<li>Keep the things simple</li>
</ul>
</div>
</div>
</div>
</div>
</section>
<!-- Feature 1 -->
<section id="features" class="pt-105 pb-45 bg-light text-center feature_1">
<div class="container px-xl-0">
<div class="row justify-content-center">
<div class="col-xl-10">
<h2 class="mb-45 small">Awe-inspiring Benefits</h2>
<div class="row justify-content-center">
<div class="col-md-4 mb-50">
<i class="fas fa-sync-alt fa-3x"></i>
<div class="mt-20 mb-25 f-22 title">Stay your Data Sync</div>
<div class="color-heading text-adaptive">
Your lists always be sync in your devices.
</div>
</div>
<div class="col-md-4 mb-50">
<i class="fas fa-drafting-compass fa-3x"></i>
<div class="mt-20 mb-25 f-22 title">Responsive Layout</div>
<div class="color-heading text-adaptive">
Our simple desing has full mobile support and looks great in desktop too.
</div>
</div>
<div class="col-md-4 mb-50">
<i><img src="assets/PWA.webp" style="height: 3em;"></i>
<div class="mt-20 mb-25 f-22 title">Progresive Web App</div>
<div class="color-heading text-adaptive">
Available as PWA on Android, IOs, Windows, Mac or use it in chrome if you prefer.
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Application 2 -->
<section class="pt-65 pb-65 bg-light application_2">
<div class="container px-xl-0">
<div class="row justify-content-center justify-content-md-between align-items-center">
<div class="mb-15 mb-md-0 col-12 col-md-5 col-xl-6 d-flex justify-content-center">
<img src="assets/ipad-pro.png" srcset="assets/ipad-pro@2x.png 2x" alt="" class="img-fluid application_2_left_img" />
</div>
<div class="col-md-7 col-xl-6">
<h2 class="col-lg-11 color-main">Astonishing and Simple Features</h2>
<div class="mt-25 col-lg-9 color-heading f-18 text-adaptive">Use it in your browser, download in your PC, Mac or any mobile device with Android or IOs.
</div>
<div class="mt-95 row">
<div class="col-6 col-lg-4 pb-25 with_borders">
<i class="fas fa-th-large fa-2x"></i>
<div class="mt-15 col-xl-11 color-main f-14 bold sp-20 text-uppercase">Based on Eisenhower Time Management Matrix</div>
</div>
<div class="col-6 col-lg-4 pb-25 with_borders">
<i class="fas fa-chart-pie fa-2x"></i>
<div class="mt-15 col-xl-11 color-main f-14 bold sp-20 text-uppercase">Charts visualization per listing</div>
</div>
<div class="col-6 col-lg-4 pb-25 with_borders">
<i class="fas fa-globe-americas fa-2x"></i>
<div class="mt-15 col-xl-11 color-main f-14 bold sp-20 text-uppercase">Always available</div>
</div>
<div class="col-6 col-lg-4 pb-25 pt-35 with_borders">
<i class="fas fa-palette fa-2x"></i>
<div class="mt-15 col-xl-11 color-main f-14 bold sp-20 text-uppercase">Lists by Colors</div>
</div>
<div class="col-6 col-lg-4 pb-25 pt-35 with_borders">
<i class="fas fa-dollar-sign fa-2x"></i>
<div class="mt-15 col-xl-11 color-main f-14 bold sp-20 text-uppercase">Free Version</div>
</div>
<div class="col-6 col-lg-4 pb-25 pt-35 with_borders">
<i class="fas fa-cloud-upload-alt fa-2x"></i>
<div class="mt-15 col-xl-11 color-main f-14 bold sp-20 text-uppercase">Regular Updates</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Footer 1 -->
<footer class="pt-75 pb-65 bg-light text-center footer_1">
<div class="container px-xl-0">
<div class="row justify-content-between align-items-center lh-40 links">
<!-- <div class="col-lg-4 col-sm-6 text-sm-right text-lg-left order-1 order-lg-0">
<a href="#" class="link mr-15 color-main">About</a>
<a href="#" class="link mx-15 color-main">Policy</a>
<a href="#" class="link mx-15 color-main">Terms</a>
</div> -->
<div class="mb-10 mb-lg-0 col-lg-auto order-0">
<a href="#" class="link logo color-main">Ballenius Task</a>
</div>
<!-- <div class="col-lg-4 col-sm-6 text-sm-left text-lg-right order-2 order-lg-0">
<a href="#" class="mx-15 link color-main">
<i class="fab fa-facebook-f"></i>
</a>
<a href="#" class="ml-15 link color-main">
<i class="fab fa-instagram"></i>
</a>
</div> -->
</div>
<div class="row justify-content-center">
<div class="mt-10 col-xl-4 col-lg-5 col-md-6 col-sm-8">
<div class="color-heading text-adaptive">
© Copyright 2020, BALLENIUS TASK<br>
All right reserved
</div>
</div>
</div>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.bundle.min.js"></script>
<script src="https://unpkg.com/aos@2.3.4/dist/aos.js"></script>
<!-- build:js -->
<script src="js/script.js"></script>
<!-- endbuild -->
</body>
</html>