Make rsod less annoying (#2799)

* give js-error form its own CSS rules. error form should not exceed screen size

* fix whitespace
This commit is contained in:
Mario Pietsch 2018-05-10 15:45:50 +02:00 committed by Jeremy Ruston
parent 737e9ae4cb
commit 7468ad7acf
2 changed files with 36 additions and 22 deletions

View File

@ -9,37 +9,51 @@ Basic styles used before we boot up the parsing engine
Error message and password prompt
*/
.tc-password-wrapper, .tc-error-form {
.tc-error-form {
font-family: sans-serif;
color: #fff;
z-index: 20000;
position: fixed;
background-color: rgb(255, 75, 75);
border: 8px solid rgb(255, 0, 0);
border-radius: 8px;
width: 50%;
margin-left: 25%;
margin-top: 4em;
padding: 0 2em 2em 2em;
}
.tc-error-form h1 {
text-align: center;
}
.tc-error-prompt {
text-align: center;
color: #000;
margin-bottom: 1em;
}
.tc-error-message {
overflow: auto;
max-height: 40em;
padding-right: 1em;
margin-bottom: 1em;
white-space: pre-line;
}
.tc-password-wrapper {
font-family: sans-serif;
z-index: 20000;
position: fixed;
text-align: center;
width: 200px;
top: 4em;
left: 50%;
margin-left: -144px; /* - width/2 - paddingHorz/2 - border */
left: 50%;
margin-left: -144px; /* - width/2 - paddingHorz/2 - border */
padding: 16px 16px 16px 16px;
border-radius: 8px;
}
.tc-error-form {
color: #fff;
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
background-color: rgb(255, 75, 75);
border: 8px solid rgb(255, 0, 0);
width: 480px;
margin-left: -244px; /* - width/2 - paddingHorz/2 - border */
}
.tc-error-form div {
padding-bottom: 1em;
}
.tc-error-prompt {
color: #000;
text-shadow: none;
}
.tc-password-wrapper {
color: #000;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);

View File

@ -135,7 +135,7 @@ $tw.utils.error = function(err) {
var dm = $tw.utils.domMaker,
heading = dm("h1",{text: errHeading}),
prompt = dm("div",{text: promptMsg, "class": "tc-error-prompt"}),
message = dm("div",{text: err}),
message = dm("div",{text: err, "class":"tc-error-message"}),
button = dm("button",{text: ( $tw.language == undefined ? "close" : $tw.language.getString("Buttons/Close/Caption") )}),
form = dm("form",{children: [heading,prompt,message,button], "class": "tc-error-form"});
document.body.insertBefore(form,document.body.firstChild);