| OLD | NEW |
| (Empty) |
| 1 <!DOCTYPE html> | |
| 2 <html i18n-values="dir:textdirection;"> | |
| 3 <head> | |
| 4 <meta http-equiv="Content-Type" content="text/html" charset="UTF-8"></meta> | |
| 5 <title i18n-content="title"></title> | |
| 6 <style> | |
| 7 html, body, ul, li { | |
| 8 margin: 0; | |
| 9 padding: 0; | |
| 10 } | |
| 11 | |
| 12 body, html { | |
| 13 height: 100%; | |
| 14 } | |
| 15 | |
| 16 a { | |
| 17 text-decoration: none; | |
| 18 color: #0066cc; | |
| 19 } | |
| 20 | |
| 21 button { | |
| 22 min-width: 80px; | |
| 23 -webkit-margin-start: 15px; | |
| 24 } | |
| 25 | |
| 26 h1 { | |
| 27 margin-top: 0; | |
| 28 font-size: 15pt; | |
| 29 } | |
| 30 | |
| 31 h2 { | |
| 32 margin-top: 0; | |
| 33 font-size: 13pt; | |
| 34 } | |
| 35 | |
| 36 header { | |
| 37 background-color: rgb(242, 247, 250); | |
| 38 border-bottom: 1px solid rgb(218, 236, 248); | |
| 39 padding: 50px; | |
| 40 -webkit-padding-start: 120px; | |
| 41 } | |
| 42 | |
| 43 header p { | |
| 44 width: 800px; | |
| 45 margin-bottom: 0; | |
| 46 } | |
| 47 | |
| 48 input { | |
| 49 margin-top: 7px; | |
| 50 margin-bottom: 7px; | |
| 51 } | |
| 52 | |
| 53 li { | |
| 54 margin-bottom: 8px; | |
| 55 list-style: none; | |
| 56 } | |
| 57 | |
| 58 p { | |
| 59 margin-top: 0; | |
| 60 } | |
| 61 | |
| 62 progress { | |
| 63 width: 371px; | |
| 64 margin-bottom: 0; | |
| 65 } | |
| 66 | |
| 67 ul { | |
| 68 webkit-margin-after: 25px; | |
| 69 webkit-margin-before: 0; | |
| 70 } | |
| 71 | |
| 72 .aligned-to-start { | |
| 73 -webkit-padding-start: 120px; | |
| 74 } | |
| 75 | |
| 76 .float-start { | |
| 77 float: left; | |
| 78 } | |
| 79 | |
| 80 html[dir='rtl'] .float-start { | |
| 81 float-right; | |
| 82 } | |
| 83 | |
| 84 .float-stop { | |
| 85 clear: both; | |
| 86 } | |
| 87 | |
| 88 .default-text { | |
| 89 font-family: 'Chrome Droid Sans', 'Droid Sans Fallback', sans-serif; | |
| 90 margin-bottom: 0; | |
| 91 } | |
| 92 | |
| 93 .normal-text { | |
| 94 font-size: 15; | |
| 95 } | |
| 96 | |
| 97 .progress-text { | |
| 98 color: #666; | |
| 99 margin-bottom: 2px; | |
| 100 margin-top: 2px; | |
| 101 } | |
| 102 | |
| 103 .select-option { | |
| 104 margin-top: 5px; | |
| 105 } | |
| 106 | |
| 107 .new-line { | |
| 108 clear: both; | |
| 109 } | |
| 110 | |
| 111 #main-content { | |
| 112 background-image: -webkit-linear-gradient(#FFFFFF, #EFF5FF); | |
| 113 padding: 35px; | |
| 114 -webkit-padding-start: 120px; | |
| 115 position: absolute; | |
| 116 left: 0; | |
| 117 right: 0; | |
| 118 bottom: 0; | |
| 119 top: 195px; | |
| 120 } | |
| 121 | |
| 122 #status-icon { | |
| 123 position: absolute; | |
| 124 left: 32px; | |
| 125 right: 37px; | |
| 126 width: 64px; | |
| 127 height: 64px; | |
| 128 display: none; | |
| 129 } | |
| 130 | |
| 131 #main-content.device-detected-none #status-icon { | |
| 132 background: url('shared/images/insert.png'); | |
| 133 background-repeat: no-repeat; | |
| 134 display: block; | |
| 135 } | |
| 136 | |
| 137 #main-content.device-detected-usb #status-icon { | |
| 138 background: url('shared/images/detected_usb.png'); | |
| 139 background-repeat: no-repeat; | |
| 140 display: block; | |
| 141 } | |
| 142 | |
| 143 #main-content.device-detected-sd #status-icon { | |
| 144 background: url('shared/images/detected_sd.png'); | |
| 145 background-repeat: no-repeat; | |
| 146 display: block; | |
| 147 } | |
| 148 | |
| 149 #progress-status-div { | |
| 150 display: none; | |
| 151 } | |
| 152 | |
| 153 #main-content.progress #progress-status-div { | |
| 154 display: block; | |
| 155 } | |
| 156 | |
| 157 #cancel-button { | |
| 158 display: none; | |
| 159 margin-top: -4px; | |
| 160 margin-bottom: 0; | |
| 161 } | |
| 162 | |
| 163 #main-content.progress-canceble #cancel-button { | |
| 164 display: block; | |
| 165 } | |
| 166 | |
| 167 #pending-time { | |
| 168 clear:both | |
| 169 } | |
| 170 | |
| 171 #device-selection { | |
| 172 display: none; | |
| 173 } | |
| 174 | |
| 175 #main-content.device-detected-mul #device-selection { | |
| 176 display: block; | |
| 177 } | |
| 178 | |
| 179 #warning-icon{ | |
| 180 width:25px; | |
| 181 height:26px; | |
| 182 -webkit-margin-end: 10px; | |
| 183 display: none; | |
| 184 } | |
| 185 | |
| 186 #main-content.warning #warning-icon, #main-content.error #warning-icon { | |
| 187 background:url('shared/images/icon_warning.png'); | |
| 188 background-repeat:no-repeat; | |
| 189 display: block; | |
| 190 } | |
| 191 | |
| 192 #main-content.success #warning-icon { | |
| 193 background:url('shared/images/icon_checkmark.png'); | |
| 194 background-repeat:no-repeat; | |
| 195 display: block; | |
| 196 } | |
| 197 | |
| 198 #warning-div { | |
| 199 display:block; | |
| 200 } | |
| 201 | |
| 202 #main-content.progress #warning-div { | |
| 203 display: none; | |
| 204 } | |
| 205 | |
| 206 #warning-text { | |
| 207 max-width: 550px; | |
| 208 padding-top: 4px; | |
| 209 } | |
| 210 | |
| 211 #main-content.success #warning-button, | |
| 212 #main-content.warning-no-conf #warning-button, | |
| 213 #main-content.device-detected-none #warning-button { | |
| 214 display: none; | |
| 215 } | |
| 216 | |
| 217 #main-content.error #warning-button { | |
| 218 clear: both; | |
| 219 } | |
| 220 </style> | |
| 221 <script src="chrome://resources/js/util.js"></script> | |
| 222 <script src="chrome://resources/js/local_strings.js"></script> | |
| 223 <script src="chrome://imageburner/strings.js"></script> | |
| 224 <script src="chrome://imageburner/image_burner.js"></script> | |
| 225 </head> | |
| 226 <body class="default-text"> | |
| 227 <header id="burn-header"> | |
| 228 <h1 i18n-content="headerTitle"></h1> | |
| 229 <p i18n-content="headerDescription"></p> | |
| 230 <a id="more-info-link" jsvalues="href:moreInfoLink" | |
| 231 i18n-content="headerLink"></a> | |
| 232 </header> | |
| 233 <div id="main-content"> | |
| 234 <div id="status-icon"></div> | |
| 235 <div id="status-info"> | |
| 236 <h2 id="status-text" class="status-text"></h2> | |
| 237 <div id="progress-status-div"> | |
| 238 <p id="progress-text" class="progress-text"></p> | |
| 239 <div id="progress-status" class="float-start"> | |
| 240 <progress id="progress-div" class="float-start"></progress> | |
| 241 <button id="cancel-button" class="float-start" | |
| 242 i18n-content="cancelButton"> | |
| 243 </button> | |
| 244 </div> | |
| 245 <p id="pending-time" class="progress-text"></p> | |
| 246 </div> | |
| 247 <ul id="device-selection"></ul> | |
| 248 <div id="warning-div"> | |
| 249 <div id="warning-icon" class="float-start"></div> | |
| 250 <p id="warning-text" class="float-start"></p> | |
| 251 <button id="warning-button" class="float-start"></button> | |
| 252 </div> | |
| 253 <div class="new-line"></div> | |
| 254 </div> | |
| 255 <div id="burn-footer"></div> | |
| 256 </div> | |
| 257 <script src="chrome://resources/js/i18n_template.js"></script> | |
| 258 <script src="chrome://resources/js/i18n_process.js"></script> | |
| 259 <script src="chrome://resources/js/jstemplate_compiled.js"></script> | |
| 260 </body> | |
| 261 </html> | |
| OLD | NEW |