-
Notifications
You must be signed in to change notification settings - Fork 53
/
index.html
41 lines (37 loc) · 1.82 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
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/timeline.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
</head>
<body>
<!-- timeline-left // timeline-alternating -->
<div class="timeline timeline-alternating timeline-collapsing blue-yellow-yellow timeline-with-arrows"> <!-- Main element container -->
<div class="timeline-block"> <!-- Single block -->
<div class="timeline-icon timeline-icon-hide-border"><i class="fa fa-camera-retro fa-lg"></i></div> <!-- Icon on the timeline -->
<div class="arrow-right"></div>
<div class="timeline-content">
<p> Any content </p> <!-- Content -->
<div class="timeline-date">Yesterday</div> <!-- Date -->
</div>
</div>
<div class="timeline-block timeline-block-icon-only">
<div class="timeline-icon timeline-icon-text timeline-icon-hide-border">
<span>Testing this thingTesting this thing</span>
</div>
<div class="timeline-content"><div class="timeline-date">Yesterday</div>
</div>
</div>
<div class="timeline-block">
<div class="timeline-icon"></div>
<div class="timeline-content">
<h2>This header</h2>
<p>Nullam luctus ligula ac venenatis tempor. Donec maximus lacus sed ullamcorper viverra. Donec gravida at sem at dapibus. Praesent interdum nec leo ut tincidunt. Fusce lacinia ultricies arcu, quis lacinia libero accumsan quis. Nam ac diam ac ex elementum rhoncus. Sed sed lacinia massa. Maecenas iaculis lectus eu aliquam sollicitudin. Vestibulum aliquam tellus vel tempus fermentum. Duis aliquam fringilla volutpat. Nulla facilisi.</p>
<div class="timeline-date">Yesterday</div>
</div>
</div>
</div>
</body>
</html>