@titaui/pc 1.9.27 → 1.9.31

package/lib/components/common-share/index.css

@@ -186,9 +186,9 @@
 
 .okr-share-mblog__container {
   width: 480px;
-  height: 420px;
+  min-height: 420px;
   background-color: #fff;
-  border-radius: 6px;
+  border-radius: 12px;
 }
 
 .okr-share-mblog__header {

package/lib/components/confidence/index.css

@@ -4,7 +4,6 @@
   justify-content: center;
   font-size: 12px;
   line-height: 18px;
-  width: 53px;
 }
 
 .titaui-kr-heart--editable {
@@ -25,7 +24,7 @@
 
 .titaui-kr-heart-icon {
   display: inline-block;
-  width: 16px;
+  min-width: 16px;
   height: 16px;
   background: url("./heart.svg") no-repeat;
   margin-right: 6px;

package/lib/components/confidence/index.js

@@ -71,7 +71,7 @@ var Confidence = function Confidence(props) {
       confidence: value
     })), /*#__PURE__*/_react["default"].createElement("span", {
       className: "".concat(popPrecls, "-score")
-    }, i, "\u5206"));
+    }, i, " ", (0, _getLocale.getLocale)('Per_Set_Form_Quantifier_Points')));
   })));
 
   if (!editable) {
@@ -83,7 +83,7 @@ var Confidence = function Confidence(props) {
       className: "titaui-kr-heart-icon"
     }), /*#__PURE__*/_react["default"].createElement("span", {
       className: "titaui-kr-heart-text"
-    }, value, " \u5206"));
+    }, value, " ", (0, _getLocale.getLocale)('Per_Set_Form_Quantifier_Points')));
   }
 
   return /*#__PURE__*/_react["default"].createElement(_tooltip["default"], {
@@ -101,7 +101,7 @@ var Confidence = function Confidence(props) {
     className: "titaui-kr-heart-icon"
   }), /*#__PURE__*/_react["default"].createElement("span", {
     className: "titaui-kr-heart-text"
-  }, value, " \u5206"))));
+  }, value, " ", (0, _getLocale.getLocale)('Per_Set_Form_Quantifier_Points')))));
 };
 
 var _default = Confidence;

package/lib/components/create-okr-modal/fields/index.css

@@ -154,6 +154,7 @@
   text-overflow: ellipsis;
   margin-right: 10px;
   word-break: keep-all;
+  white-space: nowrap;
 }
 
 .user-info .user__name--hidden {

package/lib/components/create-okr-modal/fields/input-with-err-popup.js

@@ -9,6 +9,8 @@ exports["default"] = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _i18nFrontTranslate = require("../../../utils/i18n-front-translate");
+
 var _popup = _interopRequireDefault(require("../../popup"));
 
 require("./index.css");
@@ -24,7 +26,7 @@ var StrLengthOverflowError = function StrLengthOverflowError(_ref) {
       maxLength = _ref.maxLength;
   return /*#__PURE__*/_react["default"].createElement(_react.Fragment, null, strLength > maxLength ? /*#__PURE__*/_react["default"].createElement("span", {
     className: "error-popup-text-wrapper"
-  }, "\u5DF2\u8F93\u5165 ".concat(strLength, " \u4E2A\u5B57\uFF0C\u6700\u591A\u53EF\u8F93\u5165 ").concat(maxLength, " \u4E2A\u5B57")) : null);
+  }, (0, _i18nFrontTranslate.inputWordTrans)(strLength, maxLength)) : null);
 };
 
 var InputWithErrPopup = function InputWithErrPopup(_ref2) {

package/lib/components/dialog/index.css

@@ -93,6 +93,7 @@
   border: 1px solid #2879ff;
   color: #ffffff;
   transition: 0.2s all;
+  user-select: none;
 }
 
 .titaui-dialog__btn-ok:hover {
@@ -102,9 +103,19 @@
 }
 
 .titaui-dialog__btn-ok-not-allowed {
+  background-color: #5C8EFF;
   cursor: not-allowed;
 }
 
+.titaui-dialog__btn-ok-loading-icon {
+  width: 14px;
+  margin-right: 6px;
+  animation-name: spin;
+  animation-timing-function: linear;
+  animation-iteration-count: infinite;
+  animation-duration: 1s;
+}
+
 .titaui-dialog__btn-cancel {
   border: 1px solid #DFE3EA;
   color: #6f7886;
@@ -131,3 +142,13 @@
 .titaui-dialog.titaui-dialog-no-footer .rc-dialog-footer {
   display: none;
 }
+
+@keyframes spin {
+  from {
+    transform: rotate(0deg);
+  }
+
+  to {
+    transform: rotate(360deg);
+  }
+}

package/lib/components/dialog/index.js

@@ -1,26 +1,34 @@
 "use strict";
 
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
 var _rcDialog = _interopRequireDefault(require("rc-dialog"));
 
+var _loading = _interopRequireDefault(require("./loading.png"));
+
 var _getLocale = require("../../utils/getLocale");
 
 require("rc-dialog/assets/index.css");
 
 require("./index.css");
 
-var _excluded = ["onOk", "onCancel", "okText", "cancelText", "footer", "noFooter", "noHeadLine", "noCloseIcon", "noFooterLine", "visible", "extraClass", "extendFooterBtn", "disabled"];
+var _excluded = ["onOk", "onCancel", "okText", "cancelText", "footer", "noFooter", "noHeadLine", "noCloseIcon", "noFooterLine", "visible", "extraClass", "extendFooterBtn", "disabled", "confirmLoading"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _extends() { _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; }; return _extends.apply(this, arguments); }
 
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
@@ -69,8 +77,15 @@ var _default = function _default(props) {
       extendFooterBtn = props.extendFooterBtn,
       _props$disabled = props.disabled,
       disabled = _props$disabled === void 0 ? false : _props$disabled,
+      _props$confirmLoading = props.confirmLoading,
+      confirmLoading = _props$confirmLoading === void 0 ? false : _props$confirmLoading,
       restProps = _objectWithoutProperties(props, _excluded);
 
+  var handleOK = function handleOK() {
+    if (confirmLoading) return;
+    onOk && onOk();
+  };
+
   var baseFooter = [extendFooterBtn, /*#__PURE__*/_react["default"].createElement("span", {
     key: "cancel",
     className: (0, _classnames["default"])("".concat(preCls, "__btn"), "".concat(preCls, "__btn-cancel")),
@@ -79,9 +94,14 @@ var _default = function _default(props) {
     className: (0, _classnames["default"])("".concat(preCls, "__btn-cancel-text"))
   }, cancelText)), /*#__PURE__*/_react["default"].createElement("span", {
     key: "ok",
-    className: (0, _classnames["default"])("".concat(preCls, "__btn"), "".concat(preCls, "__btn-ok"), _defineProperty({}, "".concat(preCls, "__btn-ok-not-allowed"), disabled)),
-    onClick: onOk
-  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: (0, _classnames["default"])("".concat(preCls, "__btn"), "".concat(preCls, "__btn-ok"), _defineProperty({}, "".concat(preCls, "__btn-ok-not-allowed"), disabled || confirmLoading)),
+    onClick: handleOK
+  }, confirmLoading ? /*#__PURE__*/_react["default"].createElement("span", {
+    className: (0, _classnames["default"])("".concat(preCls, "__btn-ok-loading"))
+  }, /*#__PURE__*/_react["default"].createElement("img", {
+    className: (0, _classnames["default"])("".concat(preCls, "__btn-ok-loading-icon")),
+    src: _loading["default"]
+  }), (0, _getLocale.getLocale)('Mod_loading')) : /*#__PURE__*/_react["default"].createElement("span", {
     className: (0, _classnames["default"])("".concat(preCls, "__btn-ok-text"))
   }, okText))];
   return /*#__PURE__*/_react["default"].createElement(_rcDialog["default"], _extends({

package/lib/components/dynamic/dynamic-item/dynamic-create-o/index.css

@@ -44,6 +44,7 @@
   line-height: 18px;
   margin-right: 4px;
   margin-top: 1px;
+  word-break: keep-all;
 }
 
 .titaui-dynamic-create-o-item__kr-name {

package/lib/components/dynamic/dynamic-item/dynamic-share-to-dynamic/index.js

@@ -27,6 +27,8 @@ var _bsGlobal = require("../../../../utils/bs-global");
 
 var _guanlian = _interopRequireDefault(require("./img/guanlian.png"));
 
+var _getLocale = require("../../../../utils/getLocale");
+
 require("./index.css");
 
 var _excluded = ["data", "hasDynamicOpereateAuth"];
@@ -88,7 +90,7 @@ var DynamicShare = function DynamicShare(_ref) {
   var renderDesc = (0, _react.useMemo)(function () {
     return /*#__PURE__*/_react["default"].createElement(_react.Fragment, null, /*#__PURE__*/_react["default"].createElement("span", {
       className: prefix + '__operate-desc'
-    }, "\u5206\u4EAB\u4E86\u4E00\u5802\u597D\u8BFE"), /*#__PURE__*/_react["default"].createElement("span", {
+    }, (0, _getLocale.getLocale)('Feed_sharedexcelle')), /*#__PURE__*/_react["default"].createElement("span", {
       className: prefix + '-desc-operate-type',
       style: {
         background: feedTypeColor

package/lib/components/grid-layout/commen-components/scroll-tips.js

@@ -42,13 +42,13 @@ function ScrollTips(props) {
       _props$styles = props.styles,
       styles = _props$styles === void 0 ? {} : _props$styles;
 
-  var _useState = (0, _react.useState)(message && (0, _dateTestChange.testDayChange)(message.date)),
+  var _useState = (0, _react.useState)(message && (0, _dateTestChange.judgeTimeSpaceFromNow)(message.date)),
       _useState2 = _slicedToArray(_useState, 2),
       updateTime = _useState2[0],
       setUpdateTime = _useState2[1];
 
   (0, _react.useEffect)(function () {
-    setUpdateTime(message && (0, _dateTestChange.testDayChange)(message.date));
+    setUpdateTime(message && (0, _dateTestChange.judgeTimeSpaceFromNow)(message.date));
   }, [message && message.date]);
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: "grid-component-scrollTips",
@@ -72,13 +72,13 @@ var AvatarTips = function AvatarTips(_ref) {
       _ref$styles = _ref.styles,
       styles = _ref$styles === void 0 ? {} : _ref$styles;
 
-  var _useState3 = (0, _react.useState)(message && (0, _dateTestChange.testDayChange)(message.date)),
+  var _useState3 = (0, _react.useState)(message && (0, _dateTestChange.judgeTimeSpaceFromNow)(message.date)),
       _useState4 = _slicedToArray(_useState3, 2),
       updateTime = _useState4[0],
       setUpdateTime = _useState4[1];
 
   (0, _react.useEffect)(function () {
-    setUpdateTime(message && (0, _dateTestChange.testDayChange)(message.date));
+    setUpdateTime(message && (0, _dateTestChange.judgeTimeSpaceFromNow)(message.date));
   }, [message && message.date]);
   console.log(updateTime);
   return /*#__PURE__*/_react["default"].createElement("div", {

package/lib/components/grid-layout/near-visitors/visitor.js

@@ -42,14 +42,14 @@ function Visitor(props) {
       avatarColor = props.avatarColor,
       userId = props.userId;
 
-  var _useState = (0, _react.useState)((0, _dateTestChange.testDayChange)(dateTime)),
+  var _useState = (0, _react.useState)((0, _dateTestChange.judgeTimeSpaceFromNow)(dateTime)),
       _useState2 = _slicedToArray(_useState, 2),
       visitTime = _useState2[0],
       setVisitTime = _useState2[1];
 
   var toolTipRef = (0, _react.useRef)();
   (0, _react.useEffect)(function () {
-    setVisitTime((0, _dateTestChange.testDayChange)(dateTime));
+    setVisitTime((0, _dateTestChange.judgeTimeSpaceFromNow)(dateTime));
   }, [dateTime]);
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: "nearVisitors-Component-visitor__item",

package/lib/components/grid-layout/sub-employee-okr/person-okr.js

@@ -47,14 +47,14 @@ function PersonalOkr(props) {
       avatarColor = props.avatarColor,
       userId = props.userId;
 
-  var _useState = (0, _react.useState)((0, _dateTestChange.testDayChange)(updateTime)),
+  var _useState = (0, _react.useState)((0, _dateTestChange.judgeTimeSpaceFromNow)(updateTime)),
       _useState2 = _slicedToArray(_useState, 2),
       subUpdateTime = _useState2[0],
       setSubUpdateTime = _useState2[1];
 
   var toolTipRef = (0, _react.useRef)();
   (0, _react.useEffect)(function () {
-    setSubUpdateTime((0, _dateTestChange.testDayChange)(updateTime));
+    setSubUpdateTime((0, _dateTestChange.judgeTimeSpaceFromNow)(updateTime));
   }, [updateTime]);
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: "subOKRComponents-PersonalOkr"

package/lib/components/grid-page/commen-components/scroll-tips.js

@@ -42,13 +42,13 @@ function ScrollTips(props) {
       _props$styles = props.styles,
       styles = _props$styles === void 0 ? {} : _props$styles;
 
-  var _useState = (0, _react.useState)(message && (0, _dateTestChange.testDayChange)(message.date)),
+  var _useState = (0, _react.useState)(message && (0, _dateTestChange.judgeTimeSpaceFromNow)(message.date)),
       _useState2 = _slicedToArray(_useState, 2),
       updateTime = _useState2[0],
       setUpdateTime = _useState2[1];
 
   (0, _react.useEffect)(function () {
-    setUpdateTime(message && (0, _dateTestChange.testDayChange)(message.date));
+    setUpdateTime(message && (0, _dateTestChange.judgeTimeSpaceFromNow)(message.date));
   }, [message && message.date]);
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: "grid-component-scrollTips",
@@ -72,13 +72,13 @@ var AvatarTips = function AvatarTips(_ref) {
       _ref$styles = _ref.styles,
       styles = _ref$styles === void 0 ? {} : _ref$styles;
 
-  var _useState3 = (0, _react.useState)(message && (0, _dateTestChange.testDayChange)(message.date)),
+  var _useState3 = (0, _react.useState)(message && (0, _dateTestChange.judgeTimeSpaceFromNow)(message.date)),
       _useState4 = _slicedToArray(_useState3, 2),
       updateTime = _useState4[0],
       setUpdateTime = _useState4[1];
 
   (0, _react.useEffect)(function () {
-    setUpdateTime(message && (0, _dateTestChange.testDayChange)(message.date));
+    setUpdateTime(message && (0, _dateTestChange.judgeTimeSpaceFromNow)(message.date));
   }, [message && message.date]);
   console.log(updateTime);
   return /*#__PURE__*/_react["default"].createElement("div", {

package/lib/components/grid-page/near-visitors/visitor.js

@@ -42,14 +42,14 @@ function Visitor(props) {
       avatarColor = props.avatarColor,
       userId = props.userId;
 
-  var _useState = (0, _react.useState)((0, _dateTestChange.testDayChange)(dateTime)),
+  var _useState = (0, _react.useState)((0, _dateTestChange.judgeTimeSpaceFromNow)(dateTime)),
       _useState2 = _slicedToArray(_useState, 2),
       visitTime = _useState2[0],
       setVisitTime = _useState2[1];
 
   var toolTipRef = (0, _react.useRef)();
   (0, _react.useEffect)(function () {
-    setVisitTime((0, _dateTestChange.testDayChange)(dateTime));
+    setVisitTime((0, _dateTestChange.judgeTimeSpaceFromNow)(dateTime));
   }, [dateTime]);
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: "nearVisitors-Component-visitor__item",

package/lib/components/help-card/image/liaojie.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="240px" height="240px" viewBox="0 0 240 240" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>liaojie</title>
+    <g id="liaojie" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <path d="M120,20 C64.771525,20 20,64.771525 20,120 C20,175.228475 64.771525,220 120,220 C175.228475,220 220,175.228475 220,120 C220,64.771525 175.228475,20 120,20 Z M120,36 C166.391919,36 204,73.608081 204,120 C204,166.391919 166.391919,204 120,204 C73.608081,204 36,166.391919 36,120 C36,73.608081 73.608081,36 120,36 Z" id="椭圆形" fill="#141C28" fill-rule="nonzero"></path>
+        <path d="M120.008756,67 C111.978786,67 104.365434,69.5751522 98.5581514,74.2740154 C92.5462972,79.1476855 89.1380286,85.7464547 89.0041026,92.8525998 L89,93.4421688 C89,98.0147412 92.7048728,101.721543 97.275065,101.721543 C101.845257,101.721543 105.55013,98.0147412 105.55013,93.4421688 L105.55013,93.2882935 C105.55013,87.633082 111.918127,82.717229 120.008756,82.717229 C128.099386,82.717229 134.467382,87.633082 134.467382,93.2882935 C134.467382,97.3618411 131.236598,101.705432 126.529119,103.512236 L126.226653,103.624092 C121.998705,105.120732 118.37505,107.759616 115.76761,111.242806 C113.200769,114.69201 111.71593,119.721641 111.71593,124.292547 L111.71593,134.720625 C111.71593,139.293198 115.420803,143 119.990995,143 C124.561188,143 128.26606,139.293198 128.26606,134.720625 L128.26606,124.095087 C128.26606,121.733292 129.969128,119.083428 132.030331,118.350524 C143.332617,114.321686 151.000085,104.106804 151.000085,93.2882935 C151.0197,86.0248852 147.599248,79.251479 141.461239,74.2755365 C135.666971,69.5693086 128.057111,67 120.008756,67 Z" id="路径" fill="#2879FF" fill-rule="nonzero"></path>
+        <path d="M109,162 C109,168.075132 113.924868,173 120,173 C126.075132,173 131,168.075132 131,162 C131,155.924868 126.075132,151 120,151 C113.924868,151 109,155.924868 109,162 Z" id="路径" fill="#000000" fill-rule="nonzero"></path>
+    </g>
+</svg>

package/lib/components/help-card/index.css

@@ -15,7 +15,8 @@
 .home-fixed-kefu-image {
   width: 24px;
   height: 24px;
-  background: url("./image/kefu.svg") 50% 50% no-repeat;
+  background: url("./image/liaojie.svg") 50% 50% no-repeat;
+  background-size: 24px 24px;
 }
 
 .home-fixed-kefu-canceled {
@@ -205,20 +206,20 @@
   }
 
   100% {
-    transform: rotate(90deg);
+    transform: rotate(-90deg);
   }
 }
 
 @keyframes titaZoomInLB {
   0% {
     opacity: 0;
-    transform-origin: 0 100%;
+    transform-origin: 100% 100%;
     transform: scale(0, 0);
   }
 
   100% {
     opacity: 1;
-    transform-origin: 0 100%;
+    transform-origin: 100% 100%;
     transform: scale(1, 1);
   }
 }
@@ -226,13 +227,13 @@
 @keyframes titaZoomOutLB {
   0% {
     opacity: 1;
-    transform-origin: 0 100%;
+    transform-origin: 100% 100%;
     transform: scale(1, 1);
   }
 
   100% {
     opacity: 0;
-    transform-origin: 0 100%;
+    transform-origin: 100% 100%;
     transform: scale(0, 0);
   }
 }

package/lib/components/help-card/index.js

@@ -256,7 +256,7 @@ var HelpCard = function HelpCard(_ref) {
 
   return /*#__PURE__*/_react["default"].createElement("div", restProps, /*#__PURE__*/_react["default"].createElement(_popup["default"], {
     popupTransitionName: "tita-popup-zoom-left-bottom",
-    placement: "topRight",
+    placement: "topLeft",
     popupAlign: {
       offset: [-32, -10],
       overflow: {

package/lib/components/hr-header/index.css

@@ -0,0 +1,92 @@
+.tencent-hr-header {
+  width: 100%;
+  height: 60px;
+  display: flex;
+  align-items: center;
+  box-sizing: border-box;
+  padding: 0 30px;
+  flex-shrink: 0;
+  background-color: #3464E0;
+}
+
+.tencent-hr-header__title {
+  font-size: 14px;
+  font-weight: bold;
+  color: #FFFFFF;
+  margin-right: 98px;
+}
+
+.tencent-hr-header__menu-list {
+  display: flex;
+  align-items: stretch;
+  flex: 1;
+}
+
+.tencent-hr-header__item {
+  height: 100%;
+  width: 120px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin: 0 5px;
+}
+
+.tencent-hr-header__item > a {
+  color: #FFF;
+}
+
+.tencent-hr-header__item img {
+  width: 12px;
+  height: 12px;
+  margin-left: 4px;
+  transition: transform .2s ease;
+}
+
+.tencent-hr-header__user {
+  font-size: 14px;
+  color: #FFFFFF;
+  cursor: pointer;
+}
+
+.tencent-hr-header__user > img {
+  width: 10px;
+  height: 10px;
+  margin-left: 4px;
+  transition: transform .2s ease;
+}
+
+.tencent-hr-header-popup {
+  position: relative;
+  background-color: #fff;
+  box-shadow: 0px 4px 24px 0px rgba(127, 145, 180, 0.2);
+  border-radius: 12px;
+  min-width: 104px;
+  padding: 16px 0;
+  margin-top: 6px;
+}
+
+.tencent-hr-header-popup__item {
+  display: flex;
+  height: 32px;
+  padding: 0 24px;
+  align-items: center;
+  justify-content: flex-start;
+  color: #666666;
+}
+
+.tencent-hr-header-popup__item:hover {
+  background: #F5F7F9;
+  color: #3464E0;
+}
+
+.tencent-hr-header-popup::before {
+  display: block;
+  content: '';
+  position: absolute;
+  top: -6px;
+  left: calc(50% - 6px);
+  border-top: none;
+  border-left: 6px solid transparent;
+  border-right: 6px solid transparent;
+  border-bottom: 6px solid #FFF;
+}