comparison: example/src/style/default.css
example/src/style/default.css
- changeset 14
- bbf5bbd72f48
- parent 10
- 118ab361da29
- child 16
- e377590e9b19
equal
deleted
inserted
replaced
| 13:5886bf51708b | 14:bbf5bbd72f48 |
|---|---|
| 1 | 1 |
| 2 body { | 2 body { |
| 3 font-family: Optima, Linux Biolinum, Candara, sans-serif; | 3 font-family: Optima, Linux Biolinum, Candara, sans-serif; |
| 4 #font-weight: 300; | 4 #font-weight: 300; |
| 5 background: #ffffff; | 5 background: #ffffff; |
| 6 color: #000000; | 6 color: #000000; |
| 7 margin: 10px 40px 40px 40px; | 7 margin: 10px 40px 40px 40px; |
| 8 max-width: 80ex; | 8 max-width: 80ex; |
| 9 text-align: left; | 9 text-align: left; |
| 10 } | 10 } |
| 11 | 11 |
| 12 | 12 |
| 13 a { color: #3399ee; text-decoration: none; } | 13 a { color: #3399ee; text-decoration: none; } |
| 14 a:link { color: #3399ee; } | 14 a:link { color: #3399ee; } |
| 15 a:visited { color: #2288dd; } | 15 a:visited { color: #2288dd; } |
| 16 a:active { color: #2288dd; } | 16 a:active { color: #2288dd; } |
| 17 a:hover { color: #2288dd; } | 17 a:hover { color: #2288dd; } |
| 18 | 18 |
| 19 h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .header a | 19 h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .header a |
| 20 { text-decoration: none; } | 20 { text-decoration: none; } |
| 21 | 21 |
| 22 | 22 |
| 23 h1 { | 23 h1 { |
| 24 margin: 1em 0em; | 24 margin: 1em 0em; |
| 25 /*color: #45a9b0;*/ | 25 /*color: #45a9b0;*/ |
| 26 border-bottom: 1px solid #000000; | 26 border-bottom: 1px solid #000000; |
| 27 font-weight: bolder; | 27 font-weight: bolder; |
| 28 color: #000000; | 28 color: #000000; |
| 29 font-size: xx-large; | 29 font-size: xx-large; |
| 30 /*font-variant: small-caps;*/ | 30 /*font-variant: small-caps;*/ |
| 31 text-align: left; | 31 text-align: left; |
| 32 } | 32 } |
| 33 | 33 |
| 34 h2, .inlinepage h1 { | 34 h2, .inlinepage h1 { |
| 35 /*color: #84c7c0;*/ | 35 /*color: #84c7c0;*/ |
| 36 color: #3399ee; | 36 color: #3399ee; |
| 37 margin-bottom: 1em; | 37 margin-bottom: 1em; |
| 38 margin-top: 1.5em; | 38 margin-top: 1.5em; |
| 39 padding: 0; | 39 padding: 0; |
| 40 /*text-transform: uppercase;*/ | 40 /*text-transform: uppercase;*/ |
| 41 font-size: large; | 41 font-size: large; |
| 42 font-variant: normal; | 42 font-variant: normal; |
| 43 font-weight: bolder; | 43 font-weight: bolder; |
| 44 } | 44 } |
| 45 | 45 |
| 46 h3, h4, h5, h6 { | 46 h3, h4, h5, h6 { |
| 47 margin-top: 1em; | 47 margin-top: 1em; |
| 48 margin-bottom: 0.05em; | 48 margin-bottom: 0.05em; |
| 49 font-size: medium; | 49 font-size: medium; |
| 50 color: #ffffff; | 50 color: #ffffff; |
| 51 } | 51 } |
| 52 | 52 |
| 53 blockquote { | 53 blockquote { |
| 54 /*font-style: italic;*/ | 54 /*font-style: italic;*/ |
| 55 padding: 0 1ex; | 55 padding: 0 1ex; |
| 56 border-left: 1px solid #3399ee; | 56 border-left: 1px solid #3399ee; |
| 57 } | 57 } |
| 58 | 58 |
| 59 blockquote p { | 59 blockquote p { |
| 60 margin: 0.9ex 0; | 60 margin: 0.9ex 0; |
| 61 } | 61 } |
| 62 | 62 |
| 63 blockquote em { | 63 blockquote em { |
| 64 font-style: normal; | 64 font-style: normal; |
| 65 } | 65 } |
| 66 | 66 |
| 67 pre { | 67 pre { |
| 68 /*background-color: #a0a0a0;*/ | 68 /*background-color: #a0a0a0;*/ |
| 69 padding: 0 1ex; | 69 padding: 0 1ex; |
| 70 border-left: 2px dashed #3399ee; | 70 border-left: 2px dashed #3399ee; |
| 71 } | 71 } |
| 72 | |
| 73 /*p.note { | |
| 74 font-size: small; | |
| 75 }*/ | |
| 76 | 72 |
| 77 hr { | 73 hr { |
| 78 border: none 0; | 74 border: none 0; |
| 79 border-top: 2px dashed #84c7c0; | 75 border-top: 2px dashed #84c7c0; |
| 80 height: 1px; | 76 height: 1px; |
| 81 width: 10ex; | 77 width: 10ex; |
| 82 margin: 1ex auto 1ex 0; | 78 margin: 1ex auto 1ex 0; |
| 83 } | 79 } |
| 84 | 80 |
| 85 table { | 81 table { |
| 86 /*border: none 0;*/ | 82 /*border: none 0;*/ |
| 87 border-collapse: collapse; | 83 border-collapse: collapse; |
| 88 padding: 0.5ex; | 84 padding: 0.5ex; |
| 89 } | 85 } |
| 90 | 86 |
| 91 thead { | 87 thead { |
| 92 border-bottom: 2px dashed #84c7c0; | 88 border-bottom: 2px dashed #84c7c0; |
| 93 } | 89 } |
| 94 | 90 |
| 95 tr, td { | 91 tr, td { |
| 96 border: 0px solid #aaaac0; | 92 border: 0px solid #aaaac0; |
| 97 padding: 0ex 1ex; | 93 padding: 0ex 1ex; |
| 98 } | 94 } |
| 99 | 95 |
| 100 table[border="1"] tr, table[border="1"] tr td { | 96 table[border="1"] tr, table[border="1"] tr td { |
| 101 border: 1px solid #aaaac0; | 97 border: 1px solid #aaaac0; |
| 102 } | 98 } |
| 103 | 99 |
| 104 /*.note { | |
| 105 font-size: small; | |
| 106 }*/ | |
| 107 | 100 |
| 108 | 101 |
| 109 key { | 102 key { |
| 110 font-family: monospace; | 103 font-family: monospace; |
| 111 } | 104 } |
| 112 | 105 |
| 113 code { | 106 code { |
| 114 font-family: monospace; | 107 font-family: monospace; |
| 115 font-size: medium; | 108 font-size: medium; |
| 116 } | 109 } |
| 117 | 110 |
| 118 li { | 111 li { |
| 119 margin-top: 1em; | 112 margin-top: 1em; |
| 120 } | 113 } |
| 121 | 114 |
| 122 .illustr-left { | 115 .illustr-left { |
| 123 float: left; | 116 float: left; |
| 124 padding-right: 1ex; | 117 padding-right: 1ex; |
| 125 padding-bottom: 1ex; | 118 padding-bottom: 1ex; |
| 126 padding-top: 1ex; | 119 padding-top: 1ex; |
| 127 } | 120 } |
| 128 | 121 |
| 129 .illustr-right { | 122 .illustr-right { |
| 130 float: right; | 123 float: right; |
| 131 padding-left: 1ex; | 124 padding-left: 1ex; |
| 132 padding-bottom: 1ex; | 125 padding-bottom: 1ex; |
| 133 padding-top: 1ex; | 126 padding-top: 1ex; |
| 134 } | 127 } |
| 135 | 128 |
| 136 b{ | 129 b{ |
| 137 font-weight: bolder; | 130 font-weight: bolder; |
| 138 } | 131 } |
| 139 | 132 |
| 140 .bibtex2html td { | 133 .bibtex2html td { |
| 141 padding-bottom: 5px ; | 134 padding-bottom: 5px ; |
| 142 } | 135 } |
| 161 /* main */ | 154 /* main */ |
| 162 | 155 |
| 163 body { | 156 body { |
| 164 margin: 0; | 157 margin: 0; |
| 165 padding: 0; | 158 padding: 0; |
| 166 max-width: none; | 159 max-width: none; |
| 167 background-image: url('banner2x.jpg'); | 160 background-image: url('banner2x.jpg'); |
| 168 background-repeat: no-repeat; | 161 background-repeat: no-repeat; |
| 169 background-size: 100%; | 162 background-size: 100%; |
| 170 } | 163 } |
| 171 | 164 |
| 172 body> .header { | 165 body> .header { |
| 173 margin: 0px; | 166 margin: 0px; |
| 174 margin-left: 60px; | 167 margin-left: 60px; |
| 175 padding: 120px 0px 20px 0px; | 168 padding: 120px 0px 20px 0px; |
| 176 font-size: large; | 169 font-size: large; |
| 177 font-weight: bolder; | 170 font-weight: bolder; |
| 178 line-height: 1em; | 171 line-height: 1em; |
| 179 display: block; | 172 display: block; |
| 180 /*height: 130px;*/ | 173 /*height: 130px;*/ |
| 181 } | 174 } |
| 182 | 175 |
| 183 body> .header a, | 176 body> .header a, |
| 184 body> .header a:link, | 177 body> .header a:link, |
| 185 body> .header a:visited, | 178 body> .header a:visited, |
| 186 body> .header a:active, | 179 body> .header a:active, |
| 187 body> .header a:hover { | 180 body> .header a:hover { |
| 188 /*color: #3377ee;*/ | 181 /*color: #3377ee;*/ |
| 189 color: #000000; | 182 color: #000000; |
| 190 text-decoration: none; | 183 text-decoration: none; |
| 191 } | 184 } |
| 192 | 185 |
| 193 | 186 |
| 194 #content { | 187 #content { |
| 195 margin: 0; /*1em 40px 10px 40px;*/ | 188 margin: 0; |
| 196 padding: 0; | 189 padding: 0; |
| 197 margin-left: 36ex; | 190 margin-left: auto;/*30ex;*/ |
| 198 max-width: 80ex; | 191 margin-right: auto;/*10ex;*/ |
| 199 text-align: left; | 192 max-width: 80ex; |
| 200 display: block; | 193 text-align: left; |
| 194 display: block; | |
| 201 } | 195 } |
| 202 | 196 |
| 203 #sidebar { | 197 #sidebar { |
| 204 line-height: 3ex; | 198 line-height: 3ex; |
| 205 float: left; | 199 float: left; |
| 206 margin: 0; | 200 margin: 0; |
| 207 padding: 4ex 0px; | 201 max-width: 50ex; |
| 208 margin-left: 11ex; | 202 padding: 4ex 0px; |
| 209 padding-top: 2ex; | 203 margin-left: 8ex; |
| 210 line-height: 150%; | 204 padding-top: 2ex; |
| 205 line-height: 150%; | |
| 211 } | 206 } |
| 212 | 207 |
| 213 .sidetitle { | 208 .sidetitle { |
| 214 color: #000000; | 209 color: #000000; |
| 215 margin-top: 3ex; | 210 margin-top: 3ex; |
| 216 font-weight: bolder; | 211 font-weight: bolder; |
| 217 /*margin-left: -1.5ex;*/ | |
| 218 } | |
| 219 | |
| 220 .extra { | |
| 221 color: #ffffff !important; | |
| 222 display: inline; | |
| 223 } | |
| 224 | |
| 225 .extra a { | |
| 226 color: #ffffff !important; | |
| 227 } | |
| 228 | |
| 229 #sidebar a { | |
| 230 text-decoration: none; | |
| 231 font-weight: bolder; | |
| 232 color: #3388ee; | |
| 233 } | |
| 234 | |
| 235 #sidebar ul { | |
| 236 list-style-type: none; | |
| 237 } | |
| 238 | |
| 239 #sidebar LI { | |
| 240 display: block; | |
| 241 } | 212 } |
| 242 | 213 |
| 243 .side { | 214 .side { |
| 244 padding-left: 1.5ex; | 215 padding-left: 1.5ex; |
| 245 text-align: left; | 216 text-align: left; |
| 246 font-size: medium; /* feed to compliant browsers */ | 217 font-size: medium; /* feed to compliant browsers */ |
| 247 } | 218 } |
| 248 | 219 |
| 249 | 220 @media screen and (max-width: 140ex) { |
| 250 @media only screen and (max-device-width: 480px) { | |
| 251 | 221 |
| 252 body> .header { | 222 body> .header { |
| 253 padding: 0px; | 223 padding: 0px; |
| 254 } | 224 } |
| 255 | 225 |
| 256 .sidetitle { | |
| 257 font-size: x-large; | |
| 258 } | |
| 259 | |
| 260 .side { | 226 .side { |
| 261 padding-left: 1.5ex; | 227 padding-top: 2ex; |
| 262 padding-top: 2ex; | 228 text-align: left; |
| 263 text-align: left; | 229 /*font-size: x-large; |
| 264 font-size: x-large; /* feed to compliant browsers */ | 230 line-height: 300%;*/ |
| 265 line-height: 300%; | 231 } |
| 266 } | 232 |
| 267 | |
| 268 #sidebar { | 233 #sidebar { |
| 269 margin: 1ex 2ex; | 234 margin-left: 8ex; |
| 270 padding: 0ex 2ex; | 235 padding: 0ex 2ex; |
| 271 float: none; | 236 float: none; |
| 272 } | 237 } |
| 273 | 238 |
| 274 #content { | 239 #content { |
| 275 margin: 1ex 2ex; | 240 margin-left: 8ex; |
| 276 padding: 0ex 2ex; | 241 margin-right: 8ex; |
| 277 max-width: none; | 242 padding: 0ex 2ex; |
| 278 display: block; | 243 /*max-width: none;*/ |
| 279 } | 244 display: block; |
| 280 } | 245 } |
| 281 | 246 } |
| 247 | |
| 248 @media screen and (max-device-width: 480px) { | |
| 249 .side { | |
| 250 font-size: large; | |
| 251 line-height: 200%; | |
| 252 } | |
| 253 | |
| 254 #sidebar { | |
| 255 margin-left: 1ex; | |
| 256 font-size: large; | |
| 257 } | |
| 258 | |
| 259 #content { | |
| 260 margin-left: 1ex; | |
| 261 margin-right: 1ex; | |
| 262 } | |
| 263 } | |
| 264 | |
| 265 .extra { | |
| 266 color: #ffffff !important; | |
| 267 display: inline; | |
| 268 } | |
| 269 | |
| 270 .extra a { | |
| 271 color: #ffffff !important; | |
| 272 } | |
| 273 | |
| 274 #sidebar a { | |
| 275 text-decoration: none; | |
| 276 font-weight: bolder; | |
| 277 color: #3388ee; | |
| 278 } | |
| 279 | |
| 280 #sidebar ul { | |
| 281 list-style-type: none; | |
| 282 } | |
| 283 | |
| 284 #sidebar LI { | |
| 285 display: block; | |
| 286 } | |
| 282 | 287 |
| 283 .inlinepage { | 288 .inlinepage { |
| 284 padding: 0px 0px; | 289 padding: 0px 0px; |
| 285 border: none; | 290 border: none; |
| 286 /*border-top: 1px solid #aaaac0;*/ | 291 /*border-top: 1px solid #aaaac0;*/ |
| 287 padding-top: 2ex; | 292 padding-top: 2ex; |
| 288 margin-top: 2ex; | 293 margin-top: 2ex; |
| 289 margin-bottom: 4ex; | 294 margin-bottom: 4ex; |
| 290 } | 295 } |
| 291 | 296 |
| 292 .inlinepage .header { | 297 .inlinepage .header { |
| 293 color: red; | 298 color: red; |
| 294 font-size: large; | 299 font-size: large; |
| 295 font-weight: bolder; | 300 font-weight: bolder; |
| 296 text-transform: uppercase; | 301 text-transform: uppercase; |
| 297 } | 302 } |
| 298 | 303 |
| 299 .posted-header { | 304 .posted-header { |
| 300 color: #000; | 305 color: #000; |
| 301 margin-bottom: 10x; | 306 margin-bottom: 10x; |
| 302 text-align: left; | 307 text-align: left; |
| 303 line-height: 1.7em; | 308 line-height: 1.7em; |
| 304 font-weight: bolder; | 309 font-weight: bolder; |
| 305 /*font-size: small;*/ /* for compliant browsers */ | 310 /*font-size: small;*/ /* for compliant browsers */ |
| 306 border-bottom: 1px solid #000000; | 311 border-bottom: 1px solid #000000; |
| 307 } | 312 } |
| 308 | 313 |
| 309 .posted { | 314 .posted { |
| 310 } | 315 } |
| 311 | 316 |
| 312 body> #footer .tags { | 317 body> #footer .tags { |
| 313 margin: 1em 0ex; | 318 margin: 1em 0ex; |
| 314 } | 319 } |
| 315 | 320 |
| 316 body> #footer #backlinks { | 321 body> #footer #backlinks { |
| 317 margin: 1em 0ex; | 322 margin: 1em 0ex; |
| 318 } | 323 } |
| 319 | 324 |
| 320 body> #footer .pageinfo { | 325 body> #footer .pageinfo { |
| 321 margin: 1em 0ex; | 326 margin: 1em 0ex; |
| 322 } | 327 } |
| 323 | 328 |
| 324 body> #footer { | 329 body> #footer { |
| 325 padding: 4ex 0ex; | 330 padding: 4ex 0ex; |
| 326 margin: 1em 0ex; | 331 margin: 1em 0ex; |
| 327 clear: both; | 332 clear: both; |
| 328 } | 333 } |
| 329 | 334 |
| 330 .pageinfo { | 335 .pageinfo { |
| 331 clear: both; | 336 clear: both; |
| 332 font-style: italic; | 337 font-style: italic; |
