Merge pull request #3903 from overleaf/as-clean-up-error-pages

Clean up error pages

GitOrigin-RevId: 764375124ef5349c97416339119471a166d727b5

services/web/app/views/general/400.pug

@@ -1,24 +1,22 @@
-doctype html
-html.full-height(itemscope, itemtype='http://schema.org/Product')
-	head
-		title Something went wrong
-		link(rel="icon", href="/favicon.ico")
-		if buildCssPath
-			link(rel="stylesheet", href=buildCssPath())
+extends ../layout/layout-no-js
 
+block vars
+	- metadata = { title: 'Something went wrong', viewport: true }
+
+block body
 	body.full-height
 		main.content.content-alt.full-height
 			.container.full-height
 				.error-container.full-height
 					.error-details
 						p.error-status I'm sorry, Dave. I'm afraid I can't do that.
-						p.error-description(ng-non-bindable) There was a problem with your latest request
+						p.error-description There was a problem with your latest request
 							if(message)
 								|: #{message}
 							|.
 							br
 							| Please go back and try again.
-						p.error-description(ng-non-bindable)
+						p.error-description
 							| If the problem persists, please contact us at
 							|
 							a(href="mailto:" + settings.adminEmail) #{settings.adminEmail}

services/web/app/views/general/500.pug

@@ -1,18 +1,16 @@
-doctype html
-html.full-height(itemscope, itemtype='http://schema.org/Product')
-	head
-		title Something went wrong
-		link(rel="icon", href="/favicon.ico")
-		if buildCssPath
-			link(rel="stylesheet", href=buildCssPath())
+extends ../layout/layout-no-js
 
+block vars
+	- metadata = { title: 'Something went wrong', viewport: true }
+
+block body
 	body.full-height
 		main.content.content-alt.full-height
 			.container.full-height
 				.error-container.full-height
 					.error-details
 						p.error-status Something went wrong, sorry.
-						p.error-description(ng-non-bindable) Our staff are probably looking into this, but if it continues, please check our status page at
+						p.error-description Our staff are probably looking into this, but if it continues, please check our status page at
 							|
 							|
 							a(href="http://" + settings.statusPageUrl) #{settings.statusPageUrl}

services/web/app/views/layout/layout-no-js.pug

@@ -0,0 +1,18 @@
+doctype html
+html(lang="en")
+
+	- metadata = metadata || {}
+	block vars
+
+	head
+		if (metadata && metadata.title)
+			title= metadata.title
+		if metadata && metadata.viewport
+			meta(name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes")
+
+		link(rel="icon", href="/favicon.ico")
+
+		if buildCssPath
+			link(rel="stylesheet", href=buildCssPath())
+
+block body

services/web/frontend/stylesheets/app/error-pages.less

@@ -14,8 +14,12 @@
 
 .error-details {
   flex: 1 1 50%;
+  padding: @line-height-computed;
+  max-width: 90%;
+  @media (min-width: @screen-sm-min) {
     padding: @line-height-computed * 2;
   }
+}
 
 .error-status {
   font-family: @font-family-serif;