| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html i18n-values="dir:textdirection"> | 2 <html i18n-values="dir:textdirection"> |
| 3 <head> | 3 <head> |
| 4 <meta name="viewport" content="width=device-width, initial-scale=1.0, | 4 <meta name="viewport" content="width=device-width, initial-scale=1.0, |
| 5 maximum-scale=1.0, user-scalable=no"> | 5 maximum-scale=1.0, user-scalable=no"> |
| 6 <title i18n-content="title"> | 6 <title i18n-content="title"> |
| 7 </title> | 7 </title> |
| 8 <style> | 8 <style> |
| 9 | 9 |
| 10 body { | 10 body { |
| (...skipping 19 matching lines...) Expand all Loading... |
| 30 html:not([subframe]) #sub-frame-error { | 30 html:not([subframe]) #sub-frame-error { |
| 31 display: none; | 31 display: none; |
| 32 } | 32 } |
| 33 | 33 |
| 34 #box { | 34 #box { |
| 35 background-color: #fbfbfb; | 35 background-color: #fbfbfb; |
| 36 border: 1px solid #AAA; | 36 border: 1px solid #AAA; |
| 37 border-bottom: 1px solid #888; | 37 border-bottom: 1px solid #888; |
| 38 border-radius: 3px; | 38 border-radius: 3px; |
| 39 color: black; | 39 color: black; |
| 40 <if expr="not is_android and not pp_ifdef('ios')"> | 40 <if expr="not is_android and not is_ios"> |
| 41 /* Not done on mobile for performance reasons. */ | 41 /* Not done on mobile for performance reasons. */ |
| 42 box-shadow: 0px 2px 2px #AAA; | 42 box-shadow: 0px 2px 2px #AAA; |
| 43 </if> | 43 </if> |
| 44 } | 44 } |
| 45 | 45 |
| 46 #diagnose-button { | 46 #diagnose-button { |
| 47 margin-top: 20px; | 47 margin-top: 20px; |
| 48 margin-bottom: 10px; | 48 margin-bottom: 10px; |
| 49 -webkit-margin-start: 0px; | 49 -webkit-margin-start: 0px; |
| 50 } | 50 } |
| (...skipping 46 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 97 padding: 25px 20px; | 97 padding: 25px 20px; |
| 98 text-align: start; | 98 text-align: start; |
| 99 } | 99 } |
| 100 | 100 |
| 101 #suggestions { | 101 #suggestions { |
| 102 margin-top: 15px; | 102 margin-top: 15px; |
| 103 } | 103 } |
| 104 | 104 |
| 105 #sub-frame-error-details { | 105 #sub-frame-error-details { |
| 106 color: #8F8F8F; | 106 color: #8F8F8F; |
| 107 <if expr="not is_android and not pp_ifdef('ios')"> | 107 <if expr="not is_android and not is_ios"> |
| 108 /* Not done on mobile for performance reasons. */ | 108 /* Not done on mobile for performance reasons. */ |
| 109 text-shadow: 0 1px 0 rgba(255,255,255,0.3); | 109 text-shadow: 0 1px 0 rgba(255,255,255,0.3); |
| 110 </if> | 110 </if> |
| 111 } | 111 } |
| 112 | 112 |
| 113 [jscontent=failedUrl] { | 113 [jscontent=failedUrl] { |
| 114 overflow-wrap: break-word; | 114 overflow-wrap: break-word; |
| 115 } | 115 } |
| 116 | 116 |
| 117 button { | 117 button { |
| 118 border: 1px solid rgba(0, 0, 0, 0.25); | 118 border: 1px solid rgba(0, 0, 0, 0.25); |
| 119 border-radius: 2px; | 119 border-radius: 2px; |
| 120 color: #444; | 120 color: #444; |
| 121 margin: 0px 5px; | 121 margin: 0px 5px; |
| 122 min-height: 29px; | 122 min-height: 29px; |
| 123 min-width: 65px; | 123 min-width: 65px; |
| 124 -webkit-user-select: none; | 124 -webkit-user-select: none; |
| 125 padding: 8px 13px; | 125 padding: 8px 13px; |
| 126 <if expr="not is_android"> | 126 <if expr="not is_android"> |
| 127 /* iOS does not support linear-gradient without a prefix. */ | 127 /* iOS does not support linear-gradient without a prefix. */ |
| 128 background-image: -webkit-linear-gradient(#ededed, #ededed 38%, #dedede); | 128 background-image: -webkit-linear-gradient(#ededed, #ededed 38%, #dedede); |
| 129 text-shadow: 0 1px 0 rgb(240, 240, 240); | 129 text-shadow: 0 1px 0 rgb(240, 240, 240); |
| 130 </if> | 130 </if> |
| 131 <if expr="is_android"> | 131 <if expr="is_android"> |
| 132 /* Android uses flat background colors. */ | 132 /* Android uses flat background colors. */ |
| 133 background-color: #ededed; | 133 background-color: #ededed; |
| 134 font-weight: bold; | 134 font-weight: bold; |
| 135 </if> | 135 </if> |
| 136 <if expr="not is_android and not pp_ifdef('ios')"> | 136 <if expr="not is_android and not is_ios"> |
| 137 /* Not done on mobile for performance reasons. */ | 137 /* Not done on mobile for performance reasons. */ |
| 138 box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08), inset 0 1px 2px rgba(255, 255, 255, 0
.75); | 138 box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08), inset 0 1px 2px rgba(255, 255, 255, 0
.75); |
| 139 </if> | 139 </if> |
| 140 } | 140 } |
| 141 | 141 |
| 142 button:hover { | 142 button:hover { |
| 143 border: 1px solid rgba(0, 0, 0, 0.3); | 143 border: 1px solid rgba(0, 0, 0, 0.3); |
| 144 color: #000; | 144 color: #000; |
| 145 <if expr="not is_android"> | 145 <if expr="not is_android"> |
| 146 background-image: -webkit-linear-gradient(#f0f0f0, #f0f0f0 38%, #e0e0e0); | 146 background-image: -webkit-linear-gradient(#f0f0f0, #f0f0f0 38%, #e0e0e0); |
| 147 </if> | 147 </if> |
| 148 <if expr="is_android"> | 148 <if expr="is_android"> |
| 149 background-color: #f0f0f0; | 149 background-color: #f0f0f0; |
| 150 </if> | 150 </if> |
| 151 <if expr="not is_android and not pp_ifdef('ios')"> | 151 <if expr="not is_android and not is_ios"> |
| 152 box-shadow: 0 1px 0 rgba(0, 0, 0, 0.12), inset 0 1px 2px rgba(255, 255, 255, 0
.95); | 152 box-shadow: 0 1px 0 rgba(0, 0, 0, 0.12), inset 0 1px 2px rgba(255, 255, 255, 0
.95); |
| 153 </if> | 153 </if> |
| 154 } | 154 } |
| 155 | 155 |
| 156 button:active { | 156 button:active { |
| 157 border: 1px solid rgba(0, 0, 0, 0.3); | 157 border: 1px solid rgba(0, 0, 0, 0.3); |
| 158 color: #444; | 158 color: #444; |
| 159 <if expr="not is_android"> | 159 <if expr="not is_android"> |
| 160 background-image: -webkit-linear-gradient(#e7e7e7, #e7e7e7 38%, #d7d7d7); | 160 background-image: -webkit-linear-gradient(#e7e7e7, #e7e7e7 38%, #d7d7d7); |
| 161 </if> | 161 </if> |
| 162 <if expr="is_android"> | 162 <if expr="is_android"> |
| 163 background-color: #e7e7e7; | 163 background-color: #e7e7e7; |
| 164 </if> | 164 </if> |
| 165 <if expr="not is_android and not pp_ifdef('ios')"> | 165 <if expr="not is_android and not is_ios"> |
| 166 box-shadow: none; | 166 box-shadow: none; |
| 167 </if> | 167 </if> |
| 168 } | 168 } |
| 169 | 169 |
| 170 #reload-button { | 170 #reload-button { |
| 171 color: #fff; | 171 color: #fff; |
| 172 <if expr="not is_android"> | 172 <if expr="not is_android"> |
| 173 background-image: -webkit-linear-gradient(#5d9aff, #5d9aff 38%, #5891f0); | 173 background-image: -webkit-linear-gradient(#5d9aff, #5d9aff 38%, #5891f0); |
| 174 border: 1px solid rgba(45, 102, 195, 1); | 174 border: 1px solid rgba(45, 102, 195, 1); |
| 175 text-shadow: 0 1px 0 rgba(0,0,0,0.5); | 175 text-shadow: 0 1px 0 rgba(0,0,0,0.5); |
| 176 </if> | 176 </if> |
| 177 <if expr="is_android"> | 177 <if expr="is_android"> |
| 178 background-color: rgb(39, 180, 231); | 178 background-color: rgb(39, 180, 231); |
| 179 border: 1px solid rgb(0, 152, 206); | 179 border: 1px solid rgb(0, 152, 206); |
| 180 </if> | 180 </if> |
| 181 <if expr="not is_android and not pp_ifdef('ios')"> | 181 <if expr="not is_android and not is_ios"> |
| 182 box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), inset 0 1px 2px rgba(255, 255, 255, 0
.2); | 182 box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), inset 0 1px 2px rgba(255, 255, 255, 0
.2); |
| 183 </if> | 183 </if> |
| 184 } | 184 } |
| 185 | 185 |
| 186 #reload-button:hover { | 186 #reload-button:hover { |
| 187 <if expr="not is_android"> | 187 <if expr="not is_android"> |
| 188 background-image: -webkit-linear-gradient(#659efd, #659efd 38%, #6097f1); | 188 background-image: -webkit-linear-gradient(#659efd, #659efd 38%, #6097f1); |
| 189 border: 1px solid rgba(45, 102, 195, 1); | 189 border: 1px solid rgba(45, 102, 195, 1); |
| 190 </if> | 190 </if> |
| 191 <if expr="not is_android and not pp_ifdef('ios')"> | 191 <if expr="not is_android and not is_ios"> |
| 192 box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25), inset 0 1px 2px rgba(255, 255, 255, 0
.2); | 192 box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25), inset 0 1px 2px rgba(255, 255, 255, 0
.2); |
| 193 </if> | 193 </if> |
| 194 } | 194 } |
| 195 | 195 |
| 196 #reload-button:active { | 196 #reload-button:active { |
| 197 <if expr="not is_android"> | 197 <if expr="not is_android"> |
| 198 background-image: -webkit-linear-gradient(#6095ed, #6095ed 38%, #6095ed); | 198 background-image: -webkit-linear-gradient(#6095ed, #6095ed 38%, #6095ed); |
| 199 border: 1px solid rgb(38, 84, 160); | 199 border: 1px solid rgb(38, 84, 160); |
| 200 </if> | 200 </if> |
| 201 <if expr="is_android"> | 201 <if expr="is_android"> |
| 202 background-color: rgb(0, 152, 206); | 202 background-color: rgb(0, 152, 206); |
| 203 </if> | 203 </if> |
| 204 <if expr="not is_android and not pp_ifdef('ios')"> | 204 <if expr="not is_android and not is_ios"> |
| 205 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1); | 205 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1); |
| 206 </if> | 206 </if> |
| 207 } | 207 } |
| 208 | 208 |
| 209 .hidden { | 209 .hidden { |
| 210 display: none; | 210 display: none; |
| 211 } | 211 } |
| 212 | 212 |
| 213 .suggestions { | 213 .suggestions { |
| 214 margin-top: 18px; | 214 margin-top: 18px; |
| (...skipping 115 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 330 // mechanisms (Currently just iOS). | 330 // mechanisms (Currently just iOS). |
| 331 if (window.top.location != window.location) | 331 if (window.top.location != window.location) |
| 332 document.documentElement.setAttribute('subframe', ''); | 332 document.documentElement.setAttribute('subframe', ''); |
| 333 | 333 |
| 334 function updateForDnsProbe(strings) { | 334 function updateForDnsProbe(strings) { |
| 335 var context = new JsEvalContext(strings); | 335 var context = new JsEvalContext(strings); |
| 336 jstProcess(context, document.getElementById('help-box-outer')); | 336 jstProcess(context, document.getElementById('help-box-outer')); |
| 337 jstProcess(context, document.getElementById('details')); | 337 jstProcess(context, document.getElementById('details')); |
| 338 } | 338 } |
| 339 | 339 |
| 340 <if expr="is_macosx or is_linux or is_android"> | 340 <if expr="is_macosx or is_ios or is_linux or is_android"> |
| 341 //Re-orders buttons. Used on Mac, Linux, and Android, where reload should go on
the right. | 341 //Re-orders buttons. Used on Mac, Linux, and Android, where reload should go on
the right. |
| 342 function swapButtonOrder() { | 342 function swapButtonOrder() { |
| 343 reloadButton = document.getElementById('reload-button'); | 343 reloadButton = document.getElementById('reload-button'); |
| 344 moreLessButton = document.getElementById('more-less-button'); | 344 moreLessButton = document.getElementById('more-less-button'); |
| 345 reloadButton.parentNode.insertBefore(moreLessButton, reloadButton); | 345 reloadButton.parentNode.insertBefore(moreLessButton, reloadButton); |
| 346 } | 346 } |
| 347 document.addEventListener("DOMContentLoaded", swapButtonOrder); | 347 document.addEventListener("DOMContentLoaded", swapButtonOrder); |
| 348 </if> | 348 </if> |
| 349 | 349 |
| 350 </script> | 350 </script> |
| (...skipping 31 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 382 </div> | 382 </div> |
| 383 </div> | 383 </div> |
| 384 <div id="sub-frame-error"> | 384 <div id="sub-frame-error"> |
| 385 <!-- Show details when hovering over the icon, in case the details are | 385 <!-- Show details when hovering over the icon, in case the details are |
| 386 hidden because they're too large. --> | 386 hidden because they're too large. --> |
| 387 <img class="icon" jseval="this.classList.add(iconClass)" jsvalues=".title:erro
rDetails"> | 387 <img class="icon" jseval="this.classList.add(iconClass)" jsvalues=".title:erro
rDetails"> |
| 388 <div id="sub-frame-error-details" jsvalues=".innerHTML:errorDetails"></div> | 388 <div id="sub-frame-error-details" jsvalues=".innerHTML:errorDetails"></div> |
| 389 </div> | 389 </div> |
| 390 </body> | 390 </body> |
| 391 </html> | 391 </html> |
| OLD | NEW |