Bug 962787 - Implement New Designs for the InContent Untrusted and Attack! Pages. r=sfoster
|
@ -178,16 +178,18 @@
|
|||
}
|
||||
|
||||
function toggle(id) {
|
||||
var el = document.getElementById(id);
|
||||
if (el.getAttribute("collapsed"))
|
||||
el.setAttribute("collapsed", false);
|
||||
else
|
||||
el.setAttribute("collapsed", true);
|
||||
var element = document.getElementById(id);
|
||||
if (element.hasAttribute("collapsed")) {
|
||||
element.removeAttribute("collapsed");
|
||||
} else {
|
||||
element.setAttribute("collapsed", true);
|
||||
}
|
||||
}
|
||||
]]></script>
|
||||
</head>
|
||||
|
||||
<body id="errorPage" class="certerror" dir="&locale.dir;">
|
||||
<div class="top-decoration"></div>
|
||||
|
||||
<!-- PAGE CONTAINER (for styling purposes only) -->
|
||||
<div id="errorPageContainer" class="section">
|
||||
|
@ -214,14 +216,14 @@
|
|||
|
||||
<!-- The following sections can be unhidden by default by setting the
|
||||
"browser.xul.error_pages.expert_bad_cert" pref to true -->
|
||||
<div id="technicalContent" collapsed="true">
|
||||
<h2 onclick="toggle('technicalContent');" id="technicalContentHeading">&certerror.technical.heading;</h2>
|
||||
<p id="technicalContentText"/>
|
||||
<div id="technicalContent" class="expandable-section" collapsed="true">
|
||||
<h2 onclick="toggle('technicalContent');" id="technicalContentHeading" class="expandable-heading">&certerror.technical.heading;</h2>
|
||||
<p class="expandable-content" id="technicalContentText"/>
|
||||
</div>
|
||||
|
||||
<div id="expertContent" collapsed="true">
|
||||
<h2 onclick="toggle('expertContent');" id="expertContentHeading">&certerror.expert.heading;</h2>
|
||||
<div>
|
||||
<div id="expertContent" class="expandable-section" collapsed="true">
|
||||
<h2 onclick="toggle('expertContent');" id="expertContentHeading" class="expandable-heading">&certerror.expert.heading;</h2>
|
||||
<div class="expandable-content">
|
||||
<p>&certerror.expert.content;</p>
|
||||
<p>&certerror.expert.contentPara2;</p>
|
||||
<xul:button xmlns:xul='http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul' id='temporaryExceptionButton' label='&certerror.addTemporaryException.label;'/>
|
||||
|
|
|
@ -151,7 +151,7 @@
|
|||
</head>
|
||||
|
||||
<body id="errorPage" class="blockedsite" dir="&locale.dir;">
|
||||
|
||||
<div class="top-decoration"></div>
|
||||
|
||||
<div id="errorPageContainer" class="section">
|
||||
|
||||
|
|
|
@ -115,4 +115,9 @@
|
|||
% XXX currently, there's some weirdness with the dppx unit, as documented in
|
||||
% bug 895277. Because of that, we have to use 1.39dppx instead of 1.4dppx.
|
||||
%define min_res_140pc 1.39dppx
|
||||
%define min_res_180pc 1.8dppx
|
||||
%define min_res_180pc 1.8dppx
|
||||
|
||||
% error page style constants
|
||||
%define error_page_background_color #eee
|
||||
%define error_page_warning_color #efd400
|
||||
%define error_page_error_color #bf0000
|
После Ширина: | Высота: | Размер: 2.9 KiB |
После Ширина: | Высота: | Размер: 3.9 KiB |
После Ширина: | Высота: | Размер: 5.1 KiB |
После Ширина: | Высота: | Размер: 2.9 KiB |
После Ширина: | Высота: | Размер: 3.9 KiB |
После Ширина: | Высота: | Размер: 5.1 KiB |
Двоичные данные
browser/metro/theme/images/errorpage-larry-black.png
До Ширина: | Высота: | Размер: 850 B |
Двоичные данные
browser/metro/theme/images/errorpage-larry-white.png
До Ширина: | Высота: | Размер: 886 B |
|
@ -119,8 +119,12 @@ chrome.jar:
|
|||
skin/images/errorpage-warning.png (images/errorpage-warning.png)
|
||||
skin/images/errorpage-warning@1.4x.png (images/errorpage-warning@1.4x.png)
|
||||
skin/images/errorpage-warning@1.8x.png (images/errorpage-warning@1.8x.png)
|
||||
skin/images/errorpage-larry-white.png (images/errorpage-larry-white.png)
|
||||
skin/images/errorpage-larry-black.png (images/errorpage-larry-black.png)
|
||||
skin/images/errorpage-cert-untrusted.png (images/errorpage-cert-untrusted.png)
|
||||
skin/images/errorpage-cert-untrusted@1.4x.png (images/errorpage-cert-untrusted@1.4x.png)
|
||||
skin/images/errorpage-cert-untrusted@1.8x.png (images/errorpage-cert-untrusted@1.8x.png)
|
||||
skin/images/errorpage-blocked-site.png (images/errorpage-blocked-site.png)
|
||||
skin/images/errorpage-blocked-site@1.4x.png (images/errorpage-blocked-site@1.4x.png)
|
||||
skin/images/errorpage-blocked-site@1.8x.png (images/errorpage-blocked-site@1.8x.png)
|
||||
skin/images/alert-downloads-30.png (images/alert-downloads-30.png)
|
||||
skin/images/search-glass-30.png (images/search-glass-30.png)
|
||||
skin/images/play-hdpi.png (images/play-hdpi.png)
|
||||
|
|
|
@ -65,13 +65,48 @@ li {
|
|||
padding: 8px 0px;
|
||||
}
|
||||
|
||||
#errorPage.certerror {
|
||||
background-color: #EFD400;
|
||||
#errorPage.certerror, #errorPage.blockedsite {
|
||||
background-color: @error_page_background_color@;
|
||||
}
|
||||
|
||||
#errorPage.blockedsite {
|
||||
background-color: #BF0000;
|
||||
color: #fff;
|
||||
#errorPage button {
|
||||
margin: 5px 10px 5px 0;
|
||||
}
|
||||
|
||||
#errorPage > .top-decoration {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
#errorPage.certerror > .top-decoration {
|
||||
background: linear-gradient(-45deg,
|
||||
@error_page_background_color@ 25%,
|
||||
@error_page_warning_color@ 25%,
|
||||
@error_page_warning_color@ 50%,
|
||||
@error_page_background_color@ 50%,
|
||||
@error_page_background_color@ 75%,
|
||||
@error_page_warning_color@ 75%,
|
||||
@error_page_warning_color@) repeat scroll 0% 0% /
|
||||
80px 80px transparent;
|
||||
}
|
||||
|
||||
#errorPage.blockedsite > .top-decoration {
|
||||
background: linear-gradient(-45deg,
|
||||
@error_page_background_color@ 25%,
|
||||
@error_page_error_color@ 25%,
|
||||
@error_page_error_color@ 50%,
|
||||
@error_page_background_color@ 50%,
|
||||
@error_page_background_color@ 75%,
|
||||
@error_page_error_color@ 75%,
|
||||
@error_page_error_color@) repeat scroll 0% 0% /
|
||||
80px 80px transparent;
|
||||
}
|
||||
|
||||
#errorPage #cert_domain_link {
|
||||
color: #0095dd;
|
||||
}
|
||||
|
||||
#errorPage.certerror #errorPageContainer > .section-header,
|
||||
|
@ -88,9 +123,6 @@ li {
|
|||
-moz-padding-end: 24px;
|
||||
}
|
||||
|
||||
#errorTitle {
|
||||
}
|
||||
|
||||
#errorTitleIcon {
|
||||
background-image: url("chrome://browser/skin/images/errorpage-warning.png");
|
||||
background-position: center center;
|
||||
|
@ -105,11 +137,35 @@ li {
|
|||
width: 40px;
|
||||
}
|
||||
|
||||
#errorPage.certerror #errorTitleIcon, #errorPage.blockedsite #errorTitleIcon {
|
||||
background-size: 60px 60px;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
-moz-margin-start: -80px;
|
||||
-moz-margin-end: 10px;
|
||||
}
|
||||
|
||||
#errorPage.certerror #errorTitleIcon {
|
||||
background-image: url("chrome://browser/skin/images/errorpage-cert-untrusted.png");
|
||||
}
|
||||
|
||||
#errorPage.blockedsite #errorTitleIcon {
|
||||
background-image: url("chrome://browser/skin/images/errorpage-blocked-site.png");
|
||||
}
|
||||
|
||||
@media (min-resolution: @min_res_140pc@) {
|
||||
/* Load 140% image when scaled by 140% */
|
||||
#errorTitleIcon {
|
||||
background-image: url("chrome://browser/skin/images/errorpage-warning@1.4x.png");
|
||||
}
|
||||
|
||||
#errorPage.certerror #errorTitleIcon {
|
||||
background-image: url("chrome://browser/skin/images/errorpage-cert-untrusted@1.4x.png");
|
||||
}
|
||||
|
||||
#errorPage.blockedsite #errorTitleIcon {
|
||||
background-image: url("chrome://browser/skin/images/errorpage-blocked-site@1.4x.png");
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-resolution: @min_res_180pc@) {
|
||||
|
@ -117,15 +173,22 @@ li {
|
|||
#errorTitleIcon {
|
||||
background-image: url("chrome://browser/skin/images/errorpage-warning@1.8x.png");
|
||||
}
|
||||
|
||||
#errorPage.certerror #errorTitleIcon {
|
||||
background-image: url("chrome://browser/skin/images/errorpage-cert-untrusted@1.8x.png");
|
||||
}
|
||||
|
||||
#errorPage.blockedsite #errorTitleIcon {
|
||||
background-image: url("chrome://browser/skin/images/errorpage-blocked-site@1.8x.png");
|
||||
}
|
||||
}
|
||||
|
||||
#errorPage.certerror #errorTitleIcon {
|
||||
background-image: url("chrome://browser/skin/images/errorpage-larry-black.png");
|
||||
}
|
||||
|
||||
#errorPage.blockedsite #errorTitleIcon {
|
||||
background-image: url("chrome://browser/skin/images/errorpage-larry-white.png");
|
||||
color: white;
|
||||
@media (max-width: 760px) {
|
||||
#errorPage.certerror #errorTitleIcon, #errorPage.blockedsite #errorTitleIcon {
|
||||
display: block;
|
||||
-moz-margin-start: 0;
|
||||
-moz-margin-end: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.errorTitleText {
|
||||
|
@ -188,28 +251,25 @@ li {
|
|||
padding-right: 8px;
|
||||
}
|
||||
|
||||
|
||||
#securityOverrideDiv {
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
div[collapsed] {
|
||||
padding-left: 15px;
|
||||
background-image: url("chrome://browser/skin/images/arrowright-16.png");
|
||||
.expandable-section {
|
||||
background: url("chrome://browser/skin/images/arrowdown-16.png") no-repeat left 0.6em;
|
||||
background-size: 11px 11px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: left 0.6em;
|
||||
}
|
||||
|
||||
div[collapsed="true"] {
|
||||
.expandable-section[collapsed] {
|
||||
background-image: url("chrome://browser/skin/images/arrowright-16.png");
|
||||
}
|
||||
|
||||
div[collapsed="false"] {
|
||||
background-image: url("chrome://browser/skin/images/arrowdown-16.png");
|
||||
}
|
||||
|
||||
div[collapsed="true"] > p,
|
||||
div[collapsed="true"] > div {
|
||||
.expandable-section[collapsed] > .expandable-content {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.expandable-section > .expandable-heading {
|
||||
cursor: pointer;
|
||||
-moz-padding-start: 15px;
|
||||
-moz-user-select: none;
|
||||
}
|
||||
|
|