-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
109 lines (109 loc) · 5.04 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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="css/style.css">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="//oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class="view--app">
<nav class="menu">
<span class="menu--logo">
<img src="img/dodacahedron.svg">
</span>
<li class="active"><a href="#"><img class="menu--icon" src="img/lectures.svg"><span class="menu--text">Lectures</span></a></li>
<li><a href="#"><img class="menu--icon" src="img/questions.svg"><span class="menu--text">Questions</span></a></li>
<li><a href="#"><img class="menu--icon" src="img/notes.svg"><span class="menu--text">Notes</span></a></li>
<li><a href="#"><img class="menu--icon" src="img/about.svg"><span class="menu--text">About</span></a></li>
</nav>
<nav class="selector--parent">
<div class="selector--header">
<div class="selector--header__content">
<img class="selector--header__image" src="">
<h2 class="selector--header__category">Track</h2>
<h1 class="selector--header__title">Bring In The Clowns</h1>
</div>
</div>
<div class="selector--block active" href="#">
<div class="selector--block__content">
<h1 class="selector--block__title">How I Met Your Mother</h1>
<h2 class="selector--block__author">by <a href="#">Linan Qiu</a></h2>
</div>
</div>
<div class="selector--block" href="#">
<div class="selector--block__content">
<h1 class="selector--block__title">Why Bananas Explode</h1>
<h2 class="selector--block__author">by <a href="#">Ong Ze Xuan</a></h2>
</div>
</div>
<div class="selector--block" href="#">
<div class="selector--block__content">
<h1 class="selector--block__title">Le Pamplemousse</h1>
<h2 class="selector--block__author">by <a href="#">Jenny Liu</a></h2>
</div>
</div>
<div class="selector--block" href="#">
<div class="selector--block__content">
<h1 class="selector--block__title">My Deal With Hot Guys</h1>
<h2 class="selector--block__author">by <a href="#">Allison Choong</a></h2>
</div>
</div>
<div class="selector--block" href="#">
<div class="selector--block__content">
<h1 class="selector--block__title">When I Say Jump You Jump.</h1>
<h2 class="selector--block__author">by <a href="#">Belinda Ding</a></h2>
</div>
</div>
<div class="selector--block" href="#">
<div class="selector--block__content">
<h1 class="selector--block__title">You Understare?</h1>
<h2 class="selector--block__author">by <a href="#">Ho Sheng Yi</a></h2>
</div>
</div>
<div class="selector--block" href="#">
<div class="selector--block__content">
<h1 class="selector--block__title">Ohyesaverylongmiddlenameindeed</h1>
<h2 class="selector--block__author">by <a href="#">Neil Actuallynomiddlename Dhar</a></h2>
</div>
</div>
<div class="selector--block" href="#">
<div class="selector--block__content">
<h1 class="selector--block__title">Wa Si Lin Lao Peh</h1>
<h2 class="selector--block__author">by <a href="#">Jethro Kuan</a></h2>
</div>
</div>
</nav>
<main>
<article>
<div class="main--video">
<iframe src="http://www.youtube.com/embed/gZVRJB84zEM?rel=0" frameborder="0" allowfullscreen></iframe>
</div>
<div class="main--content">
<h3 class="main--status">5 checkpoints, 24 min to go in this lesson</h3>
<h1 class="main--title">Life Before Your Mother</h1>
<p class="main--description">By the end of this checkpoint, you should be able to identify the major events of my life before I met your mother, the names of the girls I dated, and the most common surname amongst those I have dated.</p>
</div>
</article>
<article>
<div class="main--video">
<iframe src="http://www.youtube.com/embed/yt0m7N3bqXM?rel=0" frameborder="0" allowfullscreen></iframe>
</div>
<div class="main--content">
<h3 class="main--status">4 checkpoints, 18 min to go in this lesson</h3>
<h1 class="main--title">Life After Your Mother Left Me For Another Less Capable Man</h1>
<p class="main--description">You shall feel my anguish, my pain, my angst, my sorrow. You shall feel it all, and you shall learn from my mistakes. This hand of mine glows with an awesome power! It's burning grip tells me to defeat you! Take this! My love! My hate! And all of my sorrow! Shining Finger Sword! Go! Go! Go!</p>
</div>
</article>
</main>
</body>
<footer>
</footer>
</html>