Make the history teaser message look like a modal.

services/web/app/views/project/editor/history.jade

@@ -44,37 +44,40 @@ div#history(ng-show="ui.view == 'history'")
 					sixpack-when="focused"
 					ng-show="project.owner._id == user.id"
 				)
-					h4.teaser-title See who changed what. Go back to previous versions.
-					img.teaser-img(
-						src="/img/teasers/history/teaser-history.png"
-						alt="History"
-					)
-					p.text-center.small(ng-show="startedFreeTrial") #{translate("refresh_page_after_starting_free_trial")}
-					.row
-						.col-md-8.col-md-offset-2
-							ul.list-unstyled
-								li 
-									i.fa.fa-check  
-									| Catch up with your collaborators changes
-								
-								li
-									i.fa.fa-check  
-									| See changes over any time period
-								
-								li 
-									i.fa.fa-check  
-									| Revert your documents to previous versions
-								
-								li 
-									i.fa.fa-check  
-									| Restore deleted files
-
-					p.text-center(ng-controller="FreeTrialModalController")
-						a.btn.btn-success(
-							href
-							ng-class="buttonClass"
-							ng-click="startFreeTrial('history')"
-						) #{translate("start_free_trial")}
+					header.message-header
+						h3 History
+						
+					.message-body
+						h4.teaser-title See who changed what. Go back to previous versions.
+						img.teaser-img(
+							src="/img/teasers/history/teaser-history.png"
+							alt="History"
+						)
+						p.text-center.small(ng-show="startedFreeTrial") #{translate("refresh_page_after_starting_free_trial")}
+						.row
+							.col-md-8.col-md-offset-2
+								ul.list-unstyled
+									li 
+										i.fa.fa-check  
+										| Catch up with your collaborators changes
+									
+									li
+										i.fa.fa-check  
+										| See changes over any time period
+									
+									li 
+										i.fa.fa-check  
+										| Revert your documents to previous versions
+									
+									li 
+										i.fa.fa-check  
+										| Restore deleted files
+						p.text-center(ng-controller="FreeTrialModalController")
+							a.btn.btn-success(
+								href
+								ng-class="buttonClass"
+								ng-click="startFreeTrial('history')"
+							) #{translate("start_free_trial")}
 
 			.message(ng-show="project.owner._id != user.id")
 				p #{translate("ask_proj_owner_to_upgrade_for_history")}

services/web/public/stylesheets/app/editor/history.less

@@ -26,8 +26,18 @@
 			border-radius: 8px;
 		}
 		.message-wider {
-			width: 600px;
+			width: 650px;
+			margin-top: 60px;
+			padding: 0;
 		}
+
+			.message-header {
+				.modal-header;
+			}
+
+			.message-body {
+				.modal-body;
+			}
 	}
 
 	.diff-panel {