Merge pull request #1018 from sharelatex/jel-track-changes-info-page

Styling for track changes info page and add existence checks for metadata

GitOrigin-RevId: 86a6b178e8107c75ef5b877acc1aaa3d8d1ebd80

services/web/app/views/_metadata.pug

@@ -45,7 +45,7 @@
 meta(itemprop="name", content=settings.appName + ", the Online LaTeX Editor")
 
 //- Twitter
-meta(name="twitter:card", content=metadata.twitterCardType ? metadata.twitterCardType : 'summary')
+meta(name="twitter:card", content=metadata && metadata.twitterCardType ? metadata.twitterCardType : 'summary')
 -if (settings.social && settings.social.twitter && settings.social.twitter.handle)
 	meta(name="twitter:site", content="@" + settings.social.twitter.handle)
 -if (metadata && metadata.twitterDescription)
@@ -82,5 +82,5 @@ meta(name="twitter:card", content=metadata.twitterCardType ? metadata.twitterCar
 	meta(name="og:type", content="website")
 
 //- Viewport
-if metadata.viewport
+if metadata && metadata.viewport
 	meta(name="viewport" content="width=device-width; initial-scale=1.0; user-scalable=yes;")

services/web/public/stylesheets/_ol_style_includes.less

@@ -3,3 +3,4 @@
 @import "app/ol-chat.less";
 @import "app/templates-v2.less";
 @import "app/login-register.less";
+@import "app/review-features-page.less";

services/web/public/stylesheets/_style_includes.less

@@ -81,7 +81,6 @@
 @import "app/subscription.less";
 @import "app/sprites.less";
 @import "app/invite.less";
-@import "app/review-features-page.less";
 @import "app/error-pages.less";
 @import "app/v1-badge.less";
 @import "app/editor/history-v2.less";

services/web/public/stylesheets/app/homepage.less

@@ -187,8 +187,10 @@
 		}
 	}
 
-.universities {
+.universities-container {
 	border-bottom: 1px solid @gray-lighter;
+}
+.universities {
 	text-align: center;
 	.uni-logo {
 		display: inline-block;
@@ -274,4 +276,10 @@
 	.doc-history-example {
 		margin-bottom: @margin-md;
 	}
+	.universities {
+		.uni-logo {
+			padding: @padding-md;
+			width: 50%;
+		}
+	}
 }

services/web/public/stylesheets/app/review-features-page.less

@@ -18,8 +18,7 @@
 @rfp-header-height-collapsed: 50px;
 
 .rfp-main {
-	background-color: @rfp-rp-blue-dark;
-	color: #FFF;
+	background-color: @content-alt-bg-color;
 	font-size: 18px;
 	min-width: 240px;
 }
@@ -56,7 +55,6 @@
 		max-width: 30em;
 		margin-left: auto;
 		margin-right: auto;
-		font-weight: 300;
 		@media (min-width: @screen-xs-min) {
 			font-size: @rfp-lead-size;
 		}			
@@ -76,7 +74,6 @@
 		max-width: 30em;
 		margin-left: auto;
 		margin-right: auto;
-		font-weight: 300;
 		.rfp-section-feature & {
 			margin-left: initial;
 		}
@@ -126,7 +123,7 @@
 				height: 100%;
 			}
 	.rfp-section {
-		padding: 30px 20px;
+		padding: 30px;
 		text-align: center;
 		overflow: hidden;
 		@media (min-width: @screen-xs-min) {
@@ -137,7 +134,7 @@
 		}
 	}
 	.rfp-section-masthead {
-	    color: #FFF;
+		color: #FFF;
 		background-size: cover;
 		background-position: center;
 		background-color: @rfp-rp-blue-darker;
@@ -156,13 +153,11 @@
 		position: relative;
 		padding-top: 30px;
 		padding-bottom: 30px;
-		background-color: @rfp-sl-red;
+		background-color: @brand-secondary;
 		box-shadow: @rfp-card-shadow;
 	}
 	.rfp-section-feature {
 		display: block;
-		color: @rfp-rp-blue-dark;
-		background-color: @rfp-rp-blue-light;
 		text-align: left;
 		@media (min-width: @screen-sm-min) {
 			.rfp-section-wrapper {
@@ -196,11 +191,14 @@
 		}
 	.rfp-section-feature-alt {
 		color: #FFF;
-		background-color: transparent;
+		background-color: @ol-blue-gray-5;
 		@media (min-width: @screen-sm-min) {
 			text-align: right;
 		}
 	}
+	.rfp-section-feature-white {
+		background: #ffffff;
+	}
 	.rfp-section-testimonials {
 		background-color: @rfp-rp-blue-darkest;
 	}
@@ -329,6 +327,7 @@
 		}
 	}
 	.rfp-quote-main {
+		color: #ffffff;
 		display: block;
 		max-width: none;
 		border-left: 0;
@@ -441,31 +440,6 @@
 			box-shadow: @rfp-card-shadow;
  			border-radius: @rfp-border-radius;
 		}
-			.rfp-cta {
-				display: inline-block;
-				background-color: @rfp-sl-red;
-				color: #FFF;
-				font-size: @rfp-h3-size;
-				border-radius: @rfp-border-radius;
-				padding: .75em;
-				@media (min-width: @screen-xs-min) {
-					padding: .75em 1.5em;
-				}
-				&:hover,
-				&:focus {
-					color: #FFF;
-					text-decoration: none;
-					outline: 0;
-					.rfp-cta-main {
-						transform: translate(0, -30%);
-					}
-					.rfp-cta-extra {
-						opacity: 1;
-						transform: translate(-50%, -40%);
-					}
-				}
-			}
-
 			.rfp-cta-header {
 				font-size: 1em;
 				padding: .2em 1em;