iatelier 0.1.3

data/lib/iatelier/assets/sass/blaze/components.navs.scss

@@ -0,0 +1,126 @@
+@import "mixins/components.navs";
+
+.c-nav {
+  @include nav--color;
+  width: $nav-width;
+  margin: $nav-margin;
+  padding: $nav-padding;
+  z-index: $nav-z-index;
+}
+
+.c-nav__item,
+.c-nav__content {
+  display: block;
+  height: $nav-height;
+  padding: 0 $nav-item-padding;
+  color: inherit;
+  line-height: $nav-height;
+  vertical-align: middle;
+
+  .o-image {
+    height: 100%;
+  }
+}
+
+.c-nav__item {
+  @include nav__item--color;
+  text-decoration: none;
+  cursor: pointer;
+}
+
+.c-nav--inline {
+  .c-nav__item,
+  .c-nav__content {
+    display: inline-block;
+  }
+
+  .c-nav__item--right,
+  .c-nav__content--right {
+    float: right;
+  }
+}
+
+.c-nav--light {
+  @include nav--color($nav-light-background-color, $nav-light-color);
+}
+
+.c-nav--top {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: auto;
+  left: 0;
+
+}
+
+.c-nav--bottom {
+  position: absolute;
+  top: auto;
+  right: 0;
+  bottom: 0;
+  left: 0;
+}
+
+.c-nav--left {
+  position: absolute;
+  top: 0;
+  right: auto;
+  bottom: 0;
+  left: 0;
+}
+
+.c-nav--right {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: auto;
+}
+
+.c-nav--fixed {
+  position: fixed;
+}
+
+.c-nav__item--active {
+  @include nav__item--active;
+}
+
+.c-nav__item--brand {
+  @include nav__item--color($nav-item-brand-hover-background-color, $nav-item-brand-hover-color);
+
+  &.c-nav__item--active {
+    @include nav__item--active($nav-item-brand-active-background-color, $nav-item-brand-active-color);
+  }
+}
+
+.c-nav__item--info {
+  @include nav__item--color($nav-item-info-hover-background-color, $nav-item-info-hover-color);
+
+  &.c-nav__item--active {
+    @include nav__item--active($nav-item-info-active-background-color, $nav-item-info-active-color);
+  }
+}
+
+.c-nav__item--warning {
+  @include nav__item--color($color-warning);
+
+  &.c-nav__item--active {
+    @include nav__item--active($nav-item-warning-active-background-color, $nav-item-warning-active-color);
+  }
+}
+
+.c-nav__item--success {
+  @include nav__item--color($color-success);
+
+  &.c-nav__item--active {
+    @include nav__item--active($nav-item-success-active-background-color, $nav-item-success-active-color);
+  }
+}
+
+.c-nav__item--error {
+  @include nav__item--color($color-error);
+
+  &.c-nav__item--active {
+    @include nav__item--active($nav-item-error-active-background-color, $nav-item-error-active-color);
+  }
+}

data/lib/iatelier/assets/sass/blaze/components.overlays.scss

@@ -0,0 +1,26 @@
+@import "mixins/settings.global";
+
+.c-overlay {
+  display: block;
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: transparentize($overlay-background-color, .6);
+  z-index: $overlay-z-index;
+}
+
+.c-overlay--fullpage {
+  position: fixed;
+}
+
+.c-overlay--transparent {
+  background-color: $overlay-transparent-background-color;
+}
+
+.c-overlay--dismissable {
+  cursor: pointer;
+}

data/lib/iatelier/assets/sass/blaze/components.pagination.scss

@@ -0,0 +1,42 @@
+@import "mixins/settings.global";
+@import "mixins/components.buttons";
+
+.c-pagination {
+  display: block;
+  width: $pagination-width;
+  padding: $pagination-padding;
+  font-size: $pagination-font-size;
+  text-align: center;
+}
+
+.c-pagination__controls {
+  display: inline-block;
+  text-align: center;
+}
+
+.c-pagination__controls--backward {
+  float: left;
+  text-align: left;
+}
+
+.c-pagination__controls--forward {
+  float: right;
+  text-align: right;
+}
+
+.c-pagination__control,
+.c-pagination__page {
+  @include button;
+  @include button-ghost($pagination-control-color);
+  min-width: 2.4em;
+  border-radius: $pagination-control-border-radius;
+}
+
+.c-pagination__page--current {
+  background-color: $pagination-page-current-background-color;
+  color: $pagination-page-current-color;
+}
+
+.c-pagination__ellipsis {
+  padding: $pagination-ellipsis-padding;
+}

data/lib/iatelier/assets/sass/blaze/components.progress.scss

@@ -0,0 +1,51 @@
+@import "mixins/settings.global";
+
+.c-progress {
+  display: block;
+  border: $progress-border;
+  border-radius: $progress-border-radius;
+  background-color: $progress-background-color;
+  color: $progress-color;
+  text-align: center;
+  overflow: hidden;
+}
+
+.c-progress--rounded {
+  border-radius: $progress-rounded-border-radius;
+}
+
+.c-progress__bar {
+  display: block;
+  height: 100%;
+  float: left;
+  border-radius: 0;
+  background-color: $progress-bar-background-color;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+}
+
+.c-progress__bar:after {
+  color: transparent !important;
+  content: "-";
+}
+
+.c-progress__bar--brand {
+  background-color: $color-brand;
+}
+
+.c-progress__bar--info {
+  background-color: $color-info;
+}
+
+.c-progress__bar--warning {
+  background-color: $color-warning;
+}
+
+.c-progress__bar--success {
+  background-color: $color-success;
+}
+
+.c-progress__bar--error {
+  background-color: $color-error;
+}

data/lib/iatelier/assets/sass/blaze/components.ranges.scss

@@ -0,0 +1,114 @@
+@import "mixins/components.ranges";
+
+.c-range {
+  @include range--color;
+  width: $range-width;
+  padding: $range-padding;
+  outline: 0;
+  -webkit-appearance: none;
+}
+
+.c-range--brand {
+  @include range--color($range-brand-background-color);
+}
+
+.c-range--info {
+  @include range--color($range-info-background-color);
+}
+
+.c-range--warning {
+  @include range--color($range-warning-background-color);
+}
+
+.c-range--success {
+  @include range--color($range-success-background-color);
+}
+
+.c-range--error {
+  @include range--color($range-error-background-color);
+}
+
+.c-range::-webkit-slider-runnable-track {
+  @include range__track;
+}
+
+.c-range::-webkit-slider-thumb {
+  @include range__thumb;
+  @include range__thumb--webkit;
+}
+
+.c-range::-moz-range-track {
+  @include range__track;
+}
+
+.c-range::-moz-range-thumb {
+  @include range__thumb;
+}
+
+.c-range::-ms-track {
+  @include range__track;
+  @include range__track--ms;
+}
+
+.c-range::-ms-fill-lower,
+.c-range::-ms-fill-upper {
+  @include range__fill--ms;
+}
+
+.c-range::-ms-thumb {
+  @include range__thumb;
+}
+
+.c-range:not(:disabled):active {
+  &::-webkit-slider-thumb {
+    @include range__thumb--active;
+  }
+
+  &::-moz-range-thumb {
+    @include range__thumb--active;
+  }
+
+  &::-ms-thumb {
+    @include range__thumb--active;
+  }
+}
+
+.c-range:focus {
+  &::-webkit-slider-thumb {
+    @include range__thumb--focus;
+  }
+
+  &::-moz-range-thumb {
+    @include range__thumb--focus;
+  }
+
+  &::-ms-thumb {
+    @include range__thumb--focus;
+  }
+}
+
+.c-range:disabled {
+  &::-webkit-slider-thumb {
+    @include range--disabled;
+  }
+
+  &::-webkit-slider-runnable-track {
+    @include range--disabled;
+  }
+
+  &::-moz-range-thumb {
+    @include range--disabled;
+  }
+
+  &::-moz-range-track {
+    @include range--disabled;
+  }
+
+  &::-ms-thumb {
+    @include range--disabled;
+  }
+
+  &::-ms-track {
+    @include range--disabled;
+  }
+}

data/lib/iatelier/assets/sass/blaze/components.tables.scss

@@ -0,0 +1,88 @@
+@import "mixins/settings.global";
+@import "mixins/objects.grid";
+
+.c-table {
+  @include grid;
+  @include grid--wrap;
+  width: $table-width;
+  margin: $table-margin;
+  padding: $table-padding;
+  border: $table-border;
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+.c-table__caption {
+  @include grid;
+  @include grid__cell--full;
+  max-width: $table-caption-max-width;
+  padding: $table-caption-padding;
+  color: $table-caption-color;
+  font-size: $table-caption-font-size;
+  text-align: $table-caption-text-align;
+}
+
+.c-table__row,
+.c-table__head,
+.c-table__body {
+  display: flex;
+  flex: 0 0 100%;
+  flex-wrap: wrap;
+  max-width: 100%;
+}
+
+.c-table--striped :not(.c-table__row--heading).c-table__row:nth-of-type(odd) {
+  background-color: $table-row-striped-background-color;
+  color: $table-row-striped-color;
+}
+
+.c-table__cell {
+  display: flex;
+  flex: 1;
+  padding: $table-cell-padding;
+  text-align: $table-cell-text-align;
+  overflow: auto;
+}
+
+.c-table__row--heading .c-table__cell {
+  display: flex;
+  flex: 1;
+  border-bottom: $table-heading-border;
+  background-color: $table-heading-background-color;
+  color: $table-heading-color;
+  font-size: $text-font-size-medium;
+  font-weight: $table-heading-font-weight;
+}
+
+.c-table--striped .c-table__row--heading .c-table__cell {
+  background-color: $table-heading-striped-background-color;
+  color: $table-heading-striped-color;
+}
+
+.c-table--clickable :not(.c-table__row--heading).c-table__row:hover .c-table__cell,
+.c-table__row--clickable:hover .c-table__cell {
+  background-color: $table-row-clickable-background-color;
+  color: $table-row-clickable-color;
+  cursor: pointer;
+}
+
+.c-table__row--disabled {
+  background-color: $table-row-disabled-background-color;
+  color: $table-row-disabled-color;
+  cursor: default;
+}
+
+.c-table--clickable :not(.c-table__row--heading).c-table__row--disabled:hover .c-table__cell,
+.c-table__row--disabled:hover .c-table__cell {
+  background-color: $table-row-disabled-background-color;
+  color: $table-row-disabled-color;
+  cursor: not-allowed;
+}
+
+.c-table--condensed {
+  font-size: $table-condensed-font-size;
+
+  .c-table__cell {
+    padding: $table-condensed-cell-padding;
+  }
+}

data/lib/iatelier/assets/sass/blaze/components.tabs.scss

@@ -0,0 +1,72 @@
+@import "mixins/components.tabs";
+
+.c-tabs {
+  display: block;
+}
+
+.c-tabs__headings {
+  display: flex;
+  text-align: $tab-headings-text-align;
+  cursor: pointer;
+}
+
+.c-tab-heading {
+  flex: 1;
+  margin: $tab-heading-margin;
+  padding: $tab-heading-padding;
+  box-shadow: 0 -.2em 0 0 $tab-heading-box-shadow-color inset;
+}
+
+.c-tabs__nav {
+  overflow: hidden;
+
+  .c-tabs__headings {
+    margin-bottom: -1em;
+    padding-bottom: 1em;
+    overflow-y: hidden;
+    overflow-x: auto;
+  }
+
+  .c-tab-heading {
+    white-space: nowrap;
+  }
+}
+
+.c-tab-heading--active {
+  @include tab-heading--color;
+}
+
+.c-tabs--brand .c-tab-heading--active {
+  @include tab-heading--color($tab-heading-brand-active-box-shadow-color);
+}
+
+.c-tabs--info .c-tab-heading--active {
+  @include tab-heading--color($tab-heading-info-active-box-shadow-color);
+}
+
+.c-tabs--warning .c-tab-heading--active {
+  @include tab-heading--color($tab-heading-warning-active-box-shadow-color);
+}
+
+.c-tabs--success .c-tab-heading--active {
+  @include tab-heading--color($tab-heading-success-active-box-shadow-color);
+}
+
+.c-tabs--error .c-tab-heading--active {
+  @include tab-heading--color($tab-heading-error-active-box-shadow-color);
+}
+
+.c-tab-heading--disabled {
+  background-color: $tab-heading-disabled-background-color;
+  color: $tab-heading-disabled-color;
+  cursor: not-allowed;
+}
+
+.c-tabs__tab {
+  display: none;
+  padding: $tab-padding;
+}
+
+.c-tabs__tab--active {
+  display: block;
+}

data/lib/iatelier/assets/sass/blaze/components.tags.scss

@@ -0,0 +1,42 @@
+@import "mixins/settings.global";
+
+.c-tags {
+  position: relative;
+  width: $tags-width;
+  text-align: $tags-text-align;
+}
+
+.c-tags .c-card--menu {
+  position: absolute;
+  width: 100%;
+}
+
+.c-tags__container {
+  display: inline-block;
+  max-width: $tags-container-width;
+  padding-right: $spacing-xsmall;
+}
+
+.c-tag {
+  display: inline-block;
+  position: relative;
+  max-width: $tags-container-width;
+  margin: $tag-margin;
+  padding: $tag-padding;
+}
+
+.c-tag__close {
+  position: absolute;
+  top: 7px;
+  right: 5px;
+  color: $tag-close-color;
+  font-weight: $tag-close-font-weight;
+}
+
+.c-tags__field-container {
+  display: inline-block;
+  position: absolute;
+  width: $tags-field-container-width;
+  margin: $tags-field-container-margin;
+  cursor: pointer;
+}

data/lib/iatelier/assets/sass/blaze/components.toggles.scss

@@ -0,0 +1,74 @@
+@import "mixins/components.toggles";
+
+.c-toggle {
+  @include grid;
+  @include grid--center;
+  width: auto;
+  cursor: pointer;
+  user-select: none;
+
+  input:not(:checked) + .c-toggle__track {
+    background-color: $toggle-track-unchecked-background-color;
+
+    .c-toggle__handle {
+      transform: translateZ(0);
+    }
+  }
+
+  input:disabled + .c-toggle__track {
+    background-color: $toggle-track-disabled-background-color;
+    cursor: not-allowed;
+
+    .c-toggle__handle {
+      background-color: $toggle-handle-disabled-background-color;
+      cursor: not-allowed;
+    }
+  }
+}
+
+.c-toggle--brand .c-toggle__track {
+  @include toggle__track--background-color($toggle-track-brand-background-color);
+}
+
+.c-toggle--info .c-toggle__track {
+  @include toggle__track--background-color($toggle-track-info-background-color);
+}
+
+.c-toggle--warning .c-toggle__track {
+  @include toggle__track--background-color($toggle-track-warning-background-color);
+}
+
+.c-toggle--success .c-toggle__track {
+  @include toggle__track--background-color($toggle-track-success-background-color);
+}
+
+.c-toggle--error .c-toggle__track {
+  @include toggle__track--background-color($toggle-track-error-background-color);
+}
+
+.c-toggle input {
+  display: none;
+}
+
+.c-toggle__track {
+  @include grid__cell;
+  @include grid__cell--width-fixed;
+  @include toggle__track--background-color;
+  position: relative;
+  width: 1em;
+  height: .5em;
+  margin: $toggle-margin;
+  border-radius: $toggle-track-border-radius;
+}
+
+.c-toggle__handle {
+  position: absolute;
+  top: -.25em;
+  left: 0;
+  width: 1em;
+  height: 1em;
+  transform: translateX(100%);
+  border-radius: $toggle-handle-border-radius;
+  background-color: $toggle-handle-background-color;
+  box-shadow: $toggle-handle-box-shadow;
+}