vimo-dt/lib/components/textarea/backup/textarea.less

A Vue2.x UI Project For Mobile & HyBrid

@import "../../../themes/index.less";

// Textarea Wrapper
// --------------------------------------------------

.ion-textarea {
  position: relative;
  display: block;

  flex: 1;

  width: 100%;
  line-height: 130%;
}

// Textarea Within An Item
// --------------------------------------------------

.ion-item.item-textarea {
  align-items: stretch;
}

// Native Text Textarea
// --------------------------------------------------
.ion-textarea {
  .text-input {
    .appearance(none);
    display: inline-block;

    flex: 1;

    width: 92%;
    width: ~'calc(100% - 10px)';

    border: 0;
    border-radius: 0;
    background: transparent;
  }

  .text-input[disabled] {
    opacity: .4;
  }
  textarea.text-input {
    display: block;
    position: relative;
  }
  .text-input:-webkit-autofill {
    background-color: transparent;
  }

  textarea.text-input {
    resize: none;
  }
}

.input-has-focus {
  pointer-events: none;
}

.input-has-focus input,
.input-has-focus textarea,
.input-has-focus a,
.input-has-focus button {
  pointer-events: auto;
}

// Textarea Count
// --------------------------------------------------
.ion-textarea {
  .input-count {
    position: absolute;
    bottom: 0;
    right: 0;
    font-size: 12px;
    color: #bbb;
    padding-right: 5px;
    span {
      color: #000;
    }
  }

}