revert: feat: styled error screen (#8930)
This commit is contained in:
		
							parent
							
								
									b9f9fe2927
								
							
						
					
					
						commit
						b35c3114c8
					
				
					 4 changed files with 11 additions and 138 deletions
				
			
		|  | @ -106,39 +106,15 @@ | ||||||
| 	function renderError(code, details) { | 	function renderError(code, details) { | ||||||
| 		let errorsElement = document.getElementById('errors'); | 		let errorsElement = document.getElementById('errors'); | ||||||
| 		if (!errorsElement) { | 		if (!errorsElement) { | ||||||
| 			document.getElementsByTagName("head")[0].insertAdjacentHTML( |  | ||||||
| 				"beforeend", |  | ||||||
| 				`<link rel="stylesheet" href="../error.css" />`); |  | ||||||
| 			document.documentElement.innerHTML = ` | 			document.documentElement.innerHTML = ` | ||||||
| 			<svg class="icon-warning" xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-alert-triangle" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"> | 			<h1>⚠ An error has occurred. ⚠</h1> | ||||||
|    			<path stroke="none" d="M0 0h24v24H0z" fill="none"></path> | 			<p>If the problem persists, please contact the administrator. You may also try the following options:</p> | ||||||
|    			<path d="M12 9v2m0 4v.01"></path> | 			<ul> | ||||||
|    			<path d="M5 19h14a2 2 0 0 0 1.84 -2.75l-7.1 -12.25a2 2 0 0 0 -3.5 0l-7.1 12.25a2 2 0 0 0 1.75 2.75"></path> | 				<li>Start <a href="/cli">the simple client</a></li> | ||||||
| 			</svg> | 				<li>Attempt to repair in <a href="/bios">BIOS</a></li> | ||||||
| 			<h1>An error has occurred!</h1> | 				<li><a href="/flush">Flush preferences and cache</a></li> | ||||||
| 			<button class="button-big" onclick="location.reload(true);"> | 			</ul> | ||||||
| 				<span class="button-label-big">Refresh</span> | 			<hr> | ||||||
| 			</button> |  | ||||||
|       <p class="dont-worry">Don't worry, it's (probably) not your fault.</p> |  | ||||||
| 			<p>If the problem persists after refreshing, please contact your instance's administrator.<br>You may also try the following options:</p> |  | ||||||
|       <a href="/flush"> |  | ||||||
|       <button class="button-small"> |  | ||||||
|         <span class="button-label-small">Flush preferences and cache</span> |  | ||||||
|       </button> |  | ||||||
|       </a> |  | ||||||
| 			<br> |  | ||||||
|       <a href="/cli"> |  | ||||||
|         <button class="button-small"> |  | ||||||
|           <span class="button-label-small">Start the simple client</span> |  | ||||||
|         </button> |  | ||||||
|       </a> |  | ||||||
| 			<br> |  | ||||||
|       <a href="/bios"> |  | ||||||
|         <button class="button-small"> |  | ||||||
|           <span class="button-label-small">Attempt to repair in Repair Tool</span> |  | ||||||
|         </button> |  | ||||||
|       </a> |  | ||||||
| 			<br> |  | ||||||
| 			<div id="errors"></div> | 			<div id="errors"></div> | ||||||
| 			`;
 | 			`;
 | ||||||
| 
 | 
 | ||||||
|  | @ -146,7 +122,8 @@ | ||||||
| 		} | 		} | ||||||
| 
 | 
 | ||||||
| 		const detailsElement = document.createElement('details'); | 		const detailsElement = document.createElement('details'); | ||||||
| 		detailsElement.innerHTML = `<br><summary><code>ERROR CODE: ${code}</code></summary>${JSON.stringify(details)}`; | 		detailsElement.innerHTML = `<summary><code>ERROR CODE: ${code}</code></summary>${JSON.stringify(details)}`; | ||||||
|  | 
 | ||||||
| 		errorsElement.appendChild(detailsElement); | 		errorsElement.appendChild(detailsElement); | ||||||
| 	} | 	} | ||||||
| 
 | 
 | ||||||
|  |  | ||||||
|  | @ -1,98 +0,0 @@ | ||||||
| * { |  | ||||||
| 	font-family: BIZ UDGothic, Roboto, HelveticaNeue, Arial, sans-serif; |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| body, |  | ||||||
| html { |  | ||||||
| 	background-color: #222; |  | ||||||
| 	color: #dfddcc; |  | ||||||
| 	justify-content: center; |  | ||||||
| 	margin: auto; |  | ||||||
| 	width: 80%; |  | ||||||
| 	padding: 10px; |  | ||||||
| 	text-align: center; |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| button { |  | ||||||
| 	border-radius: 999px; |  | ||||||
| 	padding: 0px 12px 0px 12px; |  | ||||||
| 	border: none; |  | ||||||
| 	cursor: pointer; |  | ||||||
| 	margin-bottom: 12px; |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| .button-big { |  | ||||||
| 	background: linear-gradient(90deg, rgb(134, 179, 0), rgb(74, 179, 0)); |  | ||||||
| 	line-height: 50px; |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| .button-big:hover { |  | ||||||
| 	background: rgb(153, 204, 0); |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| .button-small { |  | ||||||
| 	background: #444; |  | ||||||
| 	line-height: 40px; |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| .button-small:hover { |  | ||||||
| 	background: #555; |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| .button-label-big { |  | ||||||
| 	color: #222; |  | ||||||
| 	font-weight: bold; |  | ||||||
| 	font-size: 20px; |  | ||||||
| 	padding: 12px; |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| .button-label-small { |  | ||||||
| 	color: rgb(153, 204, 0); |  | ||||||
| 	font-size: 16px; |  | ||||||
| 	padding: 12px; |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| a { |  | ||||||
| 	color: rgb(134, 179, 0); |  | ||||||
| 	text-decoration: none; |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| p, |  | ||||||
| li { |  | ||||||
| 	font-size: 16px; |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| .dont-worry, |  | ||||||
| #msg { |  | ||||||
| 	font-size: 18px; |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| .icon-warning { |  | ||||||
| 	color: #dec340; |  | ||||||
| 	height: 4rem; |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| h1 { |  | ||||||
| 	font-size: 32px; |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| code { |  | ||||||
| 	font-family: Fira, FiraCode, monospace; |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| details { |  | ||||||
| 	background: #333; |  | ||||||
| 	margin-bottom: 2rem; |  | ||||||
| 	padding: 0.5rem 1rem; |  | ||||||
| 	border-radius: 5px; |  | ||||||
| 	justify-content: center; |  | ||||||
| 	margin: auto; |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| summary { |  | ||||||
| 	cursor: pointer; |  | ||||||
| } |  | ||||||
| 
 |  | ||||||
| summary > * { |  | ||||||
| 	display: inline; |  | ||||||
| } |  | ||||||
|  | @ -53,7 +53,7 @@ html | ||||||
| 		block meta | 		block meta | ||||||
| 
 | 
 | ||||||
| 		block og | 		block og | ||||||
| 			meta(property='og:title'       content= title || 'Misskey') | 			meta(property='og:title'       content= title || 'Misskey')  | ||||||
| 			meta(property='og:description' content= desc || '✨🌎✨ A interplanetary communication platform ✨🚀✨')  | 			meta(property='og:description' content= desc || '✨🌎✨ A interplanetary communication platform ✨🚀✨')  | ||||||
| 			meta(property='og:image'       content= img) | 			meta(property='og:image'       content= img) | ||||||
| 
 | 
 | ||||||
|  |  | ||||||
|  | @ -1,12 +1,6 @@ | ||||||
| doctype html | doctype html | ||||||
| 
 | 
 | ||||||
| html | html | ||||||
| 	head |  | ||||||
| 		meta(charset='utf-8') |  | ||||||
| 		meta(name='application-name' content='Misskey') |  | ||||||
| 		title Flushing Misskey |  | ||||||
| 		style |  | ||||||
| 			include ../error.css |  | ||||||
| 	#msg | 	#msg | ||||||
| 	script. | 	script. | ||||||
| 		const msg = document.getElementById('msg'); | 		const msg = document.getElementById('msg'); | ||||||
|  |  | ||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue