weex-nuke/src/node_modules/nuke-web-picker/lib/styles/index.js

基于 Rax 、Weex 的高性能组件体系 ~~

'use strict';

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var _variable = require('./variable');

var _variable2 = _interopRequireDefault(_variable);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

function styleProvider() {
  var _pickerColumn, _pickerColumnMask, _pickerColumnIndica, _pickerColumnScroll, _Picker;

  var theme = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};

  var Variables = (0, _variable2.default)(theme);
  var core = theme.Core;
  return {
    Picker: (_Picker = {
      mask: {
        backgroundColor: 'rgba(0, 0, 0, .7)'
      },
      picker: {
        position: 'fixed',
        bottom: 0,
        left: 0,
        width: 750,
        backgroundColor: Variables['background-color']
      }
    }, _defineProperty(_Picker, 'picker-toolbar', _extends({
      backgroundColor: Variables['toolbar-background-color']
    }, core.border(Variables['toolbar-line-width'], Variables['toolbar-line-style'], Variables['toolbar-line-color'], 'bottom'), {

      flexDirection: 'row',
      justifyContent: 'center',
      alignItems: 'center',
      height: Variables['toolbar-height']
    }, core.padding(0, Variables['toolbar-padding-lr']), {
      fontSize: Variables['toolbar-title-font-size']
    })), _defineProperty(_Picker, 'picker-cancel', {
      width: '20%',
      overflow: 'hidden',
      fontSize: Variables['toolbar-button-font-size'],
      textAlign: 'left',
      color: Variables['toolbar-cancel-color']
    }), _defineProperty(_Picker, 'picker-done', {
      width: '20%',
      overflow: 'hidden',
      fontSize: Variables['toolbar-button-font-size'],
      textAlign: 'right',
      color: Variables['toolbar-done-color']
    }), _defineProperty(_Picker, 'picker-title', {
      flex: 1,
      textAlign: 'center',
      overflow: 'hidden',
      textOverflow: 'ellipsis',
      whiteSpace: 'nowrap',
      color: Variables['toolbar-title-color'],
      fontSize: Variables['toolbar-title-font-size']
    }), _defineProperty(_Picker, 'picker-content', {
      flexDirection: 'row',
      height: Variables['height']
    }), _defineProperty(_Picker, 'picker-column', (_pickerColumn = {
      position: 'relative',
      width: '100%',
      height: Variables['height'],
      flex: 1,
      overflow: 'hidden'
    }, _defineProperty(_pickerColumn, '-webkit-transition', 'width ease 0.2s'), _defineProperty(_pickerColumn, 'transition', 'width ease 0.2s'), _pickerColumn)), _defineProperty(_Picker, 'picker-column-mask', (_pickerColumnMask = {
      position: 'absolute',
      left: 0,
      top: 0,
      height: '100%',
      width: '100%'
    }, _defineProperty(_pickerColumnMask, 'background-image', '-webkit-linear-gradient(top, hsla(0,0%,100%,.95), hsla(0,0%,100%,.6)), -webkit-linear-gradient(bottom,hsla(0,0%,100%,.95),hsla(0,0%,100%,.6))'), _defineProperty(_pickerColumnMask, 'background-image', 'linear-gradient(180deg, hsla(0,0%,100%,.95), hsla(0,0%,100%,.6)), linear-gradient(0deg,hsla(0,0%,100%,.95),hsla(0,0%,100%,.6))'), _defineProperty(_pickerColumnMask, 'background-position', 'top, bottom'), _defineProperty(_pickerColumnMask, 'background-size', Variables['mask-background-size']), _defineProperty(_pickerColumnMask, 'background-repeat', 'no-repeat'), _pickerColumnMask)), _defineProperty(_Picker, 'picker-column-indicator', (_pickerColumnIndica = {
      position: 'absolute',
      left: 0,
      top: Variables['indicator-top'],
      height: Variables['item-height'],
      width: '100%'
    }, _defineProperty(_pickerColumnIndica, 'background-image', '-webkit-linear-gradient(top, ' + Variables['item-line-color'] + ',' + Variables['item-line-color'] + ',transparent, transparent), -webkit-linear-gradient(bottom, ' + Variables['item-line-color'] + ',' + Variables['item-line-color'] + ',transparent, transparent)'), _defineProperty(_pickerColumnIndica, 'background-image', 'linear-gradient(to bottom, ' + Variables['item-line-color'] + ',' + Variables['item-line-color'] + ', transparent, transparent), linear-gradient(to top, ' + Variables['item-line-color'] + ',' + Variables['item-line-color'] + ',transparent, transparent)'), _defineProperty(_pickerColumnIndica, 'background-position', 'top, bottom'), _defineProperty(_pickerColumnIndica, 'background-size', '100% 1px'), _defineProperty(_pickerColumnIndica, 'background-repeat', 'no-repeat'), _pickerColumnIndica)), _defineProperty(_Picker, 'picker-column-scroll', (_pickerColumnScroll = {}, _defineProperty(_pickerColumnScroll, '-webkit-transform', 'translate3d(0, 0, 0)'), _defineProperty(_pickerColumnScroll, 'transform', 'translate3d(0, 0, 0)'), _pickerColumnScroll)), _defineProperty(_Picker, 'picker-item', {
      height: Variables['item-height'],
      lineHeight: Variables['item-height'],
      textAlign: 'center',
      overflow: 'hidden',
      textOverflow: 'ellipsis'
    }), _defineProperty(_Picker, 'picker-item-text', {
      color: Variables['item-text-color'],
      fontSize: Variables['item-font-size']
    }), _defineProperty(_Picker, 'picker-bottom-button', {
      justifyContent: 'center',
      alignItems: 'center',
      backgroundColor: Variables['bottom-button-bg-color'],
      height: Variables['bottom-button-height']
    }), _defineProperty(_Picker, 'picker-bottom-button-text', {
      color: Variables['bottom-button-color'],
      fontSize: Variables['bottom-button-font-size']
    }), _Picker)
  };
}

module.exports = styleProvider;