| | 1 | <?xml version="1.0" encoding="UTF-16"?> |
| | 2 | <html><head> |
| | 3 | <title>Storage</title> |
| | 4 | <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0"/> |
| | 5 | <link rel="stylesheet" type="text/css" href="menes/style.css"/> |
| | 6 | <script type="text/javascript" src="menes/menes.js"></script> |
| | 7 | <script type="text/javascript" src="storage.js"></script> |
| | 8 | <base target="_blank"/> |
| | 9 | |
| | 10 | <style> |
| | 11 | body { |
| | 12 | display: table; |
| | 13 | font-family: Helvetica; |
| | 14 | height: 337px; |
| | 15 | margin: 0; |
| | 16 | padding: 0; |
| | 17 | -webkit-text-size-adjust: none; |
| | 18 | -webkit-user-select: none; |
| | 19 | } |
| | 20 | |
| | 21 | div.page { |
| | 22 | display: table-cell; |
| | 23 | text-align: center; |
| | 24 | margin: 0 auto; |
| | 25 | vertical-align: middle; |
| | 26 | width: 320px; |
| | 27 | } |
| | 28 | |
| | 29 | a.giant-button { |
| | 30 | color: #193250; |
| | 31 | display: block; |
| | 32 | margin: 8px 10px; |
| | 33 | text-decoration: none; |
| | 34 | } |
| | 35 | |
| | 36 | a.giant-button > div.contents { |
| | 37 | position: absolute; |
| | 38 | text-align: left; |
| | 39 | width: 300px; |
| | 40 | -webkit-background-size: 75px auto; |
| | 41 | z-index: 2; |
| | 42 | } |
| | 43 | |
| | 44 | a.giant-button > div.contents > piechart { |
| | 45 | float: left; |
| | 46 | margin: 10px; |
| | 47 | vertical-align: middle; |
| | 48 | } |
| | 49 | |
| | 50 | a.giant-button > div.contents > label { |
| | 51 | display: block; |
| | 52 | float: left; |
| | 53 | font-size: 25px; |
| | 54 | margin: 10px 0 4px 4px; |
| | 55 | text-align: center; |
| | 56 | text-shadow: rgba(200, 200, 200, 0.75) 1px 1px 0; |
| | 57 | width: 155px; |
| | 58 | } |
| | 59 | |
| | 60 | a.giant-button > div.contents > div.text { |
| | 61 | display: block; |
| | 62 | float: left; |
| | 63 | font-size: 14px; |
| | 64 | margin-left: 4px; |
| | 65 | text-align: center; |
| | 66 | width: 155px; |
| | 67 | } |
| | 68 | |
| | 69 | div.key { |
| | 70 | display: inline-block; |
| | 71 | width: 50%; |
| | 72 | } |
| | 73 | |
| | 74 | a.giant-button > div.contents > div.legend { |
| | 75 | float: left; |
| | 76 | font-size: 14px; |
| | 77 | left: 15px; |
| | 78 | position: absolute; |
| | 79 | top: 120px; |
| | 80 | width: 290px; |
| | 81 | } |
| | 82 | |
| | 83 | a.giant-button > div.background { |
| | 84 | background-color: #000000; |
| | 85 | opacity: 0.15; |
| | 86 | -webkit-border-radius: 10px; |
| | 87 | } |
| | 88 | |
| | 89 | div.key { |
| | 90 | margin-bottom: 4px; |
| | 91 | } |
| | 92 | |
| | 93 | piechart { |
| | 94 | /*-webkit-transform: rotate(-5deg);*/ |
| | 95 | /*-webkit-transform: rotateY(15deg) rotateX(-45deg);*/ |
| | 96 | } |
| | 97 | |
| | 98 | piechart > div { |
| | 99 | height: 100px; |
| | 100 | padding: 1px; |
| | 101 | position: relative; |
| | 102 | width: 103px; |
| | 103 | } |
| | 104 | |
| | 105 | piechart > div > div.lslice, |
| | 106 | piechart > div > div.rslice { |
| | 107 | background-color: #4d4d70; |
| | 108 | height: 100px; |
| | 109 | position: absolute; |
| | 110 | } |
| | 111 | |
| | 112 | piechart > div > div.lslice { |
| | 113 | -webkit-border-bottom-left-radius: 50px; |
| | 114 | -webkit-border-top-left-radius: 50px; |
| | 115 | width: 50px; |
| | 116 | z-index: 2; |
| | 117 | } |
| | 118 | |
| | 119 | piechart > div > div.rslice { |
| | 120 | -webkit-border-bottom-right-radius: 50px; |
| | 121 | -webkit-border-top-right-radius: 50px; |
| | 122 | left: 49px; |
| | 123 | width: 53px; |
| | 124 | z-index: 0; |
| | 125 | } |
| | 126 | |
| | 127 | piechart > div > div.xslice { |
| | 128 | -webkit-border-bottom-left-radius: 50px; |
| | 129 | -webkit-border-top-left-radius: 50px; |
| | 130 | height: 100px; |
| | 131 | left: 2px; |
| | 132 | position: absolute; |
| | 133 | -webkit-transform-origin: 50px 50%; |
| | 134 | width: 50px; |
| | 135 | } |
| | 136 | |
| | 137 | piechart > div > div.tslice { |
| | 138 | position: absolute; |
| | 139 | text-align: center; |
| | 140 | top: 42px; |
| | 141 | width: 100px; |
| | 142 | z-index: 3; |
| | 143 | } |
| | 144 | |
| | 145 | piechart > div > div.tslice > div { |
| | 146 | background-color: rgba(255, 255, 255, 0.7); |
| | 147 | -webkit-border-radius: 7px; |
| | 148 | display: inline; |
| | 149 | color: black; |
| | 150 | font-size: 15px; |
| | 151 | font-weight: bold; |
| | 152 | margin: 0 auto; |
| | 153 | padding: 2px 4px; |
| | 154 | text-align: center; |
| | 155 | } |
| | 156 | |
| | 157 | div.color { |
| | 158 | background-color: black; |
| | 159 | border: 1px solid #4d4d70; |
| | 160 | display: inline-block; |
| | 161 | vertical-align: middle; |
| | 162 | } |
| | 163 | |
| | 164 | div.color > div { |
| | 165 | border: 1px solid white; |
| | 166 | display: inline-block; |
| | 167 | height: 12px; |
| | 168 | width: 12px; |
| | 169 | } |
| | 170 | |
| | 171 | div.name { |
| | 172 | display: inline-block; |
| | 173 | font-size: 14px; |
| | 174 | margin-left: 5px; |
| | 175 | vertical-align: middle; |
| | 176 | } |
| | 177 | </style> |
| | 178 | </head><body class="pinstripe"> |
| | 179 | <dialog> |
| | 180 | <panel> |
| | 181 | |
| | 182 | <a class="giant-button"> |
| | 183 | <div class="contents"> |
| | 184 | <piechart id="system-chart"><div> |
| | 185 | <div class="lslice"></div> |
| | 186 | <div class="rslice"></div> |
| | 187 | <div class="tslice"><div id="system-size"></div></div> |
| | 188 | <div class="xslice" id="system-slice" style=" |
| | 189 | background-color: #7d7da0; -webkit-transform: rotate(10deg); z-index: 1; |
| | 190 | "></div> |
| | 191 | </div></piechart> |
| | 192 | |
| | 193 | <label>System</label> |
| | 194 | <div class="text">A small partition used to store iPhone OS. Cydia adds a few important programs and libraries.</div> |
| | 195 | |
| | 196 | <div class="legend" id="system-legend"></div> |
| | 197 | </div> |
| | 198 | |
| | 199 | <div class="background" style="height: 149px"></div> |
| | 200 | </a> |
| | 201 | |
| | 202 | <a class="giant-button"> |
| | 203 | <div class="contents"> |
| | 204 | <piechart id="private-chart"><div> |
| | 205 | <div class="lslice"></div> |
| | 206 | <div class="rslice"></div> |
| | 207 | <div class="tslice"><div id="private-size"></div></div> |
| | 208 | <div class="xslice" id="private-slice" style=" |
| | 209 | background-color: #9090e0; -webkit-transform: rotate(150deg); z-index: 1; |
| | 210 | "></div> |
| | 211 | <div class="xslice" id="private-slice" style=" |
| | 212 | background-color: #7070e0; -webkit-transform: rotate(120deg); z-index: 1; |
| | 213 | "></div> |
| | 214 | <div class="xslice" id="private-slice" style=" |
| | 215 | background-color: #d0d0f0; -webkit-transform: rotate(90deg); z-index: 1; |
| | 216 | "></div> |
| | 217 | <div class="xslice" id="private-slice" style=" |
| | 218 | background-color: #7da0e0; -webkit-transform: rotate(60deg); z-index: 1; |
| | 219 | "></div> |
| | 220 | <div class="xslice" id="private-slice" style=" |
| | 221 | background-color: #7d7da0; -webkit-transform: rotate(30deg); z-index: 1; |
| | 222 | "></div> |
| | 223 | </div></piechart> |
| | 224 | |
| | 225 | <label>Private</label> |
| | 226 | <div class="text">Most content is stored on this partition: from applications (Cydia and Apple) to multimedia.</div> |
| | 227 | |
| | 228 | <div class="legend" id="private-legend"></div> |
| | 229 | </div> |
| | 230 | |
| | 231 | <div class="background" style="height: 189px"></div> |
| | 232 | </a> |
| | 233 | |
| | 234 | </panel> |
| | 235 | </dialog> |
| | 236 | </body></html> |
projects / cydia.git / blame_incremental