Index: chrome/renderer/resources/neterror.html |
=================================================================== |
--- chrome/renderer/resources/neterror.html (revision 65342) |
+++ chrome/renderer/resources/neterror.html (working copy) |
@@ -4,30 +4,54 @@ |
<title i18n-content="title"> |
</title> |
<style> |
+html { |
+ height: 100%; |
+ background-color: #999; |
+} |
body { |
- background-color: #fff; |
- color: #000; |
+ height: 100%; |
+ background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#BBB), to(#999)); |
font-family: Helvetica, Arial, sans-serif; |
- font-size: 83%; |
- line-height: 120%; |
- max-width: 35em; |
- padding: 0.5em 1em; |
+ margin: 0; |
} |
-li { |
- padding-bottom: .3em; |
+#cell { |
+ border-top: 1px solid #999; |
+ padding: 40px; |
} |
+#box { |
+ width: 80%; |
+ max-width: 750px; |
+ background-color: white; |
+ color: black; |
+ font-size: 10pt; |
+ line-height: 18px; |
+ -webkit-box-shadow: 2px 5px 12px #555; |
+ border-radius: 5px; |
+ margin: auto; |
+ padding: 20px; |
+} |
ul { |
- margin: .5em 0 0; |
+ margin: 0; |
padding-bottom: 0; |
} |
h1 { |
- font-size: 1.5em; |
- margin-bottom: 1.5em; |
+ font-size: 18pt; |
+ line-height: 30px; |
+ margin: 0; |
} |
+h1 img { |
+ float: right; |
+ border: 0; |
+ margin-top: -4px; |
+ -webkit-margin-start: 20px; |
+} |
+html[dir=rtl] h1 img { |
+ float: left; |
+} |
h2 { |
- font-size: 1em; |
+ font-size: 10pt; |
font-weight: bold; |
- margin: 0 0 .5em; |
+ margin: 0; |
padding: 0; |
} |
a { |
@@ -40,87 +64,45 @@ |
color: #551a8b; |
} |
#errorSummary, #suggestions, #search { |
- margin-bottom: 2.5em; |
+ -webkit-margin-start: 3px; |
+ margin-top: 15px; |
} |
-#zipInfo { |
- padding-left: 16px; |
- overflow: hidden; |
- -webkit-transition: height .1s ease-out; |
+#errorDetails { |
+ color: #777; |
+ -webkit-margin-start: 3px; |
+ margin-top: 30px; |
} |
-#plus { |
- border: 0; |
- cursor: pointer; |
- vertical-align: baseline; |
-} |
-#details { |
- background-color: #e0e0e0; |
- max-width: 30em; |
- padding: 1em; |
-} |
-#errorDetails.hide-details #plus { |
- display: inline; |
-} |
-#errorDetails.show-details #plus { |
- display: none; |
-} |
-#errorDetails.hide-details #minus { |
- display: none; |
-} |
-#errorDetails.show-details #minus { |
- display: inline; |
-} |
-#errorDetails.hide-details #zipInfo { |
- height: 0 !important; |
-} |
</style> |
-<script> |
-function toggleDiv() { |
- var elt = document.getElementById('errorDetails'); |
- elt.className = (elt.className == 'show-details') ? 'hide-details' |
- : 'show-details'; |
- |
- if (elt.className == 'show-details') { |
- zipInfo.style.height = zipInfo.offsetHeight + 'px'; |
- } else { |
- zipInfo.style.height = 'auto'; |
- } |
-} |
-</script> |
</head> |
<body id="t"> |
+<div id="cell"> |
+ <div id="box"> |
+ <h1> |
+ <img src="../../app/theme/%DISTRIBUTION%/product_logo.png" /> |
+ <span i18n-content="heading"></span> |
+ </h1> |
-<h1 i18n-content="heading"></h1> |
+ <div id="errorSummary" jsselect="summary"> |
+ <p jsvalues=".innerHTML:msg"></div> |
-<div id="errorSummary" jsselect="summary"> |
- <p jsvalues=".innerHTML:msg"></p> |
-</div> |
+ <div id="suggestions"> |
+ <h2 i18n-content="suggestionsHeading"></h2> |
+ <ul> |
+ <li jsselect="suggestionsReload"> |
+ <span jsvalues=".innerHTML:msg"></span> |
+ </li> |
+ <li jsselect="suggestionsHomepage"> |
+ <span jscontent="suggestionsHomepageMsg"></span> |
+ <a jscontent="hostName" jsvalues="href:homePage"></a> |
+ </li> |
+ <li jsselect="suggestionsLearnMore"> |
+ <span jsvalues=".innerHTML:msg"></span> |
+ </li> |
+ </ul> |
+ </div> |
-<div id="suggestions"> |
- <h2 i18n-content="suggestionsHeading"></h2> |
- <ul> |
- <li jsselect="suggestionsReload"> |
- <span jsvalues=".innerHTML:msg"></span> |
- </li> |
- <li jsselect="suggestionsHomepage"> |
- <span jscontent="suggestionsHomepageMsg"></span> |
- <a jscontent="hostName" jsvalues="href:homePage"></a> |
- </li> |
- <li jsselect="suggestionsLearnMore"> |
- <span jsvalues=".innerHTML:msg"></span> |
- </li> |
- </ul> |
-</div> |
- |
-<div id="errorDetails" class="hide-details"> |
- <a href="javascript:void(0);" style="text-decoration:none" onclick="toggleDiv()"> |
- <img id="plus" src="../../browser/resources/shared/images/plus.png"> |
- <img id="minus" src="../../browser/resources/shared/images/minus.png"> |
- <span id="errorExpander" i18n-content="detailsLink" style="text-decoration:underline"></span> |
- </a> |
- <div id="zipInfo"> |
- <p i18n-content="detailsHeading"></p> |
- <div id="details" i18n-content="details"></div> |
+ <div id="errorDetails" i18n-content="details"></div> |
</div> |
</div> |
</body> |