-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathbubbles.html
137 lines (128 loc) · 7.36 KB
/
bubbles.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
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Kevin Peplinski</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/png" href="images/favicon.png" />
<link rel="stylesheet" href="css/animate.css">
<link rel="stylesheet" href="css/et-lineicons.css">
<link rel="stylesheet" href="css/themify-icons.css">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/flexslider.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/style-bubbles.css">
<!-- FOR IE9 below -->
<!--[if lt IE 9]>
<script src="js/respond.min.js"></script>
<![endif]-->
</head>
<body data-spy="scroll" data-target=".navbar" data-offset="50">
<nav class="navbar navbar-expand-lg">
<div class="container">
<!-- Logo -->
<a class="logo" href="index.html"> <img src="images/logo2.png" alt=""> </a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="icon-bar"><i class="ti-line-double"></i></span> </button>
<!-- navbar links -->
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto">
<li class="nav-item"><a class="nav-link" href="bubbles.html#home">Home</a></li>
<li class="nav-item"><a class="nav-link" href="bubbles.html#about">About</a></li>
<li class="nav-item"><a class="nav-link" href="bubbles.html#download">Download</a></li>
</ul>
</div>
</div>
</nav>
<div id="home" class="section">
<div class="kp-hero js-fullheight">
<!-- Slider -->
<div class="flexslider js-fullheight">
<ul class="slides">
<li style="background-image: url(images/background-bubbles.jpg);">
<div class="overlay"></div>
<div class="container-fluid">
<div class="row">
<div class="col-md-12 js-fullheight slider-text">
<div class="slider-text-inner">
<div class="app-icon"> <img src="images/bubbles-app-icon.png" alt=""> </div>
<div class="desc text-zone">
<h1 aria-label="BUBBLES" class="blastMe">BUBBLES</h1>
<h2 class="cd-headline clip white-text">
<span>iOS App</span>
</h2> </div>
<div class="arrow bounce">
<a href="bubbles.html#about" data-scroll-nav="1" class=""> <i class="ti-angle-double-down"></i> </a>
</div>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
<div class="kp-projects kp-project" id="about">
<div class="container">
<div class="row">
<div class="col-md-12"> <span class="heading-meta">Information</span>
<h1 class="kp-heading animate-box white-text blastMe" aria-label="About">About</h1>
</div>
</div>
<div class="row">
<div class="col-md-3 image-content animate-box fadeInLeft animated" data-animate-effect="fadeInLeft">
<img class="img-fluid mb-30" src="images/bubbles-1.png" alt="">
<img class="img-fluid mb-30" src="images/bubbles-3.png" alt="">
<img class="img-fluid mb-30" src="images/bubbles-watch-1.png" alt="">
</div>
<div class="col-md-3 image-content animate-box fadeInLeft animated" data-animate-effect="fadeInLeft">
<img class="img-fluid mb-30" src="images/bubbles-2.png" alt="">
<img class="img-fluid mb-30" src="images/bubbles-4.png" alt="">
<img class="img-fluid mb-30" src="images/bubbles-watch-2.png" alt="">
</div>
<div class="col-md-6 animate-box fadeInLeft animated" data-animate-effect="fadeInLeft">
<div id="sticky_item">
<div class="project-desc">
<h2>Description</h2>
<p><b>Bubbles - Time Sheet</b> is a simple and fun alternative to the classic working time recording. Recording working hours is usually an unpopular and boring, but mostly necessary, task. Bubbles focuses on a simple, but very interactive and fun user experience to make the process of recording working time a little bit more bearable. </p>
<p>To start the time tracking process, simply drag a Project Bubble and then the corresponding Task Bubble to the bottom of the screen. Bubbles will do the rest!
To stop the recording, simply drag the corresponding bubble back up.</p>
<p>The recorded times can be displayed via the calendar view. Projects and associated tasks can be easily managed.</p>
<p>To make the recording of times even more comfortable, Bubbles also offers a Watch App, which allows you to control the time recording process easily on your wrist.</p>
<h2>Tech Details</h2>
<p>
Swift, WatchKit, SwiftUI, CoreData, WKExtension, Combine, Darkmode, Custom UI Components, Custom Animations, Complex Userinterface
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="kp-projects kp-project" id="download">
<div class="container">
<div class="row">
<div class="col-md-12"> <span class="heading-meta">Get It</span>
<h1 class="kp-heading animate-box white-text blastMe" aria-label="Download">Download</h1>
</div>
</div>
<div class="row">
<a href="https://apps.apple.com/us/app/bubbles-time-sheet/id1560583742#?platform=iphone" class="ml-15"><img src="images/app-store.svg" alt=""></a>
</div>
</div>
</div>
<!-- Js -->
<script src="js/jquery.min.js"></script>
<script src="js/modernizr-2.6.2.min.js"></script>
<script src="js/jquery.easing.1.3.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.waypoints.min.js"></script>
<script src="js/jquery.flexslider-min.js"></script>
<script src="js/animated.headline.js"></script>
<script src="js/sticky-kit.min.js"></script>
<script src="js/blast.js"></script>
<script src="js/main.js"></script>
<script src="js/unCryptMail.js"></script>
</body>
</html>