weex-nuke/lib/Tabbar/styles/index.js

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

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

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.js');

var _variable2 = _interopRequireDefault(_variable);

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

var commonStyle = function commonStyle(variables) {
  return {
    'nav-item-has-icon': {
      flexDirection: 'row',
      height: variables['icon-height']
    }
  };
};

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

  var Variables = (0, _variable2.default)(theme);
  var core = theme.Core;
  return {
    Tabbar: _extends({
      tabContainer: {
        position: 'absolute',
        top: 0,
        right: 0,
        bottom: 0,
        left: 0,
        display: 'flex'
      },
      tabContent: {
        display: 'flex',
        flex: 1
      },
      navBar: {
        // display: 'flex',
        flexDirection: 'row',
        height: Variables['bar-item-height'],
        // backgroundColor: '#ffffff',
        alignitems: 'center'
      },
      navBarItem: _extends({}, core.padding(0, Variables['icon-item-padding-left-right']), {
        height: Variables['bar-item-height'],
        whiteSpace: 'nowrap'
      }),
      tbiContainer: {},
      navCapsule: _extends({
        alignSelf: 'center',
        height: Variables['capsule-height']
      }, core.border(Variables['capsule-border-width'], Variables['capsule-border-style'], Variables['capsule-border-color']), {
        borderRadius: Variables['capsule-border-corner'] + 'rem'
      }),
      tabbarContent: {
        flexDirection: 'row',
        alignItems: 'center'
      },
      navItemIcon: {
        // marginBottom: Variables['icon-item-icon-margin-bottom'],
      }
    }, commonStyle(Variables)),

    Item: {
      'nav-item': {
        justifyContent: 'center',
        alignItems: 'center',
        flexDirection: 'row'
        // height: Variables['bar-item-height'],
      },
      'nav-item-top': _extends({
        height: Variables['bar-item-height']
      }, core.border(1, 'solid', '#dcdee3', 'bottom')),
      'nav-item-bottom': _extends({
        height: Variables['bar-item-height']
      }, core.border(1, 'solid', '#dcdee3', 'top')),
      'nav-item-capsule': _extends({}, core.padding(0, Variables['capsule-item-padding-left-right']), {
        // height: (Variables['capsule-height'] -2) +'rem',
        backgroundColor: Variables['capsule-item-bg-color']
      }),

      'nav-item-capsule-selected': {
        color: Variables['capsule-item-selected-color'],
        backgroundColor: Variables['capsule-item-selected-bg-color']
      },

      'nav-item-top-selected': _extends({}, core.border(1, 'solid', Variables['bar-item-selected-color'], 'bottom')),

      'nav-item-text': {
        fontSize: '28rem'
        // lineHeight: '19px',
      },
      'nav-item-top-text': {
        fontSize: '28rem'
        // lineHeight: '19px',
      },
      'nav-item-bottom-text': {
        fontSize: '28rem'
        // lineHeight: '19px',
      },
      'nav-item-capsule-text': {
        fontSize: Variables['capsule-item-font-size'] + 'rem',
        color: Variables['capsule-item-color']
      },
      'nav-item-capsule-selected-text': {
        color: Variables['capsule-item-selected-color']
      },
      'nav-item-top-selected-text': {
        color: Variables['bar-item-selected-color']
      },
      'nav-item-bottom-selected-text': {
        color: Variables['bar-item-selected-color']
      },
      'nav-item-capsule-not-first': _extends({}, core.border(Variables['capsule-separator-width'], Variables['capsule-separator-style'], Variables['capsule-border-color'], 'left'))
    }
  };
}

exports.default = styleMix;
module.exports = exports['default'];