OLD | NEW |
(Empty) | |
| 1 /* normalize.css v2.1.3 | MIT License | git.io/normalize */ |
| 2 /* normalize.scss v2.1.3 | MIT/GPLv2 License | bit.ly/normalize-with-compass */ |
| 3 |
| 4 |
| 5 // ============================================================================= |
| 6 // Variables and Imports |
| 7 // |
| 8 // If you have a base partial (or equivalent), you should move these lines to |
| 9 // that file. @see http://compass-style.org/help/tutorials/best_practices/ |
| 10 // ============================================================================= |
| 11 |
| 12 // Set this to true to force CSS output to exactly match normalize.css. |
| 13 $strict-normalize: true !default; |
| 14 |
| 15 // The default font family. |
| 16 $base-font-family: sans-serif !default; |
| 17 |
| 18 // The base font size. |
| 19 $base-font-size: 16px !default; // Override default set in Compass' Vertical Rhy
thm partial. |
| 20 |
| 21 // The base line height determines the basic unit of vertical rhythm. |
| 22 $base-line-height: 24px !default; // Override default set in Compass' Vertical R
hythm partial. |
| 23 |
| 24 // The font sizes for h1-h6. |
| 25 $h1-font-size: 2 * $base-font-size !default; |
| 26 $h2-font-size: 1.5 * $base-font-size !default; |
| 27 $h3-font-size: 1.17 * $base-font-size !default; |
| 28 $h4-font-size: 1 * $base-font-size !default; |
| 29 $h5-font-size: 0.83 * $base-font-size !default; |
| 30 $h6-font-size: 0.67 * $base-font-size !default; |
| 31 |
| 32 // The amount lists and blockquotes are indented. |
| 33 $indent-amount: 40px !default; |
| 34 |
| 35 // Set this to true to add support for IE 6. |
| 36 $legacy-support-for-ie6: false !default; // Override default set in Compass' Sup
port partial. |
| 37 |
| 38 // Set this to true to add support for IE 7. |
| 39 $legacy-support-for-ie7: false !default; // Override default set in Compass' Sup
port partial. |
| 40 |
| 41 // After the default variables are set, import the required Compass partials. |
| 42 @import "compass/support"; |
| 43 @import "compass/css3/box-sizing"; |
| 44 @import "compass/typography/vertical_rhythm"; |
| 45 |
| 46 |
| 47 /* ========================================================================== |
| 48 HTML5 display definitions |
| 49 ========================================================================== */ |
| 50 |
| 51 /** |
| 52 * Correct `block` display not defined in IE 8/9. |
| 53 */ |
| 54 |
| 55 article, |
| 56 aside, |
| 57 details, |
| 58 figcaption, |
| 59 figure, |
| 60 footer, |
| 61 header, |
| 62 hgroup, |
| 63 main, |
| 64 nav, |
| 65 section, |
| 66 summary { |
| 67 display: block; |
| 68 } |
| 69 |
| 70 /** |
| 71 * Correct `inline-block` display not defined in IE 8/9. |
| 72 */ |
| 73 |
| 74 audio, |
| 75 canvas, |
| 76 video { |
| 77 display: inline-block; |
| 78 @if $legacy-support-for-ie6 or $legacy-support-for-ie7 { |
| 79 *display: inline; |
| 80 *zoom: 1; |
| 81 } |
| 82 } |
| 83 |
| 84 /** |
| 85 * Prevent modern browsers from displaying `audio` without controls. |
| 86 * Remove excess height in iOS 5 devices. |
| 87 */ |
| 88 |
| 89 audio:not([controls]) { |
| 90 display: none; |
| 91 height: 0; |
| 92 } |
| 93 |
| 94 /** |
| 95 * Address `[hidden]` styling not present in IE 8/9. |
| 96 * Hide the `template` element in IE, Safari, and Firefox < 22. |
| 97 */ |
| 98 |
| 99 [hidden], |
| 100 template { |
| 101 display: none; |
| 102 } |
| 103 |
| 104 /* ========================================================================== |
| 105 Base |
| 106 ========================================================================== */ |
| 107 |
| 108 /** |
| 109 * 1. Set default font family to sans-serif. |
| 110 * 2. Prevent iOS text size adjust after orientation change, without disabling |
| 111 * user zoom. |
| 112 * 3. Correct text resizing oddly in IE 6/7 when body `font-size` is set using |
| 113 * `em` units. |
| 114 */ |
| 115 |
| 116 html { |
| 117 font-family: $base-font-family; /* 1 */ |
| 118 @if not $strict-normalize or $legacy-support-for-ie6 or $legacy-support-for-
ie7 { |
| 119 font-size: 100% * ($base-font-size / 16px); /* 3 */ |
| 120 } |
| 121 -ms-text-size-adjust: 100%; /* 2 */ |
| 122 -webkit-text-size-adjust: 100%; /* 2 */ |
| 123 |
| 124 @if not $strict-normalize { |
| 125 /* Establish a vertical rhythm unit using $base-line-height. */ |
| 126 @include adjust-leading-to(1); |
| 127 } |
| 128 } |
| 129 |
| 130 @if $legacy-support-for-ie6 or $legacy-support-for-ie7 { |
| 131 /** |
| 132 * Address `font-family` inconsistency between `textarea` and other form |
| 133 * elements. |
| 134 */ |
| 135 |
| 136 button, |
| 137 input, |
| 138 select, |
| 139 textarea { |
| 140 font-family: $base-font-family; |
| 141 } |
| 142 } |
| 143 |
| 144 /** |
| 145 * Remove default margin. |
| 146 */ |
| 147 |
| 148 body { |
| 149 margin: 0; |
| 150 } |
| 151 |
| 152 /* ========================================================================== |
| 153 Links |
| 154 ========================================================================== */ |
| 155 |
| 156 /** |
| 157 * Remove the gray background color from active links in IE 10. |
| 158 */ |
| 159 |
| 160 a { |
| 161 background: transparent; |
| 162 } |
| 163 |
| 164 /** |
| 165 * Address `outline` inconsistency between Chrome and other browsers. |
| 166 */ |
| 167 |
| 168 a:focus { |
| 169 outline: thin dotted; |
| 170 } |
| 171 |
| 172 /** |
| 173 * Improve readability when focused and also mouse hovered in all browsers. |
| 174 */ |
| 175 |
| 176 a:active, |
| 177 a:hover { |
| 178 outline: 0; |
| 179 } |
| 180 |
| 181 /* ========================================================================== |
| 182 Typography |
| 183 ========================================================================== */ |
| 184 |
| 185 @if not $strict-normalize or $legacy-support-for-ie6 or $legacy-support-for-ie7
{ |
| 186 /** |
| 187 * Set 1 unit of vertical rhythm on the top and bottom margin. |
| 188 */ |
| 189 |
| 190 p, |
| 191 pre { |
| 192 margin: rhythm(1) 0; |
| 193 } |
| 194 |
| 195 blockquote { |
| 196 /* Set 1 unit of vertical rhythm on the top and bottom margin. */ |
| 197 margin: rhythm(1) $indent-amount; |
| 198 } |
| 199 } |
| 200 |
| 201 /** |
| 202 * Address variable `h1` font-size and margin within `section` and `article` |
| 203 * contexts in Firefox 4+, Safari 5, and Chrome. |
| 204 */ |
| 205 |
| 206 h1 { |
| 207 /* Set the font-size and line-height while keeping a proper vertical rhythm.
*/ |
| 208 @if not $strict-normalize or $legacy-support-for-ie6 or $legacy-support-for-
ie7 { |
| 209 @include adjust-font-size-to( $h1-font-size ); |
| 210 } |
| 211 @else { |
| 212 font-size: 1em * ($h1-font-size / $base-font-size); |
| 213 } |
| 214 |
| 215 /* Set 1 unit of vertical rhythm on the top and bottom margins. */ |
| 216 @include leader(1, $h1-font-size); |
| 217 @include trailer(1, $h1-font-size); |
| 218 } |
| 219 |
| 220 @if not $strict-normalize or $legacy-support-for-ie6 or $legacy-support-for-ie7
{ |
| 221 h2 { |
| 222 @include adjust-font-size-to( $h2-font-size ); |
| 223 @include leader(1, $h2-font-size); |
| 224 @include trailer(1, $h2-font-size); |
| 225 } |
| 226 |
| 227 h3 { |
| 228 @include adjust-font-size-to( $h3-font-size ); |
| 229 @include leader(1, $h3-font-size); |
| 230 @include trailer(1, $h3-font-size); |
| 231 } |
| 232 |
| 233 h4 { |
| 234 @include adjust-font-size-to( $h4-font-size ); |
| 235 @include leader(1, $h4-font-size); |
| 236 @include trailer(1, $h4-font-size); |
| 237 } |
| 238 |
| 239 h5 { |
| 240 @include adjust-font-size-to( $h5-font-size ); |
| 241 @include leader(1, $h5-font-size); |
| 242 @include trailer(1, $h5-font-size); |
| 243 } |
| 244 |
| 245 h6 { |
| 246 @include adjust-font-size-to( $h6-font-size ); |
| 247 @include leader(1, $h6-font-size); |
| 248 @include trailer(1, $h6-font-size); |
| 249 } |
| 250 } |
| 251 |
| 252 /** |
| 253 * Address styling not present in IE 8/9, Safari 5, and Chrome. |
| 254 */ |
| 255 |
| 256 abbr[title] { |
| 257 border-bottom: 1px dotted; |
| 258 } |
| 259 |
| 260 /** |
| 261 * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome. |
| 262 */ |
| 263 |
| 264 b, |
| 265 strong { |
| 266 font-weight: bold; |
| 267 } |
| 268 |
| 269 /** |
| 270 * Address styling not present in Safari 5 and Chrome. |
| 271 */ |
| 272 |
| 273 dfn { |
| 274 font-style: italic; |
| 275 } |
| 276 |
| 277 /** |
| 278 * Address differences between Firefox and other browsers. |
| 279 */ |
| 280 |
| 281 hr { |
| 282 @include box-sizing(content-box); |
| 283 height: 0; |
| 284 } |
| 285 |
| 286 /** |
| 287 * Address styling not present in IE 8/9. |
| 288 */ |
| 289 |
| 290 mark { |
| 291 background: #ff0; |
| 292 color: #000; |
| 293 } |
| 294 |
| 295 /** |
| 296 * Correct font family set oddly in Safari 5 and Chrome. |
| 297 */ |
| 298 |
| 299 code, |
| 300 kbd, |
| 301 pre, |
| 302 samp { |
| 303 font-family: monospace, serif; |
| 304 @if $legacy-support-for-ie6 { |
| 305 _font-family: 'courier new', monospace; |
| 306 } |
| 307 @if $strict-normalize { |
| 308 font-size: 1em; |
| 309 } |
| 310 @else { |
| 311 @include adjust-font-size-to( $base-font-size ); |
| 312 } |
| 313 } |
| 314 |
| 315 /** |
| 316 * Improve readability of pre-formatted text in all browsers. |
| 317 */ |
| 318 |
| 319 pre { |
| 320 @if $legacy-support-for-ie6 or $legacy-support-for-ie7 { |
| 321 white-space: pre; |
| 322 white-space: pre-wrap; |
| 323 word-wrap: break-word; |
| 324 } |
| 325 @else { |
| 326 white-space: pre-wrap; |
| 327 } |
| 328 } |
| 329 |
| 330 /** |
| 331 * Set consistent quote types. |
| 332 */ |
| 333 |
| 334 q { |
| 335 quotes: "\201C" "\201D" "\2018" "\2019"; |
| 336 } |
| 337 |
| 338 /** |
| 339 * Address inconsistent and variable font size in all browsers. |
| 340 */ |
| 341 |
| 342 small { |
| 343 font-size: 80%; |
| 344 } |
| 345 |
| 346 /** |
| 347 * Prevent `sub` and `sup` affecting `line-height` in all browsers. |
| 348 */ |
| 349 |
| 350 sub, |
| 351 sup { |
| 352 font-size: 75%; |
| 353 line-height: 0; |
| 354 position: relative; |
| 355 vertical-align: baseline; |
| 356 } |
| 357 |
| 358 sup { |
| 359 top: -0.5em; |
| 360 } |
| 361 |
| 362 sub { |
| 363 bottom: -0.25em; |
| 364 } |
| 365 |
| 366 /* ========================================================================== |
| 367 Lists |
| 368 ========================================================================== */ |
| 369 |
| 370 @if not $strict-normalize or $legacy-support-for-ie6 or $legacy-support-for-ie7
{ |
| 371 /** |
| 372 * Address margins set differently in IE 6/7. |
| 373 */ |
| 374 |
| 375 dl, |
| 376 menu, |
| 377 ol, |
| 378 ul { |
| 379 margin: rhythm(1) 0; |
| 380 } |
| 381 |
| 382 @if not $strict-normalize { |
| 383 ol, |
| 384 ul { |
| 385 ol, |
| 386 ul { |
| 387 margin: 0; |
| 388 } |
| 389 } |
| 390 } |
| 391 |
| 392 dd { |
| 393 margin: 0 0 0 $indent-amount; |
| 394 } |
| 395 |
| 396 /** |
| 397 * Address paddings set differently in IE 6/7. |
| 398 */ |
| 399 |
| 400 menu, |
| 401 ol, |
| 402 ul { |
| 403 padding: 0 0 0 $indent-amount; |
| 404 } |
| 405 } |
| 406 |
| 407 @if $legacy-support-for-ie7 { |
| 408 /** |
| 409 * Correct list images handled incorrectly in IE 7. |
| 410 */ |
| 411 |
| 412 nav ul, |
| 413 nav ol { |
| 414 list-style: none; |
| 415 list-style-image: none; |
| 416 } |
| 417 } |
| 418 |
| 419 /* ========================================================================== |
| 420 Embedded content |
| 421 ========================================================================== */ |
| 422 |
| 423 /** |
| 424 * Remove border when inside `a` element in IE 8/9. |
| 425 */ |
| 426 |
| 427 img { |
| 428 border: 0; |
| 429 @if $legacy-support-for-ie7 { |
| 430 /* Improve image quality when scaled in IE 7. */ |
| 431 -ms-interpolation-mode: bicubic; |
| 432 } |
| 433 } |
| 434 |
| 435 /** |
| 436 * Correct overflow displayed oddly in IE 9. |
| 437 */ |
| 438 |
| 439 svg:not(:root) { |
| 440 overflow: hidden; |
| 441 } |
| 442 |
| 443 /* ========================================================================== |
| 444 Figures |
| 445 ========================================================================== */ |
| 446 |
| 447 /** |
| 448 * Address margin not present in IE 8/9 and Safari 5. |
| 449 */ |
| 450 |
| 451 figure { |
| 452 margin: 0; |
| 453 } |
| 454 |
| 455 /* ========================================================================== |
| 456 Forms |
| 457 ========================================================================== */ |
| 458 |
| 459 @if $legacy-support-for-ie6 or $legacy-support-for-ie7 { |
| 460 /** |
| 461 * Correct margin displayed oddly in IE 6/7. |
| 462 */ |
| 463 |
| 464 form { |
| 465 margin: 0; |
| 466 } |
| 467 } |
| 468 |
| 469 /** |
| 470 * Define consistent border, margin, and padding. |
| 471 */ |
| 472 |
| 473 fieldset { |
| 474 margin: 0 2px; |
| 475 /* Apply borders and padding that keep the vertical rhythm. */ |
| 476 border-color: #c0c0c0; |
| 477 @include apply-side-rhythm-border(top, $width: 1px, $lines: 0.35); |
| 478 @include apply-side-rhythm-border(bottom, $width: 1px, $lines: 0.65); |
| 479 @include apply-side-rhythm-border(left, $width: 1px, $lines: 0.625); |
| 480 @include apply-side-rhythm-border(right, $width: 1px, $lines: 0.625); |
| 481 } |
| 482 |
| 483 /** |
| 484 * 1. Correct `color` not being inherited in IE 8/9. |
| 485 * 2. Remove padding so people aren't caught out if they zero out fieldsets. |
| 486 * 3. Correct alignment displayed oddly in IE 6/7. |
| 487 */ |
| 488 |
| 489 legend { |
| 490 border: 0; /* 1 */ |
| 491 padding: 0; /* 2 */ |
| 492 @if $legacy-support-for-ie6 or $legacy-support-for-ie7 { |
| 493 *margin-left: -7px; /* 3 */ |
| 494 } |
| 495 } |
| 496 |
| 497 /** |
| 498 * 1. Correct font family not being inherited in all browsers. |
| 499 * 2. Correct font size not being inherited in all browsers. |
| 500 * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome. |
| 501 * 4. Improve appearance and consistency with IE 6/7. |
| 502 */ |
| 503 |
| 504 button, |
| 505 input, |
| 506 select, |
| 507 textarea { |
| 508 font-family: inherit; /* 1 */ |
| 509 font-size: 100%; /* 2 */ |
| 510 margin: 0; /* 3 */ |
| 511 @if $legacy-support-for-ie6 or $legacy-support-for-ie7 { |
| 512 vertical-align: baseline; /* 4 */ |
| 513 *vertical-align: middle; /* 4 */ |
| 514 } |
| 515 } |
| 516 |
| 517 /** |
| 518 * Address Firefox 4+ setting `line-height` on `input` using `!important` in |
| 519 * the UA stylesheet. |
| 520 */ |
| 521 |
| 522 button, |
| 523 input { |
| 524 line-height: normal; |
| 525 } |
| 526 |
| 527 /** |
| 528 * Address inconsistent `text-transform` inheritance for `button` and `select`. |
| 529 * All other form control elements do not inherit `text-transform` values. |
| 530 * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+. |
| 531 * Correct `select` style inheritance in Firefox 4+ and Opera. |
| 532 */ |
| 533 |
| 534 button, |
| 535 select { |
| 536 text-transform: none; |
| 537 } |
| 538 |
| 539 /** |
| 540 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` |
| 541 * and `video` controls. |
| 542 * 2. Correct inability to style clickable `input` types in iOS. |
| 543 * 3. Improve usability and consistency of cursor style between image-type |
| 544 * `input` and others. |
| 545 * 4. Remove inner spacing in IE 7 without affecting normal text inputs. |
| 546 * Known issue: inner spacing remains in IE 6. |
| 547 */ |
| 548 |
| 549 button, |
| 550 html input[type="button"], /* 1 */ |
| 551 input[type="reset"], |
| 552 input[type="submit"] { |
| 553 -webkit-appearance: button; /* 2 */ |
| 554 cursor: pointer; /* 3 */ |
| 555 @if $legacy-support-for-ie7 { |
| 556 *overflow: visible; /* 4 */ |
| 557 } |
| 558 } |
| 559 |
| 560 /** |
| 561 * Re-set default cursor for disabled elements. |
| 562 */ |
| 563 |
| 564 button[disabled], |
| 565 html input[disabled] { |
| 566 cursor: default; |
| 567 } |
| 568 |
| 569 /** |
| 570 * 1. Address box sizing set to `content-box` in IE 8/9/10. |
| 571 * 2. Remove excess padding in IE 8/9/10. |
| 572 * 3. Remove excess padding in IE 7. |
| 573 * Known issue: excess padding remains in IE 6. |
| 574 */ |
| 575 |
| 576 input[type="checkbox"], |
| 577 input[type="radio"] { |
| 578 @include box-sizing(border-box); /* 1 */ |
| 579 padding: 0; /* 2 */ |
| 580 @if $legacy-support-for-ie7 { |
| 581 *height: 13px; /* 3 */ |
| 582 *width: 13px; /* 3 */ |
| 583 } |
| 584 } |
| 585 |
| 586 /** |
| 587 * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome. |
| 588 * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome |
| 589 * (include `-moz` to future-proof). |
| 590 */ |
| 591 |
| 592 input[type="search"] { |
| 593 -webkit-appearance: textfield; /* 1 */ |
| 594 @include box-sizing(content-box); /* 2 */ |
| 595 } |
| 596 |
| 597 /** |
| 598 * Remove inner padding and search cancel button in Safari 5 and Chrome |
| 599 * on OS X. |
| 600 */ |
| 601 |
| 602 input[type="search"]::-webkit-search-cancel-button, |
| 603 input[type="search"]::-webkit-search-decoration { |
| 604 -webkit-appearance: none; |
| 605 } |
| 606 |
| 607 /** |
| 608 * Remove inner padding and border in Firefox 4+. |
| 609 */ |
| 610 |
| 611 button::-moz-focus-inner, |
| 612 input::-moz-focus-inner { |
| 613 border: 0; |
| 614 padding: 0; |
| 615 } |
| 616 |
| 617 /** |
| 618 * 1. Remove default vertical scrollbar in IE 8/9. |
| 619 * 2. Improve readability and alignment in all browsers. |
| 620 */ |
| 621 |
| 622 textarea { |
| 623 overflow: auto; /* 1 */ |
| 624 vertical-align: top; /* 2 */ |
| 625 } |
| 626 |
| 627 /* ========================================================================== |
| 628 Tables |
| 629 ========================================================================== */ |
| 630 |
| 631 /** |
| 632 * Remove most spacing between table cells. |
| 633 */ |
| 634 |
| 635 table { |
| 636 border-collapse: collapse; |
| 637 border-spacing: 0; |
| 638 } |
OLD | NEW |