Mercurial > laserkard
annotate css/old_sexy.css @ 103:52297178e0eb laserkard
implemented automatic text resize
author | Robert McIntyre <rlm@mit.edu> |
---|---|
date | Wed, 28 Jul 2010 06:36:39 -0400 |
parents | 4ebd94bfecda |
children |
rev | line source |
---|---|
rlm@78 | 1 |
rlm@78 | 2 div#trifold |
rlm@78 | 3 { |
rlm@78 | 4 position:relative; |
rlm@78 | 5 width:505; |
rlm@78 | 6 background-color:#000000; |
rlm@78 | 7 margin-bottom:120px; |
rlm@78 | 8 margin-top:25px; |
rlm@78 | 9 font: bold 25px "helvetica","arial", "sans-serif"; |
rlm@78 | 10 color: white; |
rlm@78 | 11 |
rlm@78 | 12 |
rlm@78 | 13 } |
rlm@78 | 14 |
rlm@78 | 15 |
rlm@78 | 16 div#trileft |
rlm@78 | 17 { |
rlm@78 | 18 |
rlm@78 | 19 position:absolute; |
rlm@78 | 20 top:0; |
rlm@78 | 21 left:0%; |
rlm@78 | 22 width:45%; |
rlm@78 | 23 |
rlm@78 | 24 |
rlm@78 | 25 padding:5px; |
rlm@78 | 26 border-style:solid; |
rlm@78 | 27 border-color:#ffffff; |
rlm@78 | 28 border-width:1px; |
rlm@78 | 29 |
rlm@78 | 30 |
rlm@78 | 31 |
rlm@78 | 32 } |
rlm@78 | 33 |
rlm@78 | 34 div.texttext |
rlm@78 | 35 { |
rlm@78 | 36 padding-top: 12px; |
rlm@78 | 37 } |
rlm@78 | 38 |
rlm@78 | 39 |
rlm@78 | 40 div#triright |
rlm@78 | 41 { |
rlm@78 | 42 position:absolute; |
rlm@78 | 43 |
rlm@78 | 44 top:0; |
rlm@78 | 45 left:52.5%; |
rlm@78 | 46 width:45%; |
rlm@78 | 47 padding:5px; |
rlm@78 | 48 border-style:solid; |
rlm@78 | 49 border-color:#ffffff; |
rlm@78 | 50 border-width:1px; |
rlm@78 | 51 padding-left:15px; |
rlm@78 | 52 } |
rlm@78 | 53 |
rlm@78 | 54 |
rlm@78 | 55 div#wtf |
rlm@78 | 56 { |
rlm@78 | 57 padding:5px; |
rlm@78 | 58 border-style:solid; |
rlm@78 | 59 border-color:#79797b; |
rlm@78 | 60 border-width:1px; |
rlm@78 | 61 } |
rlm@78 | 62 |
rlm@78 | 63 |
rlm@78 | 64 div#arrowleft |
rlm@78 | 65 { |
rlm@78 | 66 float:left; |
rlm@78 | 67 margin:7px; |
rlm@78 | 68 margin-right:15px; |
rlm@78 | 69 } |
rlm@78 | 70 |
rlm@78 | 71 div#arrowright |
rlm@78 | 72 { |
rlm@78 | 73 float:right; |
rlm@78 | 74 margin:7px; |
rlm@78 | 75 } |
rlm@78 | 76 |
rlm@78 | 77 h1 |
rlm@78 | 78 { |
rlm@78 | 79 |
rlm@78 | 80 color: white; |
rlm@78 | 81 background-color:#000000; |
rlm@78 | 82 text-align: center; |
rlm@78 | 83 font: bold 32px "arial", "sans-serif"; |
rlm@78 | 84 |
rlm@78 | 85 } |
rlm@78 | 86 |
rlm@78 | 87 div#whole |
rlm@78 | 88 { |
rlm@78 | 89 width: 1100px ; |
rlm@78 | 90 margin-top:25px; |
rlm@78 | 91 margin-left: auto ; |
rlm@78 | 92 margin-right: auto ; |
rlm@78 | 93 |
rlm@78 | 94 /* |
rlm@78 | 95 padding:2px; |
rlm@78 | 96 border-style:solid; |
rlm@78 | 97 border-color:#79797b; |
rlm@78 | 98 border-width:1px; |
rlm@78 | 99 */ |
rlm@78 | 100 } |
rlm@78 | 101 |
rlm@78 | 102 |
rlm@78 | 103 |
rlm@78 | 104 div#i_materials |
rlm@78 | 105 { |
rlm@78 | 106 |
rlm@78 | 107 display: none; |
rlm@78 | 108 padding:5px; |
rlm@78 | 109 border-style:solid; |
rlm@78 | 110 border-color:#79797b; |
rlm@78 | 111 border-width:1px; |
rlm@78 | 112 |
rlm@78 | 113 width:auto; |
rlm@78 | 114 float:left; |
rlm@78 | 115 |
rlm@78 | 116 /*position:absolute; |
rlm@78 | 117 left:15px; |
rlm@78 | 118 top:80px;*/ |
rlm@78 | 119 background-color:#000000; |
rlm@78 | 120 |
rlm@78 | 121 } |
rlm@78 | 122 |
rlm@78 | 123 |
rlm@78 | 124 div#templates |
rlm@78 | 125 { |
rlm@78 | 126 |
rlm@78 | 127 margin-bottom: 10px; |
rlm@78 | 128 } |
rlm@78 | 129 |
rlm@78 | 130 |
rlm@78 | 131 |
rlm@78 | 132 div#i_templates |
rlm@78 | 133 { |
rlm@78 | 134 |
rlm@78 | 135 color: white; |
rlm@78 | 136 background-color:#000000; |
rlm@78 | 137 text-align: left; |
rlm@78 | 138 font: bold 32px "arial", "sans-serif"; |
rlm@78 | 139 |
rlm@78 | 140 padding:10px; |
rlm@78 | 141 border-style:solid; |
rlm@78 | 142 border-color:#ffffff; |
rlm@78 | 143 border-width:1px; |
rlm@78 | 144 |
rlm@78 | 145 float: left; |
rlm@78 | 146 width: auto; |
rlm@78 | 147 |
rlm@78 | 148 |
rlm@78 | 149 |
rlm@78 | 150 /* |
rlm@78 | 151 position:absolute; |
rlm@78 | 152 left:15px; |
rlm@78 | 153 bottom:15px; |
rlm@78 | 154 */ |
rlm@78 | 155 |
rlm@78 | 156 } |
rlm@78 | 157 |
rlm@78 | 158 |
rlm@78 | 159 |
rlm@78 | 160 titletron |
rlm@78 | 161 { |
rlm@78 | 162 |
rlm@78 | 163 |
rlm@78 | 164 padding-bottom: 50px; |
rlm@78 | 165 color: white; |
rlm@78 | 166 background-color:#000000; |
rlm@78 | 167 text-align: left; |
rlm@78 | 168 font: bold 32px "arial", "sans-serif"; |
rlm@78 | 169 |
rlm@78 | 170 |
rlm@78 | 171 } |
rlm@78 | 172 |
rlm@78 | 173 |
rlm@78 | 174 div#centerbox |
rlm@78 | 175 { |
rlm@78 | 176 float:left; |
rlm@78 | 177 margin-top:-10px; |
rlm@78 | 178 margin-left:10px; |
rlm@78 | 179 margin-right:10px; |
rlm@78 | 180 width:515px; |
rlm@78 | 181 padding:5px; |
rlm@78 | 182 background-color:#000; |
rlm@78 | 183 /* |
rlm@78 | 184 border-style:solid; |
rlm@78 | 185 border-color:#79797b; |
rlm@78 | 186 border-width:1px; |
rlm@78 | 187 margin:10px; |
rlm@78 | 188 */ |
rlm@78 | 189 } |
rlm@78 | 190 |
rlm@78 | 191 |
rlm@78 | 192 div#disp_contain |
rlm@78 | 193 {position: relative;z-index:10;} |
rlm@78 | 194 |
rlm@78 | 195 div#display |
rlm@78 | 196 { |
rlm@78 | 197 position: absolute; |
rlm@78 | 198 top:60px; |
rlm@78 | 199 left:0px |
rlm@78 | 200 background-color:#00ff00; |
rlm@78 | 201 z-index: 5; |
rlm@78 | 202 } |
rlm@78 | 203 |
rlm@78 | 204 |
rlm@78 | 205 |
rlm@78 | 206 |
rlm@78 | 207 |
rlm@78 | 208 |
rlm@78 | 209 input#template1,input#template2,input#template3,input#template4, input#clear_acr, input#green_acr |
rlm@78 | 210 { |
rlm@78 | 211 padding:3px; |
rlm@78 | 212 /*#border-style:solid; |
rlm@78 | 213 #border-color:#79797b;*/ |
rlm@78 | 214 border-width:1px; |
rlm@78 | 215 } |
rlm@78 | 216 |
rlm@78 | 217 |
rlm@78 | 218 div#i_inputbox |
rlm@78 | 219 { |
rlm@78 | 220 |
rlm@78 | 221 padding-left:10px; |
rlm@78 | 222 padding-top:10px; |
rlm@78 | 223 padding-right:0px; |
rlm@78 | 224 border-style:solid; |
rlm@78 | 225 border-color:#ffffff; |
rlm@78 | 226 border-width:1px; |
rlm@78 | 227 padding-bottom:10px; |
rlm@78 | 228 |
rlm@78 | 229 font: bold 14px "helvetica","arial", "sans-serif"; |
rlm@78 | 230 color: white; |
rlm@78 | 231 |
rlm@78 | 232 float:left; |
rlm@78 | 233 width:240px; |
rlm@78 | 234 clear:right; |
rlm@78 | 235 |
rlm@78 | 236 /* |
rlm@78 | 237 position:absolute; |
rlm@78 | 238 left:1260px; |
rlm@78 | 239 top:80px; |
rlm@78 | 240 */ |
rlm@78 | 241 |
rlm@78 | 242 background-color:#000000; |
rlm@78 | 243 } |
rlm@78 | 244 |
rlm@78 | 245 |
rlm@78 | 246 |
rlm@78 | 247 |
rlm@78 | 248 |
rlm@78 | 249 div#pokedex |
rlm@78 | 250 { |
rlm@78 | 251 padding : 30px; |
rlm@78 | 252 clear:right; |
rlm@78 | 253 float:none; |
rlm@78 | 254 background-color:#000000; |
rlm@78 | 255 border-style:solid; |
rlm@78 | 256 border-color:#ffffff; |
rlm@78 | 257 border-width:1px; |
rlm@78 | 258 |
rlm@78 | 259 |
rlm@78 | 260 |
rlm@78 | 261 font: bold 16px "helvetica","arial", "sans-serif"; |
rlm@78 | 262 color: white; |
rlm@78 | 263 } |
rlm@78 | 264 |
rlm@78 | 265 div#garbage |
rlm@78 | 266 { |
rlm@78 | 267 |
rlm@78 | 268 float:left; |
rlm@78 | 269 width:1000px; |
rlm@78 | 270 |
rlm@78 | 271 } |
rlm@78 | 272 |
rlm@78 | 273 |
rlm@78 | 274 |
rlm@78 | 275 |
rlm@78 | 276 |
rlm@78 | 277 div#buttoncon |
rlm@78 | 278 { |
rlm@78 | 279 position:relative; |
rlm@78 | 280 |
rlm@78 | 281 } |
rlm@78 | 282 |
rlm@78 | 283 |
rlm@78 | 284 div#vanish |
rlm@78 | 285 { |
rlm@78 | 286 position:absolute; |
rlm@78 | 287 top:0px; |
rlm@78 | 288 left:0px; |
rlm@78 | 289 z-index:2; |
rlm@78 | 290 } |
rlm@78 | 291 |
rlm@78 | 292 div#crush |
rlm@78 | 293 { |
rlm@78 | 294 position:relative; |
rlm@78 | 295 left:8px; |
rlm@78 | 296 top:0px; |
rlm@78 | 297 z-index:1; |
rlm@78 | 298 } |
rlm@78 | 299 |
rlm@78 | 300 |
rlm@78 | 301 |
rlm@78 | 302 h1 |
rlm@78 | 303 |
rlm@78 | 304 { |
rlm@78 | 305 padding: 0px; |
rlm@78 | 306 margin:0px; |
rlm@78 | 307 margin-bottom: 10px; |
rlm@78 | 308 } |
rlm@78 | 309 |
rlm@78 | 310 |
rlm@78 | 311 |
rlm@78 | 312 |
rlm@78 | 313 |
rlm@78 | 314 |
rlm@78 | 315 /*stuff to make the containing divs actually contain the stuff they contain.*/ |
rlm@78 | 316 |
rlm@78 | 317 .clearfix:after { |
rlm@78 | 318 content: "."; |
rlm@78 | 319 display: block; |
rlm@78 | 320 height: 0; |
rlm@78 | 321 clear: both; |
rlm@78 | 322 visibility: hidden; |
rlm@78 | 323 } |
rlm@78 | 324 |
rlm@78 | 325 * html .clearfix {height: 1%;} |