Footer

index.html

@@ -43,6 +43,22 @@
 		<div class="container"></div>
 	</div>
 	
+	<div class="footer">
+		<div class="footline"></div>
+		<div class="description">
+			<p>This is a demo of our State-of-the-art neural coreference resolution system. 
+			The open source code for <a target="_blank" href="https://github.com/huggingface/neuralcoref">Neural coref</a>, 
+			our coreference system based on neural nets and spaCy, is <a target="_blank" href="https://github.com/huggingface/neuralcoref">on Github</a>, 
+			and we explain how it works in <a target="_blank" href="https://medium.com/p/3302365dcf30">this Medium publication</a>.</p>
+			<p>In short, coreference is the fact that two or more expressions in a text – like pronouns or nouns – link to the same person or thing. 
+			It is a classical Natural language processing task, that has seen a revival of interest in the past 
+			two years as several research groups applied cutting-edge deep-learning and reinforcement-learning techniques to it.
+			It is also one of the key building blocks to building conversational Artificial intelligences. 
+			If you like this demo please <a target="_blank" href="https://twitter.com/intent/tweet?url=https%3A%2F%2Fhuggingface.co%2Fcoref&via=julien_c%20%40betaworks">tweet about it</a> 👍.</p>
+			<p><a href="https://twitter.com/share" class="twitter-share-button" data-show-count="false" data-via="julien_c @betaworks">Tweet</a><script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script></p>
+		</div>
+	</div>
+	
 	<script src="dist/script.js"></script>
 	<script>
 	(function() {

less/style.less

@@ -152,6 +152,26 @@ body.debug {
 	}
 }
 
+/**
+ * Footer
+ */
+
+.footer {
+	padding: 18px 18px;
+	color: #2f2f2f;
+	font-size: 14px;
+	max-width: 700px;
+	line-height: 1.3;
+	a {
+		color: inherit;
+	}
+	.footline {
+		height: 2px;
+		width: 200px;
+		background-color: #696969;
+	}
+}
+
 /**
  * Elements from Displacy
  */