piecss 0.5.0 → 0.6.0

data/sass/piecss/behavior/base/_base.scss

@@ -1,572 +1,7 @@
 // Copyright (C) 2014 Babs Gösgens. Licensed under MIT; see LICENSE.txt
 
+// @import "normalize";
 @import "settings";
+@import "collection";
 
-/*
- * A large part of the behavior below is based on Normalize by Nicholas Gallager.
- * The difference is that the property values are based on the project settings.
- * The resulting code is a preset rather than a reset.
- * Therefor properties do not need to be set again with actual values.
- *
- * For more information on Normalize, please visit git.io/normalize
- */
-
-
-/*
- * 1. Apply a natural box layout model to all elements
- * 2. Remove margins from all elements
- * 3. Experimentally align all elements to bottom
- */
-
-*,
-*:before,
-*:after {
-  @if $reset-box-model {
-    box-sizing: border-box; /* 1 */
-    margin: 0; /* 2 */
-    vertical-align: bottom;
-  }
-}
-
-
-/*
- * 1. Set base font (family, size, line-height) for conversions to rem and/or em.
- * 2. Set default font family to sans-serif.
- * 3. Prevent iOS text size adjust after orientation change, without disabling
- *    user zoom.
- * 4. Set background color.
- * 5. Set body color.
- */
-
-html {
-
-  $font-style: extract-type-style($default-font);
-  $font-variant: extract-type-variant($default-font);
-  $font-weight: extract-type-weight($default-font);
-  $font-family: extract-type-family($default-font);
-
-  $font-size: to-unit($default-font-size, 1%, $base-font-size);
-  $line-height: to-unit($default-line-height, $line-height-unit);
-
-  font: #{$font-style} #{$font-variant} #{$font-weight} #{$font-size}/#{$line-height} #{$font-family}; /* 1, 2 */
-  color: $color-body; /* 5 */
-
-  text-size-adjust: 100%; /* 3 */
-  width: 100%; /* 3 */
-
-  background: $color-background; /* 4 */
-}
-
-/*
- * Remove default margin.
- */
-
-#{implode($reset-margin ", ")} {
-  margin: 0;
-}
-
-/* HTML5 display definitions
-   ========================================================================== */
-
-/*
- * Correct `block` display not defined for any HTML5 element in IE 8/9.
- * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.
- * Correct `block` display not defined for `main` in IE 11.
- */
-
-article,
-aside,
-details,
-figcaption,
-figure,
-footer,
-header,
-hgroup,
-main,
-nav,
-section,
-summary {
-  @if $normalize-block-display {
-    display: block;
-  }
-}
-
-/*
- * 1. Correct `inline-block` display not defined in IE 8/9.
- * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
- */
-
-audio,
-canvas,
-progress,
-video {
-  display: inline-block; /* 1 */
-  vertical-align: baseline; /* 2 */
-}
-
-/*
- * Prevent modern browsers from displaying `audio` without controls.
- * Remove excess height in iOS 5 devices.
- */
-
-audio:not([controls]) {
-  display: none;
-  height: 0;
-}
-
-/*
- * Address `[hidden]` styling not present in IE 8/9/10.
- * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
- */
-
-[hidden],
-template {
-  display: none;
-}
-
-/* Links
-   ========================================================================== */
-
-/*
- * 1. Remove the gray background color from active links in IE 10.
- * 2. Set default anchor colour.
- */
-
-a {
-  @if $normalize-anchor {
-    background: transparent; /* 1 */
-  }
-  color: $color-anchor; /* 2 */
-  &:visited {
-    color: $color-anchor--visited; /* 2 */
-  }
-  &:active {
-    color: $color-anchor--active; /* 2 */
-  }
-  &:hover {
-    color: $color-anchor--hover; /* 2 */
-  }
-}
-
-/*
- * Improve readability when focused and also mouse hovered in all browsers.
- */
-
-a:active,
-a:hover {
-  @if $normalize-anchor {
-    outline: 0;
-  }
-}
-
-/* Text-level semantics
-   ========================================================================== */
-
-/*
- * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
- */
-
-abbr[title] {
-  @if $normalize-abbr {
-    border-bottom: 1px dotted;
-  }
-}
-
-/*
- * Address variable `h1` font-size and margin within `section` and `article`
- * contexts in Firefox 4+, Safari, and Chrome.
- */
-
-h1 {
-  @if $normalize-h1 and index($reset-font, "h1")==0  {
-    font-size: $h1-font-size;
-    line-height: $h1-line-height;
-  }
-}
-
-/*
- * Reset or normalize font-weights.
- */
-
-@if length($reset-font-weight-to-bold)>0 {
-  #{implode($reset-font-weight-to-bold, ", ")} {
-    font-weight: bold;
-  }
-}
-
-@if length($reset-font-weight-to-italic)>0 {
-  #{implode($reset-font-weight-to-italic, ", ")} {
-    font-weight: italic;
-  }
-}
-
-@if length($reset-font-weight-to-regular)>0 {
-  #{implode($reset-font-weight-to-regular, ", ")} {
-    font-weight: regular;
-  }
-}
-
-/*
- * Full typographic reset
- */
-
-@if length($reset-font)>0 {
-  #{implode($reset-font ", ")} {
-    font: inherit;
-  }
-}
-
-/*
- * Address styling not present in IE 8/9.
- */
-
-mark {
-  @if $normalize-mark {
-    background: $mark-background;
-    color: $mark-color;
-  }
-}
-
-/*
- * Address inconsistent and variable font size in all browsers.
- */
-
-small {
-  @if $normalize-small {
-    font-size: $small-font-size;
-  }
-}
-
-/*
- * Prevent `sub` and `sup` affecting `line-height` in all browsers.
- */
-
-sub,
-sup {
-  @if $normalize-sup-sub {
-    font-size: $sup-sub-font-size;
-    line-height: 0;
-    position: relative;
-    vertical-align: baseline;
-  }
-}
-
-sup {
-  @if $normalize-sup-sub {
-    top: $sup-offset-top;
-  }
-}
-
-sub {
-  @if $normalize-sup-sub {
-    bottom: $sub-offset-bottom;
-  }
-}
-
-/* Embedded content
-   ========================================================================== */
-
-/*
- * Remove border when inside `a` element in IE 8/9/10.
- */
-
-img {
-  @if $normalize-img-border {
-    border: 0;
-  }
-}
-
-/*
- * Correct overflow not hidden in IE 9/10/11.
- */
-
-svg:not(:root) {
-  @if $normalize-svg {
-    overflow: hidden;
-  }
-}
-
-/* Grouping content
-   ========================================================================== */
-
-/*
- * Address margin not present in IE 8/9 and Safari.
- */
-
-figure {
-  @if $normalize-figure-margin {
-    margin: $figure-margin;
-  }
-}
-
-/*
- * Address differences between Firefox and other browsers.
- */
-
-hr {
-  @if $normalize-horizontal-rule {
-    box-sizing: content-box;
-    height: 0;
-  }
-}
-
-/*
- * Contain overflow in all browsers.
- */
-
-pre {
-  white-space: pre-wrap;
-  @if $normalize-pre-overflow {
-    overflow: auto;
-  }
-}
-
-/*
- * Address odd `em`-unit font size rendering in all browsers.
- */
-
-code,
-kbd,
-pre,
-samp {
-  @if $reset-monospace-elements {
-    font-family: $monospace-elements-font-family;
-  }
-  @if $normalize-monospace-elements {
-    font-size: $monospace-elements-font-size;
-  }
-}
-
-
-/* Forms
-   ========================================================================== */
-
-/*
- * Known limitation: by default, Chrome and Safari on OS X allow very limited
- * styling of `select`, unless a `border` property is set.
- */
-
-/*
- * 1. Correct color not being inherited.
- *    Known issue: affects color of disabled elements.
- */
-
-button,
-input,
-optgroup,
-select,
-textarea {
-  @if $normalize-form-elements {
-    color: inherit; /* 1 */
-  }
-}
-
-/*
- * Address `overflow` set to `hidden` in IE 8/9/10/11.
- */
-
-button {
-  @if $normalize-form-elements {
-    overflow: visible;
-  }
-}
-
-/*
- * Address inconsistent `text-transform` inheritance for `button` and `select`.
- * All other form control elements do not inherit `text-transform` values.
- * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
- * Correct `select` style inheritance in Firefox.
- */
-
-button,
-select {
-  @if $normalize-form-elements {
-    text-transform: none;
-  }
-}
-
-/*
- * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
- *    and `video` controls.
- * 2. Correct inability to style clickable `input` types in iOS.
- * 3. Improve usability and consistency of cursor style between image-type
- *    `input` and others.
- */
-
-button,
-html input[type="button"], /* 1 */
-input[type="reset"],
-input[type="submit"] {
-  @if $normalize-form-elements {
-    appearance: button; /* 2 */
-    cursor: pointer; /* 3 */
-  }
-}
-
-/*
- * Re-set default cursor for disabled elements.
- */
-
-button[disabled],
-html input[disabled] {
-  @if $normalize-form-elements {
-    cursor: default;
-  }
-}
-
-/*
- * Remove inner padding and border in Firefox 4+.
- */
-
-button::-moz-focus-inner,
-input::-moz-focus-inner {
-  @if $normalize-form-elements {
-    border: 0;
-    padding: 0;
-  }
-}
-
-/*
- * Address Firefox 4+ setting `line-height` on `input` using `!important` in
- * the UA stylesheet.
- */
-
-input {
-  @if $normalize-form-elements {
-    line-height: normal;
-  }
-}
-
-/*
- * It's recommended that you don't attempt to style these elements.
- * Firefox's implementation doesn't respect box-sizing, padding, or width.
- *
- * 1. Address box sizing set to `content-box` in IE 8/9/10.
- * 2. Remove excess padding in IE 8/9/10.
- * 3. Counter reset bottom alignment in box-model reset.
- */
-
-input[type="checkbox"],
-input[type="radio"] {
-  @if $normalize-form-elements {
-    box-sizing: border-box; /* 1 */
-    padding: 0; /* 2 */
-    vertical-align: baseline; /* 3 */
-  }
-}
-
-/*
- * Fix the cursor style for Chrome's increment/decrement buttons. For certain
- * `font-size` values of the `input`, it causes the cursor style of the
- * decrement button to change from `default` to `text`.
- */
-
-input[type="number"]::-webkit-inner-spin-button,
-input[type="number"]::-webkit-outer-spin-button {
-  @if $normalize-form-elements {
-    height: auto;
-  }
-}
-
-/*
- * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
- * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
- *    (include `-moz` to future-proof).
- */
-
-input[type="search"] {
-  @if $normalize-form-elements {
-    appearance: textfield; /* 1 */
-  }
-}
-
-/*
- * Remove inner padding and search cancel button in Safari and Chrome on OS X.
- * Safari (but not Chrome) clips the cancel button when the search input has
- * padding (and `textfield` appearance).
- */
-
-input[type="search"]::-webkit-search-cancel-button,
-input[type="search"]::-webkit-search-decoration {
-  @if $normalize-form-elements {
-    appearance: none;
-  }
-}
-
-/*
- * Define consistent border, margin, and padding.
- */
-
-fieldset {
-  @if $normalize-fieldset {
-    border: $fieldset-border;
-    margin: $fieldset-margin;
-    padding: $fieldset-padding;
-  }
-}
-
-/*
- * 1. Correct `color` not being inherited in IE 8/9/10/11.
- * 2. Remove padding so people aren't caught out if they zero out fieldsets.
- */
-
-legend {
-  @if $normalize-legend {
-    border: 0; /* 1 */
-    padding: 0; /* 2 */
-  }
-}
-
-/*
- * Remove default vertical scrollbar in IE 8/9/10/11.
- */
-
-textarea {
-  @if $normalize-textarea {
-    overflow: auto;
-  }
-}
-
-
-/* Tables
-   ========================================================================== */
-
-/*
- * Remove most spacing between table cells.
- */
-
-table {
-  @if $reset-table {
-    border-collapse: collapse;
-    border-spacing: 0;
-  }
-}
-
-td,
-th {
-  @if $reset-table {
-    padding: 0;
-  }
-}
-
-/*
- * Set consistent quote types.
- */
-
-q {
-  @if $normalize-quote-quotes
-  {
-    quotes: "\201C" "\201D" "\2018" "\2019";
-  }
-}
-
-/*
- * Apply a bottom margin of one line-height to any element in this comma
- * separated list.
- */
-
-@if length($single-direction-elements)>0 {
-  #{implode($single-direction-elements, ", ")} {
-    margin: 0 0 $default-line-height;
-  }
-}
+@include get-selectors($base-collection);