remove old-style markup from exception dialog

js/App.js

@@ -542,29 +542,31 @@ const App = {
 			}
 
 			try {
-				let stack_msg = "";
-
-				if (error.stack)
-					stack_msg += `<div><b>Stack trace:</b></div>
-						<textarea name="stack" readonly="1">${error.stack}</textarea>`;
-
-				if (params.info)
-					stack_msg += `<div><b>Additional information:</b></div>
-						<textarea name="stack" readonly="1">${params.info}</textarea>`;
-
-				const content = `<div class="error-contents">
-						<p class="message">${message}</p>
-						${stack_msg}
-						<div class="dlgButtons">
-							<button dojoType="dijit.form.Button"
-								onclick="dijit.byId('exceptionDlg').hide()">${__('Close this window')}</button>
-						</div>
-					</div>`;
-
 				const dialog = new fox.SingleUseDialog({
-					id: "exceptionDlg",
 					title: params.title || __("Unhandled exception"),
-					content: content
+					content: `
+               <div class='exception-contents'>
+                  <h3>${message}</h3>
+
+                  <header>${__('Stack trace')}</header>
+                  <section>
+                     <textarea readonly='readonly'>${error.stack}</textarea>
+                  </section>
+
+                  ${params && params.info ?
+                     `
+                     <header>${__('Additional information')}</header>
+                     <section>
+                        <textarea readonly='readonly'>${params.info}</textarea>
+                     </section>
+                     ` : ''}
+               </div>
+               <footer class='text-center'>
+                  <button dojoType="dijit.form.Button" class='alt-primary' type='submit'>
+                     ${__('Close this window')}
+                  </button>
+               </footer>
+            </div>`
 				});
 
 				dialog.show();

themes/compact.css

@@ -526,22 +526,13 @@ body.ttrss_main #feed_browser_spinner {
   height: 18px;
   width: 18px;
 }
-body.ttrss_main #exceptionDlg .dijitDialogTitleBar {
+body.ttrss_main .exception-contents h3 {
-  background: red;
-  color: white;
-}
-body.ttrss_main #exceptionDlg .dijitDialogPaneContent {
-  background: #fcc;
-}
-body.ttrss_main #exceptionDlg .error-contents .message {
   color: red;
 }
-body.ttrss_main #exceptionDlg .error-contents textarea {
+body.ttrss_main .exception-contents textarea {
   width: 99%;
   height: 200px;
-}
+  font-size: 11px;
-body.ttrss_main #exceptionDlg .error-contents .dlgButtons {
-  text-align: center;
 }
 body.ttrss_main #content-wrap {
   padding: 0px;

themes/compact_night.css

@@ -526,22 +526,13 @@ body.ttrss_main #feed_browser_spinner {
   height: 18px;
   width: 18px;
 }
-body.ttrss_main #exceptionDlg .dijitDialogTitleBar {
+body.ttrss_main .exception-contents h3 {
-  background: red;
-  color: white;
-}
-body.ttrss_main #exceptionDlg .dijitDialogPaneContent {
-  background: #fcc;
-}
-body.ttrss_main #exceptionDlg .error-contents .message {
   color: red;
 }
-body.ttrss_main #exceptionDlg .error-contents textarea {
+body.ttrss_main .exception-contents textarea {
   width: 99%;
   height: 200px;
-}
+  font-size: 11px;
-body.ttrss_main #exceptionDlg .error-contents .dlgButtons {
-  text-align: center;
 }
 body.ttrss_main #content-wrap {
   padding: 0px;

themes/light.css

@@ -526,22 +526,13 @@ body.ttrss_main #feed_browser_spinner {
   height: 18px;
   width: 18px;
 }
-body.ttrss_main #exceptionDlg .dijitDialogTitleBar {
+body.ttrss_main .exception-contents h3 {
-  background: red;
-  color: white;
-}
-body.ttrss_main #exceptionDlg .dijitDialogPaneContent {
-  background: #fcc;
-}
-body.ttrss_main #exceptionDlg .error-contents .message {
   color: red;
 }
-body.ttrss_main #exceptionDlg .error-contents textarea {
+body.ttrss_main .exception-contents textarea {
   width: 99%;
   height: 200px;
-}
+  font-size: 11px;
-body.ttrss_main #exceptionDlg .error-contents .dlgButtons {
-  text-align: center;
 }
 body.ttrss_main #content-wrap {
   padding: 0px;

themes/light/tt-rss.less

@@ -609,28 +609,14 @@ body.ttrss_main {
 		width : 18px;
 	}
 
-	#exceptionDlg {
+	.exception-contents {
-		.dijitDialogTitleBar {
+		h3 {
-			background : red;
+			color : red;
-			color : white;
 		}
-
+		textarea {
-		.dijitDialogPaneContent {
+			width : 99%;
-			background : #fcc;
+			height : 200px;
-		}
+			font-size : 11px;
-
-		.error-contents {
-			.message {
-				color : red;
-			}
-
-			textarea {
-				width : 99%;
-				height : 200px;
-			}
-			.dlgButtons {
-				text-align : center;
-			}
 		}
 	}
 

themes/night.css

@@ -527,22 +527,13 @@ body.ttrss_main #feed_browser_spinner {
   height: 18px;
   width: 18px;
 }
-body.ttrss_main #exceptionDlg .dijitDialogTitleBar {
+body.ttrss_main .exception-contents h3 {
-  background: red;
-  color: white;
-}
-body.ttrss_main #exceptionDlg .dijitDialogPaneContent {
-  background: #fcc;
-}
-body.ttrss_main #exceptionDlg .error-contents .message {
   color: red;
 }
-body.ttrss_main #exceptionDlg .error-contents textarea {
+body.ttrss_main .exception-contents textarea {
   width: 99%;
   height: 200px;
-}
+  font-size: 11px;
-body.ttrss_main #exceptionDlg .error-contents .dlgButtons {
-  text-align: center;
 }
 body.ttrss_main #content-wrap {
   padding: 0px;

themes/night_blue.css

@@ -527,22 +527,13 @@ body.ttrss_main #feed_browser_spinner {
   height: 18px;
   width: 18px;
 }
-body.ttrss_main #exceptionDlg .dijitDialogTitleBar {
+body.ttrss_main .exception-contents h3 {
-  background: red;
-  color: white;
-}
-body.ttrss_main #exceptionDlg .dijitDialogPaneContent {
-  background: #fcc;
-}
-body.ttrss_main #exceptionDlg .error-contents .message {
   color: red;
 }
-body.ttrss_main #exceptionDlg .error-contents textarea {
+body.ttrss_main .exception-contents textarea {
   width: 99%;
   height: 200px;
-}
+  font-size: 11px;
-body.ttrss_main #exceptionDlg .error-contents .dlgButtons {
-  text-align: center;
 }
 body.ttrss_main #content-wrap {
   padding: 0px;