kwikid-components-react/components/kwikui/inputs/textarea/Textarea.style.js

KwikID's Component Library in React

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.KwikUIStyleTextareaWrapper = exports.KwikUIStyleTextareaMessagesContainer = exports.KwikUIStyleTextareaLabel = exports.KwikUIStyleTextareaContainer = void 0;
var _styledComponents = _interopRequireDefault(require("styled-components"));
var _Input = require("../../../../shared/styles/Input.style");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const KwikUIStyleTextareaWrapper = exports.KwikUIStyleTextareaWrapper = _styledComponents.default.div`
  display: flex;
  flex-direction: column;
  align-content: flex-start;
  justify-content: flex-start;
  align-items: flex-start;

  & > *:not(:last-child) {
    margin-bottom: 0.5rem;
  }
`;
const KwikUIStyleTextareaLabel = exports.KwikUIStyleTextareaLabel = _styledComponents.default.label`
  ${_Input.KwikUIStyleInputLabel}

  position: absolute;
  top: 0px;
  margin-left: -0.15rem;
  transform: translate(0px, -50%);
`;
const KwikUIStyleTextareaContainer = exports.KwikUIStyleTextareaContainer = _styledComponents.default.div`
  ${_Input.KwikUIStyleInputContainerBase}
  ${_Input.KwikUIStyleInputStatus}
  ${_Input.KwikUIStyleInputContainerDisabled}
  ${_Input.KwikUIStyleInputContainerSize}
  ${_Input.KwikUIStyleInputContainerShape}
  #prefix {
    ${_Input.KwikUIStyleInputPrefix}
  }
  #postfix {
    ${_Input.KwikUIStyleInputPostfix}
  }

  textarea {
    ${_Input.KwikUIStyleInputReset}
    ${_Input.KwikUIStyleInputBase}
    ${_Input.KwikUIStyleInputSize}
    &::placeholder {
      ${_Input.KwikUIStyleInputPlaceholder}
    }

    resize: vertical;
    height: auto;
    line-height: unset;
  }
`;
const KwikUIStyleTextareaMessagesContainer = exports.KwikUIStyleTextareaMessagesContainer = _styledComponents.default.div`
  width: 100%;
  margin-left: 0.25rem;
  font-size: 0.9rem;
`;