@braineet/ui/dist/cjs/components/upload/Dropzone/styles.js

Braineet design system

"use strict";

exports.__esModule = true;
exports.UploadContainer = void 0;
var _styledComponents = _interopRequireDefault(require("styled-components"));
var _styledSystem = require("styled-system");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } /* eslint-disable import/prefer-default-export */
var uploadDropzoneActiveStyles = function uploadDropzoneActiveStyles(p) {
  return {
    border: "2px dashed " + p.theme.colors.brand,
    background: p.theme.colors.brand10,
    color: p.theme.colors.brand90
  };
};
var uploadDropzoneStyles = function uploadDropzoneStyles(p) {
  return {
    position: 'relative',
    width: '100%',
    height: '100%',
    display: 'flex',
    textAlign: 'center',
    background: '#fafafa',
    border: '2px dashed #d9d9d9',
    borderRadius: '4px',
    cursor: 'pointer',
    transition: 'border-color 0.3s, background 0.3s',
    flexDirection: 'column',
    alignItems: 'center',
    '&:hover': !p.disabled && _extends({}, uploadDropzoneActiveStyles(p))
  };
};
var UploadContainer = exports.UploadContainer = _styledComponents.default.div.withConfig({
  displayName: "styles__UploadContainer",
  componentId: "sc-1w3dynh-0"
})(["position:relative;", " ", " .upload-dropzone{", " ", " ", " ", "}.upload-dropzone-texts{", "}", ""], _styledSystem.layout, (0, _styledSystem.variant)({
  prop: 'size',
  variants: {
    full: {
      height: '100%'
    }
  }
}), _styledSystem.space, uploadDropzoneStyles, (0, _styledSystem.variant)({
  prop: 'size',
  variants: {
    full: {
      justifyContent: 'center'
    },
    small: {
      flexDirection: 'row'
    }
  }
}), function (p) {
  return p.isDragActive && uploadDropzoneActiveStyles;
}, (0, _styledSystem.variant)({
  prop: 'size',
  variants: {
    small: {
      display: 'flex',
      flexDirection: 'column',
      marginLeft: '1rem',
      alignItems: 'flex-start'
    }
  }
}), function (p) {
  return p.disabled && "\n        opacity: 0.4;\n        .upload-dropzone {\n            cursor: not-allowed;\n        }\n    ";
});