activeadmin_blaze_theme 0.1.0

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.trees.scss

@@ -0,0 +1,39 @@
+@import "mixins/settings.global";
+
+.c-tree {
+  display: block;
+  margin: $tree-margin;
+  padding: $tree-padding;
+  list-style: none;
+
+  .c-tree {
+    padding: $tree-nested-padding;
+  }
+}
+
+.c-tree__item {
+  padding: $tree-item-padding;
+
+  &:before {
+    display: inline-block;
+    padding: $tree-item-indicator-padding;
+    transform-origin: 30% 50%;
+    color: $tree-item-indicator-color;
+    content: "–";
+  }
+}
+
+.c-tree__item--expandable {
+  &:before {
+    color: $tree-item-expandable-indicator-color;
+    content: "\276F";
+  }
+}
+
+.c-tree__item--expanded {
+  &:before {
+    transform: rotate(90deg);
+    color: $tree-item-expanded-indicator-color;
+    content: "\276F";
+  }
+}

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.typography.scss

@@ -0,0 +1,94 @@
+@import "mixins/components.typography";
+
+.c-text {
+  color: $text-color;
+  font-family: $text-font-family;
+  font-weight: $text-font-weight;
+  line-height: $text-line-height;
+}
+
+.c-text--mono {
+  font-family: $text-font-family-mono;
+}
+
+.c-text--highlight {
+  @include text--highlight;
+}
+
+.c-text--quiet {
+  color: $color-quiet;
+}
+
+.c-text--loud {
+  font-weight: $text-font-weight-heavy;
+}
+
+.c-text--help[title] {
+  border-bottom: $help-border-bottom;
+  cursor: help;
+}
+
+.c-pre {
+  margin: 0;
+}
+
+.c-code {
+  @include code;
+}
+
+.c-code--multiline {
+  display: block;
+  padding: $spacing-small $spacing-medium;
+  border-radius: $border-radius;
+  white-space: pre;
+  overflow-x: auto;
+}
+
+.c-kbd {
+  @include code($keyboard-color, $keyboard-background-color);
+  border-bottom: $keyboard-border;
+  border-radius: $keyboard-border-radius;
+}
+
+.c-blockquote {
+  @include quotation--color;
+  display: block;
+  margin: $quotation-margin;
+  padding: $quotation-padding;
+  font-family: $quotation-font-family;
+}
+
+.c-blockquote--brand {
+  @include quotation--color($quotation-brand-border-color);
+}
+
+.c-blockquote--info {
+  @include quotation--color($quotation-info-border-color);
+}
+
+.c-blockquote--warning {
+  @include quotation--color($quotation-warning-border-color);
+}
+
+.c-blockquote--success {
+  @include quotation--color($quotation-success-border-color);
+}
+
+.c-blockquote--error {
+  @include quotation--color($quotation-error-border-color);
+}
+
+.c-blockquote__body {
+  @include paragraph;
+  font-size: $quotation-font-size;
+}
+
+.c-blockquote__footer {
+  @include paragraph;
+  color: $quotation-footer-color;
+  font-style: $quotation-footer-font-style;
+}
+
+.c-paragraph {
+  @include paragraph;
+}

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/generics.global.scss

@@ -0,0 +1,13 @@
+html {
+  box-sizing: border-box;
+}
+
+*,
+*:before,
+*:after {
+  box-sizing: inherit;
+}
+
+body {
+  margin: 0;
+}

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.alerts.scss

@@ -0,0 +1,6 @@
+@import "settings.global";
+
+@mixin alert-color($background-color: $alert-background-color, $color: $alert-color) {
+  background-color: $background-color;
+  color: $color;
+}

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.badges.scss

@@ -0,0 +1,8 @@
+@import "settings.global";
+
+// Frames and wells
+@mixin badge($background-color, $color: $badge-color, $border-color: $color) {
+  border: $badge-border-width $badge-border-style $border-color;
+  background-color: $background-color;
+  color: $color;
+}

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.buttons.scss

@@ -0,0 +1,83 @@
+@import "settings.global";
+
+@mixin button-color($background-color: $button-background-color, $color: $button-color) {
+  border: $button-border;
+  background-color: $background-color;
+  color: $color;
+
+  &.c-button--active {
+    background-color: darken($background-color, $color-tint);
+  }
+
+  &:not(:disabled) {
+    &:hover {
+      background-color: lighten($background-color, $color-tint);
+    }
+
+    &:focus {
+      border-color: $button-focus-border-color;
+      box-shadow: $button-focus-box-shadow;
+    }
+
+    &:active {
+      background-color: darken($background-color, $color-tint);
+    }
+  }
+}
+
+@mixin button-ghost($color: $button-ghost-color, $color-hover: $button-ghost-hover-color) {
+  border: $button-ghost-border-width $button-ghost-border-style $color;
+  background-color: transparent;
+  color: $color;
+
+  &.c-button--active {
+    border-color: darken($color, $color-tint);
+    background-color: darken($color, $color-tint);
+    color: $color-hover;
+  }
+
+  &:not(:disabled) {
+    &:hover {
+      background-color: $color;
+      color: $color-hover;
+    }
+
+    &:focus {
+      border-color: $button-focus-border-color;
+      box-shadow: $button-focus-box-shadow;
+    }
+
+    &:active {
+      border-color: darken($color, $color-tint);
+      background-color: darken($color, $color-tint);
+      color: $color-hover;
+    }
+  }
+}
+
+@mixin button {
+  @include button-color;
+  display: inline;
+  max-width: 100%;
+  margin: $button-margin;
+  padding: $button-padding;
+  border-radius: $button-border-radius;
+  outline: 0;
+  font-family: $button-font-family;
+  font-size: $button-font-size;
+  line-height: $button-line-height;
+  text-align: $button-text-align;
+  text-decoration: none;
+  text-overflow: ellipsis;
+  white-space: $button-white-space;
+  cursor: pointer;
+  overflow: hidden;
+  vertical-align: middle;
+  appearance: none;
+  user-select: none;
+
+  &:disabled {
+    cursor: not-allowed;
+    opacity: $button-disabled-opacity;
+  }
+}

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.inputs.scss

@@ -0,0 +1,45 @@
+@import "settings.global";
+
+@mixin label {
+  display: block;
+  width: 100%;
+  padding: $label-padding;
+  cursor: pointer;
+}
+
+@mixin field {
+  display: block;
+  width: 100%;
+  margin: $field-margin;
+  padding: $field-padding;
+  border: $field-border;
+  border-radius: $field-border-radius;
+  outline: 0;
+  background-color: $field-background-color;
+  font-family: inherit;
+  font-size: $field-font-size-medium;
+  font-weight: $field-font-weight;
+  resize: vertical;
+  appearance: none;
+
+  &:focus {
+    border-color: $field-focus-border-color;
+    box-shadow: $field-focus-box-shadow;
+  }
+}
+
+@mixin label__field {
+  @include field;
+  margin: $label-field-margin;
+}
+
+@mixin disabled {
+  color: $field-disabled-color;
+  cursor: not-allowed;
+}
+
+@mixin field--disabled {
+  @include disabled;
+  border-color: $field-disabled-border-color;
+  background-color: $field-disabled-background-color;
+}

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.links.scss

@@ -0,0 +1,22 @@
+@import "settings.global";
+
+@mixin link--color($color: $link-color) {
+  background-color: transparent;
+  color: $color;
+
+  &:not(:disabled) {
+    &:visited {
+      color: darken($color, $color-tint);
+    }
+
+    &:hover {
+      background-color: transparent;
+      color: lighten($color, $color-tint);
+    }
+
+    &:active {
+      background-color: transparent;
+      color: lighten($color, $color-tint);
+    }
+  }
+}

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.lists.scss

@@ -0,0 +1,10 @@
+@import "settings.global";
+
+@mixin list--unstyled {
+  padding: $list-unstyled-padding;
+  list-style: $list-unstyled-list-style;
+}
+
+@mixin list--inline {
+  padding: $list-inline-padding;
+}

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.navs.scss

@@ -0,0 +1,29 @@
+@import "settings.global";
+
+@mixin nav--color($background-color: $nav-background-color, $color: $nav-color) {
+  background-color: $background-color;
+  color: $color;
+}
+
+@mixin nav__item--color($background-color: $nav-item-hover-background-color, $hover-color: $nav-item-hover-color) {
+  &:not(:disabled) {
+    &:hover {
+      background-color: $background-color;
+      color: $hover-color;
+    }
+
+    &:focus {
+      box-shadow: $box-shadow-focus;
+    }
+
+    &:active {
+      background-color: darken($background-color, $color-tint);
+      color: $hover-color;
+    }
+  }
+}
+
+@mixin nav__item--active($background-color: $nav-item-active-background-color, $hover-color: $nav-item-active-color) {
+  background-color: $background-color;
+  color: $hover-color;
+}

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.ranges.scss

@@ -0,0 +1,89 @@
+@import "settings.global";
+@import "utilities.boxing";
+
+@mixin range__track {
+  width: $range-width;
+  height: $range-height;
+  border: $range-border;
+  border-radius: $range-border-radius;
+  box-shadow: $range-box-shadow;
+  cursor: pointer;
+}
+
+@mixin range__track--ms {
+  border-color: transparent;
+  background-color: transparent;
+  color: transparent;
+}
+
+@mixin range__fill--ms {
+  border: $range-border;
+  border-radius: $range-border-radius;
+  background-color: $range-background-color;
+  box-shadow: $range-box-shadow;
+}
+
+@mixin range__thumb {
+  width: $range-thumb-width;
+  height: $range-thumb-height;
+  margin: $range-thumb-margin;
+  border: $range-thumb-border;
+  border-radius: $range-thumb-border-radius;
+  background-color: $range-thumb-background-color;
+  box-shadow: $range-thumb-box-shadow;
+  cursor: pointer;
+}
+
+@mixin range__thumb--focus {
+  border-color: $range-thumb-focus-border-color;
+  box-shadow: $range-thumb-focus-box-shadow;
+}
+
+@mixin range__thumb--webkit {
+  -webkit-appearance: none;
+}
+
+@mixin range__thumb--active {
+  transform: scale(1.4);
+}
+
+@mixin range--disabled {
+  background-color: $range-disabled-background-color;
+  cursor: not-allowed;
+}
+
+@mixin range--color($track-color: $range-background-color) {
+  &:not(:disabled) {
+    &::-webkit-slider-runnable-track {
+      background-color: $track-color;
+    }
+
+    &::-moz-range-track {
+      background-color: $track-color;
+    }
+
+    &::-ms-track {
+      background-color: $track-color;
+    }
+  }
+}
+
+@mixin range--brand {
+  @include range--color($range-brand-background-color);
+}
+
+@mixin range--info {
+  @include range--color($range-info-background-color);
+}
+
+@mixin range--warning {
+  @include range--color($range-warning-background-color);
+}
+
+@mixin range--success {
+  @include range--color($range-success-background-color);
+}
+
+@mixin range--error {
+  @include range--color($range-error-background-color);
+}

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.tabs.scss

@@ -0,0 +1,5 @@
+@import "settings.global";
+
+@mixin tab-heading--color($active-color: $tab-heading-active-box-shadow-color) {
+  box-shadow: 0 -.2em 0 0 $active-color inset;
+}

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.toggles.scss

@@ -0,0 +1,6 @@
+@import "settings.global";
+@import "objects.grid";
+
+@mixin toggle__track--background-color($track-color: $toggle-track-background-color) {
+  background-color: $track-color;
+}

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.typography.scss

@@ -0,0 +1,25 @@
+@import "settings.global";
+
+@mixin text--highlight($color: $highlight-color, $background-color: $highlight-background-color) {
+  margin: 0 -$spacing-tiny;
+  padding: $spacing-xsmall $spacing-xsmall $spacing-tiny;
+  background-color: $background-color;
+  color: $color;
+}
+
+@mixin paragraph {
+  display: block;
+  margin: 0;
+  padding: $spacing-small 0;
+}
+
+@mixin code($color: $code-color, $background-color: $code-background-color) {
+  @include text--highlight($color, $background-color);
+  display: inline;
+  font-family: $text-font-family-mono;
+  font-weight: $text-font-weight;
+}
+
+@mixin quotation--color($border-color: $quotation-border-color) {
+  border-left: $quotation-border-width $quotation-border-style $border-color;
+}

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_objects.containers.scss

@@ -0,0 +1,10 @@
+@import "settings.global";
+@import "tools.mediaqueries";
+
+@mixin containers__responsive($screen-width) {
+  @each $size, $width in $screen-limits {
+    &--#{$size}\@#{$screen-width} {
+      max-width: $width;
+    }
+  }
+}

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_objects.grid.scss

@@ -0,0 +1,112 @@
+@import "settings.global";
+
+@mixin grid {
+  display: flex;
+}
+
+@mixin grid--wrap {
+  flex-wrap: wrap;
+}
+
+@mixin grid--top {
+  align-items: flex-start;
+}
+
+@mixin grid--center {
+  align-items: center;
+}
+
+@mixin grid--bottom {
+  align-items: flex-end;
+}
+
+@mixin grid__cell {
+  flex: 1;
+  padding-right: $grid-gutter;
+  padding-left: $grid-gutter;
+}
+
+@mixin grid__cell--no-gutter {
+  padding-right: .001em;
+  padding-left: .001em;
+}
+
+@mixin grid__cell--top {
+  align-self: flex-start;
+}
+
+@mixin grid__cell--center {
+  align-self: center;
+}
+
+@mixin grid__cell--bottom {
+  align-self: flex-end;
+}
+
+@mixin grid__cell--width-fixed {
+  flex: 0 1 auto;
+}
+
+@mixin grid__cell--fit {
+  flex: 1;
+}
+
+@mixin grid--full {
+  flex-wrap: wrap;
+}
+
+@mixin grid__cell--full {
+  flex: 0 0 100%;
+  max-width: 100%;
+  margin-left: 0;
+}
+
+@mixin grid__cell--hidden {
+  display: none;
+}
+
+@mixin grid__cell--visible {
+  display: initial;
+}
+
+@mixin grid__cell--width($width) {
+  flex: 0 0 $width;
+  max-width: $width;
+}
+
+@mixin grid__cells {
+  @each $width, $fraction in $grid-widths {
+    &--width-#{$width} {
+      @include grid__cell--width($fraction * 100%);
+    }
+
+    &--offset-#{$width} {
+      margin-left: $fraction * 100%;
+    }
+  }
+}
+
+@mixin grid__responsive-cells($screen-width) {
+  @each $width, $fraction in $grid-widths {
+    &--hidden\@#{$screen-width} {
+      @include grid__cell--hidden
+    }
+
+    &--visible\@#{$screen-width} {
+      @include grid__cell--visible;
+    }
+
+    &--width-#{$width}\@#{$screen-width} {
+      flex: 0 0 $fraction * 100%;
+      max-width: $fraction * 100%;
+    }
+
+    &--offset-#{$width}\@#{$screen-width} {
+      margin-left: $fraction * 100%;
+    }
+
+    &--width-fixed\@#{$screen-width} {
+      @include grid__cell--width-fixed;
+    }
+  }
+}