Bug 1146832 - fix ugly wrapping in TLS error page (r=dao)

This commit is contained in:
Mark Goodwin 2015-04-30 09:12:34 +01:00
parent 6c651b982e
commit 18e5604839
3 changed files with 41 additions and 33 deletions

View File

@ -464,18 +464,22 @@
</div>
<div id="certificateErrorReportingPanel">
<p>&errorReporting.longDesc;</p>
<p>
<input type="checkbox" id="automaticallyReportInFuture" />
<label for="automaticallyReportInFuture" id="automaticallyReportInFuture">&errorReporting.automatic;</label>
</p>
<a href="https://support.mozilla.org/kb/tls-error-reports" id="learnMoreLink" target="new">&errorReporting.learnMore;</a>
<span id="reportingState">
<button id="reportCertificateError">&errorReporting.report;</button>
<button id="reportCertificateErrorRetry">&errorReporting.tryAgain;</button>
<span id="reportSendingMessage">&errorReporting.sending;</span>
<span id="reportSentMessage">&errorReporting.sent;</span>
</span>
<div id="certificateErrorReportingDescription">
<p>&errorReporting.longDesc;</p>
<p>
<input type="checkbox" id="automaticallyReportInFuture" />
<label for="automaticallyReportInFuture" id="automaticallyReportInFuture">&errorReporting.automatic;</label>
</p>
</div>
<div id="errorStatePanel">
<a href="https://support.mozilla.org/kb/tls-error-reports" id="learnMoreLink" target="new">&errorReporting.learnMore;</a>
<span id="reportingState">
<button id="reportCertificateError">&errorReporting.report;</button>
<button id="reportCertificateErrorRetry">&errorReporting.tryAgain;</button>
<span id="reportSendingMessage">&errorReporting.sending;</span>
<span id="reportSentMessage">&errorReporting.sent;</span>
</span>
</div>
</div>
</div>

View File

@ -208,6 +208,15 @@ let AboutNetErrorListener = {
if (automatic) {
this.onSendReport(evt);
}
// hide parts of the UI we don't need yet
let contentDoc = content.document;
let reportSendingMsg = contentDoc.getElementById("reportSendingMessage");
let reportSentMsg = contentDoc.getElementById("reportSentMessage");
let retryBtn = contentDoc.getElementById("reportCertificateErrorRetry");
reportSendingMsg.style.display = "none";
reportSentMsg.style.display = "none";
retryBtn.style.display = "none";
},
onSetAutomatic: function(evt) {
@ -234,23 +243,22 @@ let AboutNetErrorListener = {
reportBtn.style.display = "none";
retryBtn.style.display = "none";
reportSentMsg.style.display = "none";
reportSendingMsg.style.display = "inline";
reportSendingMsg.style.removeProperty("display");
break;
case "error":
// show the retry button
retryBtn.style.display = "inline";
retryBtn.style.removeProperty("display");
reportSendingMsg.style.display = "none";
break;
case "complete":
// Show a success indicator
reportSentMsg.style.display = "inline";
reportSentMsg.style.removeProperty("display");
reportSendingMsg.style.display = "none";
break;
}
}
});
let failedChannel = docShell.failedChannel;
let location = contentDoc.location.href;

View File

@ -120,6 +120,15 @@ div#certificateErrorReportingPanel:-moz-dir(rtl) {
right: 0;
}
#errorStatePanel {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
align-content: space-between;
align-items: flex-start;
}
span#hostname {
font-weight: bold;
}
@ -128,25 +137,12 @@ span#hostname {
cursor: pointer;
}
#reportingState {
padding-left: 150px;
}
#reportSendingMessage {
position: relative;
display: none;
/* adjust the line-height to match the link */
line-height: 22px;
}
#reportSentMessage {
position: relative;
display: none;
}
button#reportCertificateError {
position: relative;
}
button#reportCertificateErrorRetry {
position: relative;
display: none;
/* adjust the line-height to match the link */
line-height: 22px;
}