-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
91 lines (65 loc) · 16.1 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
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Readsure Demo</title>
<meta name="description" content="Demo of readsure sharing/comment gating quiz">
<meta name="author" content="Neal Shyam">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href='//fonts.googleapis.com/css?family=Roboto+Slab|Roboto:400,400italic,500|Roboto+Condensed' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/styles.css">
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<div class="byline">
<h1>The World is a Vampire</h2>
<p class="author">Billy Corgan</p>
</div>
<div class="article">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras imperdiet ut risus in sodales. Interdum et malesuada fames ac ante ipsum primis in faucibus. Morbi mauris turpis, consequat a nulla sed, ultricies placerat purus. Donec porttitor nulla sit amet leo imperdiet, non consequat ex fermentum. Curabitur lacinia, diam at feugiat placerat, neque neque faucibus augue, imperdiet rhoncus justo magna ut ipsum. Morbi nec nisi nibh. Cras nec leo orci. Mauris elementum porttitor odio, elementum aliquam ex hendrerit ut. Pellentesque sollicitudin, nunc non lobortis consequat, orci nibh semper sapien, tincidunt mattis ex sapien a libero. Sed ut accumsan lorem. Nam iaculis orci eros, at congue magna efficitur nec. Aenean dapibus risus justo, vitae fermentum tellus pulvinar non. Praesent viverra, quam at dictum sodales, mi nibh placerat libero, ut cursus lorem justo nec lectus. Aenean et justo ornare, tincidunt odio eu, eleifend ligula.</p>
<p>Aliquam id nisi ac metus ultricies pretium. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque eget eleifend augue, in aliquam odio. Nunc faucibus augue interdum ullamcorper ornare. Vivamus pellentesque laoreet pellentesque. Aenean at risus vitae risus luctus mattis. Proin a fringilla tortor. Praesent a risus aliquam, tincidunt metus consectetur, molestie ipsum.</p>
<p>In hac habitasse platea dictumst. Cras condimentum, lacus at tempor elementum, ligula dui varius diam, nec sodales ipsum nisi nec magna. Cras sodales sapien quis sollicitudin malesuada. Aenean pharetra, lorem vitae semper feugiat, nunc massa faucibus nunc, id fermentum diam sapien et nibh. Nullam sit amet auctor nisl. Nullam quis nibh in urna consequat laoreet. Maecenas dictum urna sit amet ipsum viverra eleifend. Vivamus vitae ex porta, maximus urna at, molestie odio. Aenean vitae orci a leo mollis malesuada. Sed et tellus vel risus lacinia iaculis vel nec urna.</p>
<p>Vestibulum et sollicitudin tellus. Curabitur commodo metus ut iaculis dictum. Vestibulum et venenatis odio. Cras viverra eleifend ipsum vel dapibus. Morbi ut sagittis nisl. Nunc tincidunt efficitur risus, at sollicitudin justo placerat at. Suspendisse elementum nisi elit, at pellentesque neque faucibus in. Sed sagittis enim nec blandit ultricies. Cras vel velit nec leo iaculis ullamcorper.</p>
<h2>Don't just stare at it, eat it!</h2>
<p>Aenean tincidunt vitae nisi in auctor. Nam placerat sem sapien, quis scelerisque dolor blandit nec. Proin lacinia fermentum sem, a laoreet purus imperdiet ut. Donec pharetra elit ac sapien sagittis porttitor. Suspendisse ut libero ipsum. Praesent commodo risus eget posuere semper. In eget velit fermentum, dignissim sem nec, porta lacus. Pellentesque non mauris sit amet lorem pellentesque hendrerit eu vitae nisl. Pellentesque orci ex, mattis non orci a, ultricies elementum tortor. Nam bibendum diam vel venenatis faucibus. Curabitur id porttitor nibh. Donec sit amet auctor dui. Suspendisse consequat condimentum neque, a lobortis elit aliquet non. Donec ligula libero, tempus vel tempor eu, lacinia nec metus.</p>
<p>Fusce at arcu tempus, cursus ex a, congue dui. Aenean ac velit sit amet metus accumsan porta vel sit amet tellus. Morbi semper mi eu lacinia malesuada. Integer quis lectus malesuada, imperdiet augue non, imperdiet libero. Integer ut eleifend leo. Curabitur mollis auctor elit, interdum convallis ipsum. Ut et purus tortor. Curabitur eget tincidunt magna. Vivamus euismod augue nunc, id consequat sem pharetra porttitor. Aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec bibendum nibh in scelerisque egestas.</p>
<p>Ut massa tellus, luctus vitae dignissim molestie, dapibus sagittis ligula. Nulla eu justo nisi. Curabitur vel erat quis orci aliquam vehicula et ac orci. Nulla volutpat lobortis turpis, sit amet facilisis quam aliquet eget. Etiam vitae massa tempor, vehicula urna a, volutpat neque. Sed neque leo, vehicula eu volutpat sed, fermentum eu felis. Etiam fermentum enim id ornare sagittis. Vivamus risus justo, imperdiet ac mattis eu, finibus vel neque. Maecenas ac leo eu lectus ornare porta et in lacus.</p>
<p>Suspendisse nec lacinia metus. Nunc urna tortor, ultrices eleifend elit a, facilisis ullamcorper ex. Morbi a ultricies nisl. Morbi vitae malesuada tellus. Pellentesque ut ante et dui vehicula pulvinar. Nulla vitae ante orci. Phasellus varius erat ac dignissim blandit. Fusce accumsan risus massa, non lacinia nunc iaculis dapibus. Fusce rutrum velit nec ante ultrices ultrices. Maecenas id facilisis nunc, quis sagittis leo. Integer et semper metus, sed vehicula turpis. Fusce nulla quam, tincidunt sed venenatis at, tempor at nibh. Cras sit amet nisi felis. Maecenas pellentesque justo vel neque rhoncus dignissim. Proin quis fringilla libero, non ullamcorper augue.</p>
<p>Vivamus tristique interdum metus ac mattis. In eget enim lectus. Proin nec neque ipsum. Nullam feugiat libero id posuere fringilla. Suspendisse et dignissim tellus. Morbi auctor sem tortor, at congue ligula consectetur ac. Vivamus id tellus congue, pulvinar erat et, ornare leo. Sed vitae sollicitudin sapien, vel consectetur mi. Ut pretium ligula vel nisi tempus, non efficitur risus hendrerit. Fusce consequat nunc id turpis tincidunt elementum. Curabitur cursus est sagittis ipsum pellentesque, id pretium sapien pretium. Phasellus velit mi, sollicitudin eget lorem ac, egestas fringilla ante. Nam sagittis, est ut luctus eleifend, dolor mauris dictum ante, non feugiat neque ex sit amet enim. Mauris mi sapien, semper id porta at, ultrices eu risus.</p>
<p>Vivamus scelerisque metus eget nisi malesuada dictum. Suspendisse interdum dictum iaculis. Phasellus vel commodo sapien, at vulputate dui. Vestibulum pretium turpis massa, faucibus placerat sapien efficitur sed. Cras at laoreet enim, vitae posuere sem. Phasellus id libero at dolor luctus porttitor. Nulla aliquet nunc purus, eu cursus libero suscipit id. Aliquam pellentesque augue ut urna ullamcorper auctor. Curabitur aliquet, risus non mollis congue, ex dui ornare elit, et hendrerit magna sem a orci. Aenean finibus libero a nisl ullamcorper sodales. Vestibulum mauris dolor, posuere nec purus id, maximus egestas lectus.</p>
<h2>The dude abides</h2>
<p>Praesent vel luctus dolor. Etiam et felis consequat, congue purus non, iaculis mauris. Donec imperdiet libero nec urna malesuada, et suscipit velit condimentum. Nam ac fermentum magna. Proin consectetur tempor felis, a auctor dui imperdiet eu. Proin viverra dolor non vestibulum scelerisque. Integer aliquam malesuada aliquam. Morbi pharetra sapien at odio vehicula vehicula. Vivamus congue ut diam vitae bibendum. Etiam consectetur luctus orci. Aenean pharetra elit nibh, a posuere tellus aliquam at. Vivamus porttitor leo eu nulla egestas sagittis. Sed dignissim lacinia consequat. Nunc orci est, lobortis nec magna vel, pretium dignissim mauris.</p>
<p>Quisque lobortis at metus nec ultrices. Nunc bibendum quam ut ante eleifend porta. Nulla et risus efficitur, condimentum magna porta, molestie ante. Nullam gravida arcu quis ultricies laoreet. Nam sem arcu, porta sit amet aliquet vel, hendrerit elementum urna. Quisque purus nisi, semper sed ante id, volutpat elementum quam. Maecenas aliquet condimentum arcu et tristique.</p>
<p>Phasellus euismod quis dolor non pretium. Pellentesque tincidunt, eros eu dignissim mattis, mauris metus molestie nisi, a lobortis ipsum leo a velit. Interdum et malesuada fames ac ante ipsum primis in faucibus. Etiam luctus turpis eget tellus aliquet, eget accumsan metus eleifend. Donec purus orci, commodo at leo volutpat, facilisis faucibus odio. Mauris auctor dui ex, vel aliquam neque dapibus eu. Vestibulum ac est metus. Nunc commodo, magna pulvinar efficitur tempor, massa orci commodo mauris, eu tincidunt elit sapien sit amet libero.</p>
Curabitur dignissim, tortor non ultrices ullamcorper, leo sem volutpat lacus, ac vehicula ipsum nulla sit amet nunc. In dignissim ante in augue congue, id posuere eros tempor. Aenean bibendum non augue a sollicitudin. Etiam in facilisis tortor, in dapibus enim. Ut sodales gravida arcu malesuada cursus. Phasellus molestie ligula in enim convallis fermentum. Quisque mattis enim vitae lectus dictum, non laoreet nulla porttitor. Vivamus non consequat ex. Etiam sit amet vulputate mi. Cras suscipit, urna id ultricies lobortis, enim ipsum dapibus neque, et pellentesque orci odio a sem. Praesent diam tortor, ullamcorper in velit vitae, sagittis feugiat purus. Donec id eros sodales, facilisis nunc id, dignissim arcu. Integer dapibus bibendum leo id convallis. Nunc bibendum blandit erat eu tempor. Cras mattis erat massa, at aliquam justo faucibus vitae. Donec rhoncus mauris risus, sodales vehicula erat porttitor non.</p>
<p>Ut ipsum risus, pretium nec porttitor id, viverra et turpis. Proin rhoncus lorem ullamcorper massa vestibulum, eu tincidunt orci commodo. Maecenas nec eleifend tortor, eget congue tellus. Pellentesque faucibus, arcu et elementum maximus, ipsum elit pellentesque ligula, at posuere odio metus at arcu. Interdum et malesuada fames ac ante ipsum primis in faucibus. Quisque commodo, erat ac consectetur feugiat, lectus diam bibendum purus, nec ornare massa sem quis tellus. Sed et diam sagittis, condimentum dolor in, posuere tortor. Nulla sed suscipit tortor. Curabitur consectetur et lectus vel sagittis. Nam non metus vestibulum, consequat risus in, faucibus purus. Vestibulum sodales blandit iaculis. Cras metus lectus, suscipit interdum turpis eget, luctus eleifend est. Aenean a ligula at nibh tincidunt tincidunt eget et enim. Nam consequat nulla ante, quis dictum mauris congue id. Donec vulputate dolor in volutpat scelerisque.</p>
</div>
<div id="readsure">
<div id="quiz">
<h3>To comment or share, answer one quick question:</h3>
<div id="question">
<h4 class="question_prompt">What is the crux of the article?</h4>
<input type="radio" name="q1" value=1 required> PCBs have a negative affect on children.<br>
<input type="radio" name="q1" value=2> Humans are just the worst<br>
<input type="radio" name="q1" value=3> Trump is a good pick for president.<br>
<input type="radio" name="q1" value=4> I like kittens!
<p><a class="button" id="q1_confirm">Check it!</a></p>
</div>
</div>
<div id="question_right">
<img src="data:image/png;base64,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" height="60px">
<br>
<p><img src="http://1u88jj3r4db2x4txp44yqfj1.wpengine.netdna-cdn.com/wp-content/uploads/2012/05/discuss-2012.png"></p>
</div>
<div id="question_wrong">
<p>No, that's not right. Re-read the article and try again.</p>
<p><a class="button" id="reset_quiz">Ok</a></p>
</div>
</div>
<!-- JaVAVAVAVAVa -->
<script src="js/main.js"></script>
<!-- <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>-->
</body>
</html>