survivalkit 1.0.beta.1 → 1.0.beta.2

data/templates/shared/partials/04-base/_all.scss

@@ -0,0 +1,8 @@
+@import "font-face";
+@import "common";
+@import "headers";
+@import "images";
+@import "semantics";
+@import "form-defaults";
+@import "tables";
+@import "edits";

data/templates/shared/partials/04-base/_common.scss

@@ -0,0 +1,137 @@
+@if $animate-all-the-things == true {
+  @include transition-all;
+}
+
+////////////////////////////
+// DEFAULT BOX SIZING TO BORDER BOX
+// see: http://paulirish.com/2012/box-sizing-border-box-ftw/
+////////////////////////////
+* {
+  @include box-sizing("border-box");
+}
+
+@if $init-type != normalize {
+  html {
+    @if $establish-baseline != true {
+      font-size: 100%;
+    }
+    overflow-y: scroll;
+    -webkit-text-size-adjust: 100%;
+    -ms-text-size-adjust: 100%;
+  }
+}
+
+// Body -------------------------------------------------------------- */
+
+// Establish baseline rhythm
+// from compass/typography/_vertical_rhythm
+@if $establish-baseline {
+  @include establish-baseline;
+}
+
+body {
+  font-family: $font-body;
+  color: $text-color;
+  background: $background-color;
+}
+
+@if $pixel-normalize {
+  @include pixel-normalize;
+}
+
+// Selected Text -------------------------------------------------------------- */
+// -moz- must be declared separately
+
+::-moz-selection {
+  @include accessible-color($alt-color);
+  background: $alt-color;
+  text-shadow: none;
+}
+
+::selection {
+  @include accessible-color($alt-color);
+  background: $alt-color;
+  text-shadow: none;
+}
+
+// Links -------------------------------------------------------------- */
+a {
+  @include link-colors($link-normal, $link-hover, $link-active, $link-visited, $link-focus);
+  @if $border-links == true {
+    @include border-links($link-border-normal, $link-border-hover, $link-border-active, $link-border-visited);
+  }
+  @if $link-transitions != false {
+    @include link-transitions($link-transitions);
+  }
+}
+
+em {
+  @extend %italic;
+}
+
+strong {
+  @extend %bold;
+}
+
+p {
+  @include trailer;
+}
+
+hr {
+  // add your own styles, if you like
+}
+
+pre {
+  @extend %mono;
+  white-space: pre;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+  line-height: 1;
+}
+
+blockquote {
+  // add your own styles, if you like
+}
+
+// Lists -------------------------------------------------------------- */
+
+ol, ul {
+  // @include trailer;
+  // padding-left: $kit-gutter;
+}
+
+dl {
+  margin-left: 0;
+}
+
+ol {
+  list-style: decimal;
+}
+
+ul {
+  list-style: disc;
+  li & {
+    list-style-type: circle;
+  }
+}
+
+dt {
+  // add your own styles, if you like
+}
+
+dd {
+  // add your own styles, if you like
+}
+
+//
+figure {
+  // add your own styles, if you like
+}
+
+figcaption {
+  // add your own styles, if you like
+}
+
+address {
+  @extend %italic;
+}

data/templates/shared/partials/04-base/_edits.scss

@@ -0,0 +1,8 @@
+ins {
+  text-decoration: none;
+  border-bottom: 1px solid $border-color;
+}
+
+del {
+  text-decoration: line-through;
+}

data/templates/shared/partials/04-base/_font-face.scss

@@ -0,0 +1,14 @@
+// import font files using @font-face,
+// if not using a service such as typekit */
+//
+// uncomment and customize with your own fonts
+
+// @include font-face(
+//   myfont,
+//   font-files(
+//     'myfont-bold-webfont.woff',
+//     'myfont-bold-webfont.ttf',
+//     'myfont-bold-webfont.svg'),
+//   'myfont-bold-webfont.eot',
+//   'bold',
+//   'normal');

data/templates/shared/partials/04-base/_form-defaults.scss

@@ -0,0 +1,70 @@
+// Forms -------------------------------------------------------------- */
+
+@if $kit-form-defaults == true {
+  fieldset {
+    @include trailer;
+    @include rhythm-borders(1px);
+    border-color: $border-color;
+    border-style: dotted;
+  }
+
+  legend {
+    padding: 0 0.25em;
+  }
+
+  label {
+    cursor: pointer;
+  }
+
+  label {
+    font-weight: bold;
+    margin-right: 0.5em;
+  }
+
+  %textinput {
+    @extend %constrain-to-parent;
+    @include adjust-font-size-to($base-font-size, 1);
+    @include rhythm-borders(1px, 0.25, $base-font-size);
+    border-width: 1px;
+    @include trailer(0.5);
+    margin-top: 0;
+    border-color: $border-color;
+    height: $base-line-height / $base-font-size * 1.5em;
+  }
+
+  textarea {
+    @extend %textinput;
+    height: $base-line-height / $base-font-size * 6.5;
+  }
+
+  input {
+    &[type=text], &[type=password], &[type=email], &[type=url], &[type=tel],
+    &[type=date], &[type=datetime], &[type=datetime-local], &[type=month], &[type=week], &[type=time],
+    &[type=number], &[type=range], &[type=search], &[type=color] {
+      @extend %textinput;
+    }
+    // reset webkit search styles
+    &[type=search] {
+      -webkit-appearance: none;
+      &::-webkit-search-decoration {
+        display: none;
+      }
+    }
+  }
+
+  textarea {
+    // add your own styles, if you like
+  }
+
+  input {
+    &[type="radio"], &[type="checkbox"] {
+      margin-left: 0.25em;
+      margin-right: 0.25em;
+    }
+  }
+
+  textarea, input:not([type="radio"]) {
+    @extend %constrain-to-parent;
+  }
+
+}

data/templates/shared/partials/04-base/_headers.scss

@@ -0,0 +1,89 @@
+// Headings -------------------------------------------------------------- */
+
+%h1, %h2, %h3, %h4, %h5, %h6 {
+  @extend %headers;
+  font-weight: normal;
+  text-rendering: optimizeLegibility;
+}
+
+%h1 {
+  @if $adjust-font-size-to == true {
+    @include adjust-font-size-to(nth($header-sizes, 1));
+  }
+  @else {
+    font-size: nth($header-sizes, 1);
+  }
+}
+
+%h2 {
+  @if $adjust-font-size-to == true {
+    @include adjust-font-size-to(nth($header-sizes, 2));
+  }
+  @else {
+    font-size: nth($header-sizes, 2);
+  }
+}
+
+%h3 {
+  @if $adjust-font-size-to == true {
+    @include adjust-font-size-to(nth($header-sizes, 3));
+  }
+  @else {
+    font-size: nth($header-sizes, 3);
+  }
+}
+
+%h4 {
+  @if $adjust-font-size-to == true {
+    @include adjust-font-size-to(nth($header-sizes, 4));
+  }
+  @else {
+    font-size: nth($header-sizes, 4);
+  }
+}
+
+%h5 {
+  @if $adjust-font-size-to == true {
+    @include adjust-font-size-to(nth($header-sizes, 5));
+  }
+  @else {
+    font-size: nth($header-sizes, 5);
+  }
+}
+
+%h6 {
+  @if $adjust-font-size-to == true {
+    @include adjust-font-size-to(nth($header-sizes, 6));
+  }
+  @else {
+    font-size: nth($header-sizes, 6);
+  }
+}
+
+h1 {
+  @extend %h1;
+}
+
+h2 {
+  @extend %h2;
+}
+
+h3 {
+  @extend %h3;
+}
+
+h4 {
+  @extend %h4;
+}
+
+h5 {
+  @extend %h5;
+}
+
+h6 {
+  @extend %h6;
+}
+
+@if $header-ampersands == true {
+  @include header-ampersands;
+}

data/templates/shared/partials/04-base/_images.scss

@@ -0,0 +1,19 @@
+// Images -------------------------------------------------------------- */
+
+img {
+  @extend %constrain-to-parent;
+  height: auto;
+  vertical-align: text-bottom;
+  @if $init-type != normalize {
+    border: 0;
+    -ms-interpolation-mode: bicubic;
+  }
+  &.left {
+    float: left;
+    margin: $kit-baseline-half $kit-gutter $kit-baseline-half 0;
+  }
+  &.right {
+    float: right;
+    margin: $kit-baseline-half 0 $kit-baseline-half $kit-gutter;
+  }
+}

data/templates/shared/partials/04-base/_semantics.scss

@@ -0,0 +1,109 @@
+small {
+  @include adjust-font-size-to(ms(-1));
+}
+
+s {
+  // add your own styles, if you like
+}
+
+cite {
+  @extend %italic;
+}
+
+q {
+  @extend %italic;
+  quotes: "“" "”";
+  &:before {
+    content: open-quote;
+  }
+  &:after {
+    content: close-quote;
+  }
+}
+
+dfn {
+  @extend %bold;
+  @extend %italic;
+}
+
+abbr, acronym {
+  border-bottom: 1px dotted;
+  cursor: help;
+}
+
+time {
+  // add your own styles, if you like
+}
+
+code {
+  @extend %mono;
+}
+
+var {
+  // add your own styles, if you like
+}
+
+samp {
+  // add your own styles, if you like
+}
+
+kbd {
+  @extend %mono;
+}
+
+tt {
+  @extend %mono;
+}
+
+sup, sub {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+
+sup {
+  top: -0.5em;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+i {
+  @extend %italic;
+}
+
+b {
+  @extend %bold;
+}
+
+u {
+  // add your own styles, if you like
+}
+
+mark {
+  background: $red;
+  background-color: rgba($yellow, 0.5);
+  text-shadow: none;
+}
+
+ruby {
+  // add your own styles, if you like
+}
+
+rt {
+  // add your own styles, if you like
+}
+
+rp {
+  // add your own styles, if you like
+}
+
+bdi {
+  // add your own styles, if you like
+}
+
+bdo {
+  // add your own styles, if you like
+}