Chromium Code Reviews Chromium Code Reviews
Issue 9284010:
minimal cleanup of ssl error page (Closed)
Base URL: svn://svn.chromium.org/chrome/trunk/src| 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 <title i18n-content="title"></title> | 4 <title i18n-content="title"></title> |
| 5 <style type="text/css"> | 5 <style type="text/css"> |
| 6 | |
| 7 html { | |
| 8 background-color: rgb(92, 0, 0); | |
| 9 background-image: url("ssl_roadblock_background.png"); | |
| 10 background-repeat: repeat-x; | |
| 11 height: 100%; | |
| 12 } | |
| 13 | |
| 6 body { | 14 body { |
| 7 background-color:#500; | 15 font-family: Helvetica, Arial, sans-serif; |
| 8 font-family:Helvetica,Arial,sans-serif; | 16 margin: 0; |
| 9 margin:0px; | |
| 10 } | 17 } |
| 11 .background { | 18 |
| 12 position:absolute; | 19 .cell { |
| 13 width:100%; | 20 padding: 40px; |
| 14 height:100%; | |
| 15 } | 21 } |
| 16 .cell { | 22 |
| 17 padding:40px; | 23 .box { |
| 24 -webkit-box-shadow: 3px 3px 8px #200; | |
| 25 background-color: white; | |
| 26 border-radius: 5px; | |
| 27 color: black; | |
| 28 font-size: 10pt; | |
| 29 line-height: 16pt; | |
| 30 min-width: 500px; | |
| 31 max-width: 800px; | |
| 32 padding: 20px; | |
| 33 position: relative; | |
| 34 text-align: start; | |
| 35 width: 80%; | |
| 18 } | 36 } |
| 19 .box { | 37 |
| 20 width:80%; | 38 #twisty_closed { |
| 21 background-color:white; | 39 display: inline; |
| 22 color:black; | |
| 23 font-size:10pt; | |
| 24 line-height:16pt; | |
| 25 text-align:left; | |
| 26 padding:20px; | |
| 27 position:relative; | |
| 28 -webkit-box-shadow:3px 3px 8px #200; | |
| 29 border-radius:5px; | |
| 30 } | 40 } |
| 31 html[dir='rtl'] .box { | 41 |
| 32 text-align:right; | 42 html[dir='rtl'] #twisty_closed { |
| 43 -webkit-transform: scaleX(-1); | |
|
Dan Beam
2012/01/24 19:49:13
!>>>(^o^)<<<!
Dan Beam
2012/01/24 20:22:29
Oh, sorry, thought this was scale(-1), ignore that
| |
| 33 } | 44 } |
| 34 | 45 |
| 35 .icon { | 46 .icon { |
| 36 position:absolute; | 47 position:absolute; |
| 37 } | 48 } |
| 49 | |
| 38 .title { | 50 .title { |
| 39 margin: 0px 77px 0px; | 51 color: #660000; |
| 40 font-size:18pt; | 52 font-size: 18pt; |
| 53 font-weight: bold; | |
| 41 line-height: 140%; | 54 line-height: 140%; |
| 42 margin-bottom:6pt; | 55 margin: 0 77px 6pt; |
| 43 font-weight:bold; | |
| 44 color:#660000; | |
| 45 } | |
| 46 .main { | |
| 47 margin:0px 80px 0px; | |
| 48 } | 56 } |
| 49 | 57 |
| 50 .submission { | 58 .main { |
| 51 margin:15px 5px 15px 0px; | 59 margin: 1em 80px; |
| 52 padding:0px; | |
| 53 } | 60 } |
| 54 input { | 61 |
| 55 margin:0px; | 62 .example { |
| 63 border-top: 1px solid #ccc; | |
| 64 margin: 0 80px; | |
| 65 padding-top: 6px; | |
| 56 } | 66 } |
| 57 .proceedbutton { | 67 |
| 68 .moreinfotitle { | |
| 69 margin-left: 5px; | |
| 70 margin-right: 5px; | |
| 58 } | 71 } |
| 59 .helpbutton { | 72 |
| 60 float:right; | |
| 61 } | |
| 62 .example { | |
| 63 margin:30px 80px 0px; | |
| 64 border-top:1px solid #ccc; | |
| 65 padding-top:6px; | |
| 66 } | |
| 67 .moreinfotitle { | |
| 68 margin-left:5px; | |
| 69 margin-right:5px; | |
| 70 } | |
| 71 </style> | 73 </style> |
| 72 | 74 |
| 73 <script> | 75 <script> |
| 74 function $(o) {return document.getElementById(o);} | 76 function $(o) {return document.getElementById(o);} |
| 75 | 77 |
| 76 function sendCommand(cmd) { | 78 function sendCommand(cmd) { |
| 77 window.domAutomationController.setAutomationId(1); | 79 window.domAutomationController.setAutomationId(1); |
| 78 window.domAutomationController.send(cmd); | 80 window.domAutomationController.send(cmd); |
| 79 } | 81 } |
| 80 | 82 |
| 81 function toggleMoreInfo(collapse) { | 83 function toggleMoreInfo(collapse) { |
| 82 if (collapse) { | 84 $('more_info_long').hidden = collapse; |
| 83 $("more_info_long").style.display = "none"; | 85 $('more_info_short').hidden = !collapse; |
| 84 $("more_info_short").style.display = "block"; | |
| 85 } else { | |
| 86 $("more_info_long").style.display = "block"; | |
| 87 $("more_info_short").style.display = "none"; | |
| 88 } | |
| 89 } | |
| 90 function setDirectionSensitiveImages() { | |
| 91 if (document.documentElement.dir == 'rtl') { | |
| 92 $("twisty_closed_rtl").style.display = "inline"; | |
| 93 } else { | |
| 94 $("twisty_closed").style.display = "inline"; | |
| 95 } | |
| 96 } | 86 } |
| 97 </script> | 87 </script> |
| 98 </head> | 88 </head> |
| 99 <body oncontextmenu="return false;"> | 89 <body oncontextmenu="return false;"> |
| 100 <script> | |
| 101 document.addEventListener('DOMContentLoaded', setDirectionSensitiveImages); | |
| 102 </script> | |
| 103 <div class="background"><img src="ssl_roadblock_background.png" width="100%" hei ght="100%" alt="background" onmousedown="return false;"></div> | |
| 104 <table width="100%" cellspacing="0" cellpadding="0"> | 90 <table width="100%" cellspacing="0" cellpadding="0"> |
| 105 <td class="cell" valign="middle" align="center"> | 91 <td class="cell" valign="middle" align="center"> |
| 106 <div class="box"> | 92 <div class="box"> |
| 107 <div class="icon"><img src="ssl_roadblock_icon.png" alt="SSL Error Icon" o nmousedown="return false;"></div> | 93 <div class="icon"><img src="ssl_roadblock_icon.png" alt="SSL Error Icon" |
| 94 onmousedown="return false;"></div> | |
| 108 <div class="title" i18n-content="headLine"></div> | 95 <div class="title" i18n-content="headLine"></div> |
| 109 <div class="main" i18n-values=".innerHTML:description"></div> | 96 <div class="main" i18n-values=".innerHTML:description;dir:textdirection">< /div> |
| 110 <div class="main" i18n-values=".innerHTML:shouldNotProceed"></div> | 97 <div class="main" i18n-values=".innerHTML:shouldNotProceed"></div> |
| 111 <div class="main"> | 98 <div class="main"> |
| 112 <form class="submission"> | 99 <button i18n-content="proceed" onclick="sendCommand(1);"> |
|
Dan Beam
2012/01/24 19:49:13
inline handler make me sad, :(
| |
| 113 <input type="button" i18n-values="value:proceed" name="proceed" class= "proceedbutton" onClick="sendCommand(1);"> | 100 </button> |
| 114 <input type="button" i18n-values="value:exit" name="exit" onClick="sen dCommand(0);"> | 101 <button i18n-content="exit" onclick="sendCommand(0);"> |
| 115 </form> | 102 </button> |
| 116 </div> | 103 </div> |
| 117 <div class="example" id="more_info_short"> | 104 <div class="example" id="more_info_short"> |
| 118 <!-- | 105 <a href="#" onclick="toggleMoreInfo(false); return false;" |
| 119 // The img madness here is due to the inlining of the html file | 106 onmousedown="return false;"> |
| 120 // resources. The script that does this looks for subresources like | 107 <img id="twisty_closed" src="twisty_closed.png" border="0"><span i18 n-content="moreInfoTitle" class="moreinfotitle"></span> |
|
Dan Beam
2012/01/24 19:49:13
[border="0"] makes me sad, too, :(
| |
| 121 // images and inlines them, so we need to have references to both the | 108 </a> |
| 122 // ltr and rtl versions statically. Just doing | |
| 123 // i18n-values="src:path_to_correct_image_set_by_c++" won't work, since | |
| 124 // the inlined version will just end up with that path string rather | |
| 125 // than the inlined image. | |
| 126 --> | |
| 127 <a href="#" onclick="toggleMoreInfo(false); return false;" onmousedown=" return false;"><img id="twisty_closed" src="twisty_closed.png" border="0" style= "display:none"><img id="twisty_closed_rtl" src="twisty_closed_rtl.png" border="0 " style="display:none"><span i18n-content="moreInfoTitle" class="moreinfotitle"> </span></a> | |
| 128 </div> | 109 </div> |
| 129 <div class="example" id="more_info_long" style="display:none;"> | 110 <div class="example" id="more_info_long" hidden> |
| 130 <a href="#" onclick="toggleMoreInfo(true); return false;" onmousedown="r eturn false;"><img src="twisty_open.png" border="0"><span i18n-content="moreInfo Title" class="moreinfotitle"></span></a> | 111 <a href="#" onclick="toggleMoreInfo(true); return false;" |
| 112 onmousedown="return false;"> | |
| 113 <img src="twisty_open.png" border="0"><span i18n-content="moreInfoTi tle" class="moreinfotitle"></span> | |
| 114 </a> | |
| 131 <p i18n-values=".innerHTML:moreInfo1"></p> | 115 <p i18n-values=".innerHTML:moreInfo1"></p> |
| 132 <p i18n-values=".innerHTML:moreInfo2"></p> | 116 <p i18n-values=".innerHTML:moreInfo2"></p> |
| 133 <p i18n-values=".innerHTML:moreInfo3"></p> | 117 <p i18n-values=".innerHTML:moreInfo3"></p> |
| 134 <p i18n-values=".innerHTML:moreInfo4"></p> | 118 <p i18n-values=".innerHTML:moreInfo4"></p> |
| 135 <p i18n-values=".innerHTML:moreInfo5"></p> | 119 <p i18n-values=".innerHTML:moreInfo5"></p> |
| 136 </div> | 120 </div> |
| 137 </td> | 121 </td> |
| 138 </table> | 122 </table> |
| 139 </body> | 123 </body> |
| 140 </html> | 124 </html> |
| OLD | NEW |
