tao_form 0.2.3 → 1.0.0.beta.1

data/lib/assets/stylesheets/tao/form/fields/moment_picker/segments/month_segment.scss

@@ -1,15 +0,0 @@
-@import 'tao/form/globals';
-@import 'tao/form/shared/fields/moment_picker/segments/month_segment';
-
-.tao-moment-picker-month-segment {
-  .month-list {
-    width: 15rem;
-
-    .month {
-      &:focus,
-      &:hover {
-        background: $grey-bg-color;
-      }
-    }
-  }
-}

data/lib/assets/stylesheets/tao/form/fields/moment_picker/segments/year_segment.scss

@@ -1,15 +0,0 @@
-@import 'tao/form/globals';
-@import 'tao/form/shared/fields/moment_picker/segments/year_segment';
-
-.tao-moment-picker-year-segment {
-  .year-list {
-    width: 15rem;
-
-    .year {
-      &:focus,
-      &:hover {
-        background: $grey-bg-color;
-      }
-    }
-  }
-}

data/lib/assets/stylesheets/tao/form/fields/radio.scss

@@ -1,33 +0,0 @@
-@import 'tao/form/globals';
-@import 'tao/form/shared/fields/radio';
-
-.tao-radio-button {
-  .radio-wrapper {
-    &:hover {
-      border-color: #69D061;
-
-      .icon-radio {
-        background-color: #69D061;
-      }
-    }
-
-    &:focus {
-      border-color: #63D65C;
-      box-shadow: 0px 0px 4px 0px rgba(#4A90E2, 0.5);
-      outline: none;
-    }
-  }
-
-  input[type=radio] {
-    &:checked + .radio-wrapper {
-      &:hover {
-        border-color: #63D65C;
-
-        .icon-radio {
-          background-color: #69D061;
-        }
-      }
-    }
-  }
-
-}

data/lib/assets/stylesheets/tao/form/fields/select/index.scss

@@ -1,14 +0,0 @@
-//= require_self
-//= require_tree ./
-
-@import 'tao/form/globals';
-
-.tao-select {
-  display: inline-block;
-  width: $form-field-width;
-  position: relative;
-
-  &[multiple] {
-    width: auto;
-  }
-}

data/lib/assets/stylesheets/tao/form/fields/select/list.scss

@@ -1,55 +0,0 @@
-@import 'tao/form/globals';
-@import 'tao/form/shared/fields/select/list';
-
-.tao-select-list {
-  display: none;
-  flex-direction: column;
-  position: absolute;
-  top: 100%;
-  left: 0;
-  min-width: 100%;
-  border: 1px solid $border-color;
-  box-shadow: 0 0 6px 0 rgba(0,0,0,0.2);
-  z-index: $z-index-popover;
-  margin-top: $select-list-offset;
-
-  &[active] {
-    display: flex;
-  }
-
-  &[direction='up'] {
-    flex-direction: column-reverse;
-    top: auto;
-    bottom: 100%;
-    margin-top: 0;
-    margin-bottom: $select-list-offset;
-
-    .search-input {
-      border-top: 1px solid $border-color;
-      border-bottom: none;
-    }
-
-    .options-list {
-      flex-direction: column-reverse;
-
-      .option {
-        border-bottom: none;
-        border-top: 1px solid $border-color;
-
-        &:last-child {
-          border-top: none;
-        }
-      }
-    }
-  }
-
-  .list-wrapper {
-    max-height: 8 * $select-option-height;
-    flex: 0 0 auto;
-  }
-
-  .options-list {
-    display: flex;
-    flex-direction: column;
-  }
-}

data/lib/assets/stylesheets/tao/form/fields/select/multiple_result.scss

@@ -1,76 +0,0 @@
-@import 'tao/form/globals';
-@import 'tao/form/shared/fields/select/multiple_result';
-
-.tao-multiple-select-result {
-  min-width: $form-field-width;
-  padding-top: 0.125rem;
-
-  .selected-item {
-    &:hover {
-      background: $white-color;
-      border-color: $red-color;
-
-      .icon-close {
-        fill: $red-color;
-      }
-    }
-
-    &:focus {
-      box-shadow: 0px 0px 2px 0px rgba($border-color, 0.5);
-    }
-  }
-
-  .link-add {
-    display: flex;
-    align-items: center;
-    align-content: center;
-    flex: 0 0 auto;
-    padding: 0 0.625rem 0 0.5rem;
-    margin: $select-item-margin;
-    height: $select-item-height;
-    border: 1px dashed $border-color;
-    background: $white-color;
-    border-radius: $border-radius-s;
-    color: $text-color;
-    font-size: $select-item-font-size;
-    text-decoration: none;
-    outline: none;
-
-    .icon-add {
-      font-size: 1rem;
-      fill: $lighter-grey-color;
-      margin: 0 0.25rem 0 0;
-    }
-
-    .text {
-      line-height: 1.5rem;
-    }
-
-    &:focus {
-      box-shadow: 0px 0px 2px 0px rgba($border-color, 0.5);
-    }
-  }
-
-  &[active] .link-add,
-  .link-add:hover {
-    color: $link-color;
-    border-color: $form-field-active-border-color;
-
-    .icon-add {
-      fill: $link-color;
-    }
-  }
-
-  &.disabled {
-    .selected-item {
-      &:hover {
-        background-color: $grey-bg-color;
-        border-color: $grey-bg-color;
-      }
-    }
-
-    .link-add {
-      display: none;
-    }
-  }
-}

data/lib/assets/stylesheets/tao/form/fields/select/result.scss

@@ -1,101 +0,0 @@
-@import 'tao/form/globals';
-
-.tao-select-result {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  background: $white-color;
-  border: 1px solid $border-color;
-  border-radius: $border-radius-s;
-  transition: border-color 300ms;
-  cursor: pointer;
-
-  &:hover {
-    border-color: $form-field-active-border-color;
-  }
-
-  &[active],
-  &:focus {
-    border-color: $form-field-active-border-color;
-    outline: none;
-  }
-
-  &[disabled] {
-    cursor: not-allowed;
-    background: $grey-bg-color;
-    border-color: $light-border-color;
-
-    &[selected][clearable] .link-clear {
-      display: none;
-    }
-
-    .selected-text {
-      color: $lightest-grey-color;
-    }
-  }
-
-  select {
-    display: none;
-  }
-
-  .placeholder,
-  .selected-text {
-    padding: $form-field-padding-v $form-field-padding-h;
-    font-size: $form-field-font-size;
-    line-height: $form-field-line-height;
-    min-height: $form-field-height - 0.125rem;
-  }
-
-  .placeholder {
-    color: $lightest-grey-color;
-  }
-
-  .selected-text {
-    color: $form-field-text-color;
-    display: none;
-  }
-
-  .icon-wrapper,
-  .link-clear {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    flex: 0 0 auto;
-    width: $form-field-height - 0.125rem;
-    height: $form-field-height - 0.125rem;
-    fill: $lighter-grey-color;
-  }
-
-  .link-clear {
-    display: none;
-    text-decoration: none;
-    outline: none;
-
-    &:hover {
-      fill: $grey-color;
-    }
-  }
-
-  &[selected] {
-    .placeholder {
-      display: none;
-    }
-
-    .selected-text {
-      display: block;
-    }
-
-    &[clearable] {
-      &[active],
-      &:hover {
-        .link-clear {
-          display: flex;
-        }
-
-        .arrow-icon-wrapper {
-          display: none;
-        }
-      }
-    }
-  }
-}

data/lib/assets/stylesheets/tao/form/fields/switch.scss

@@ -1,14 +0,0 @@
-@import 'tao/form/globals';
-@import 'tao/form/shared/fields/switch';
-
-.tao-switch {
-  .switch-wrapper {
-    outline: none;
-
-    &:focus {
-      .switch-toggle {
-        box-shadow: 0px 0px 4px 0px rgba(#4A90E2, 0.5);
-      }
-    }
-  }
-}

data/lib/assets/stylesheets/tao/form/index.scss

@@ -1,5 +0,0 @@
-//= require tao/ui
-//= require ./reset
-//= require ./layouts
-//= require ./inputs
-//= require ./fields

data/lib/assets/stylesheets/tao/form/inputs/boolean.scss

@@ -1,8 +0,0 @@
-@import 'tao/form/globals';
-@import 'tao/form/shared/inputs/boolean';
-
-.tao-form .boolean-field {
-  height: $form-field-height;
-  display: flex;
-  align-items: center;
-}

data/lib/assets/stylesheets/tao/form/inputs/group.scss

@@ -1,2 +0,0 @@
-@import 'tao/form/globals';
-@import 'tao/form/shared/inputs/group';

data/lib/assets/stylesheets/tao/form/inputs/index.scss

@@ -1 +0,0 @@
-//= require_tree ./

data/lib/assets/stylesheets/tao/form/inputs/text.scss

@@ -1,2 +0,0 @@
-@import 'tao/form/globals';
-@import 'tao/form/shared/inputs/text';

data/lib/assets/stylesheets/tao/form/layouts/default.scss

@@ -1,146 +0,0 @@
-@import 'tao/form/globals';
-
-.tao-form {
-  display: block;
-  margin: 2em 0 0 0;
-
-  form {
-    fieldset {
-      border: none;
-      padding: 0;
-      margin: 0 0 2em 0;
-
-      legend {
-        font-size: $font-size-l;
-        margin: 0 0 1.5em 0;
-      }
-    }
-
-    & > .error {
-      display: block;
-      margin-bottom: 2em;
-      font-size: $font-size-s;
-      padding: 1em;
-      color: $red-color;
-      border: 1px solid $red-color;
-      border-radius: $border-radius-s;
-      text-align: center;
-    }
-
-    .form-input {
-      display: flex;
-      align-items: flex-start;
-      align-content: flex-start;
-      margin: 0 0 0.75rem 0;
-
-      &:last-child {
-        margin-bottom: 0;
-      }
-
-      .input-label {
-        display: block;
-        width: $form-label-width;
-        flex: 0 0 auto;
-        padding: $form-field-padding-v 0;
-        text-align: right;
-        margin: 0 $form-field-margin-h 0 0;
-        line-height: $form-label-line-height;
-        font-size: $form-label-font-size;
-        color: $lighter-grey-color;
-
-        &.required abbr {
-          text-decoration: none;
-          color: $red-color;
-          border: none;
-        }
-      }
-
-
-      .input-content {
-        min-height: $form-field-height;
-
-        .input-field-wrapper {
-          margin-bottom: 0.75rem;
-
-          &:last-child {
-            margin-bottom: 0;
-          }
-        }
-
-        .input-field-placeholder {
-          display: inline-block;
-          width: $form-field-width;
-          padding: $form-field-padding-v $form-field-padding-h;
-          line-height: $form-field-line-height;
-          font-size: $form-field-font-size;
-          color: $text-color;
-        }
-
-        .input-field {
-          font-size: $form-field-font-size;
-        }
-
-        & > .bottom-hint {
-          display: block;
-          color: $lighter-grey-color;
-          margin: 0.375rem 0;
-          font-size: $form-hint-font-size;
-        }
-
-        & > .error {
-          color: $red-color;
-          margin: 0.375rem 0;
-          font-size: $form-hint-font-size;
-        }
-      }
-
-      & > .hint {
-        opacity: 0;
-        color: $lighter-grey-color;
-        margin: 0 0 0 $form-field-margin-h;
-        padding: $form-field-padding-v 0;
-        font-size: $form-hint-font-size;
-        line-height: $form-field-line-height;
-        transition: 200ms opacity;
-      }
-
-      &.input-with-errors .input-content .input-field {
-        border-color: $red-color;
-      }
-
-      &:hover, &.focus {
-        .hint {
-          opacity: 1;
-        }
-      }
-    }
-
-    .form-buttons {
-      margin: 2rem 0 0 $form-label-width + $form-field-margin-h;
-
-      .success-message {
-        display: inline-flex;
-        align-items: center;
-        justify-content: center;
-        padding: $button-padding;
-        font-size: $button-font-size;
-        line-height: $button-line-height;
-        border-radius: $border-radius-s;
-        text-align: center;
-        vertical-align: middle;
-        background: $white-color;
-        border: 1px solid $green-color;
-        color: $green-color;
-        fill: $green-color;
-
-        .icon {
-          margin: 0 0.4em 0 0;
-        }
-      }
-    }
-  }
-
-  &.form-without-label form .form-buttons {
-    margin-left: 0;
-  }
-}