react-form-ui-y
Version:
385 lines (369 loc) • 10.8 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.inputSty = undefined;
var _react = require("react");
var _react2 = _interopRequireDefault(_react);
var _reactUtilsY = require("react-utils-y");
var _formStyle = require("../formStyle");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var inputSty = function inputSty(_theme, _this) {
var publicSty = (0, _formStyle.defaultPublic)(_theme);
var sty = {
//日期默认样式
dateBox: {
padding: "0px 0px 0px 0.4rem",
margin: "0px",
width: "100%",
height: "2.5rem",
wordBreak: "keep-all",
boxSizing: "border-box",
display: "flex",
alignItems: "center",
color: "" + (_theme.publicForm.valueColor || '#666666'),
cursor: "pointer"
},
//日期正在操作中样式
dateBoxFocus: {
padding: "0px 0px 0px 0.4rem",
margin: "0px",
width: "100%",
height: "2.5rem",
wordBreak: "keep-all",
boxSizing: "border-box",
display: "flex",
alignItems: "center",
color: "" + (_theme.input.focusColor || '#666666'),
cursor: "pointer"
},
//日期禁用样式
dateBoxDis: {
padding: "0px 0px 0px 0.4rem",
margin: "0px",
width: "100%",
height: "2.5rem",
wordBreak: "keep-all",
boxSizing: "border-box",
display: "flex",
alignItems: "center",
textAlign: _this.props.textAlign,
color: "" + (_theme.publicForm.disValueColor || '#000')
},
//日期选中的文字
inputText: {
flex: "1",
overflow: "hidden",
textOverflow: "ellipsis",
textAlign: _this.props.textAlign
},
//日期svg
inputSvg: {
display: "flex",
alignItems: "center",
justifyContent: "center",
marginRight: "0.2rem"
},
DateFieldBox: {
width: "100%",
display: "flex",
flexWrap: "wrap",
boxSizing: "border-box"
},
//日期内容头部
dateHead: {
background: _theme.dateWeek.dateHeadBg,
height: "4.375rem",
width: "100%",
display: "flex",
justifyContent: "space-between",
alignItems: "center"
},
dateHeadMonth: {
color: "#fff",
fontSize: "1.25rem",
display: "flex",
justifyContent: "center"
},
dateYearBtn: {
display: "flex",
alignItems: "center",
margin: "0 1rem",
border: "#fff solid 0.08rem",
borderRadius: "0.2rem",
color: "#fff",
padding: "0.2rem",
cursor: "pointer",
zIndex: "1",
fontSize: "1rem"
},
dateMonthBtn: {
display: "flex",
alignItems: "center",
margin: "0 1rem",
border: "#fff solid 0.08rem",
borderRadius: "0.2rem",
color: "#fff",
padding: "0.2rem",
cursor: "pointer",
zIndex: "1",
fontSize: "1rem",
width: "3.7rem"
},
//年份
dateYearUl: {
listStyle: "none",
margin: "0",
padding: "0",
position: "absolute",
background: "#fff",
width: "5.3rem",
height: "0rem",
left: "1rem",
top: "3.3rem",
zIndex: "1",
transition: "all 500ms",
overflow: "hidden"
},
dateYearUlActive: {
listStyle: "none",
margin: "0",
padding: "0",
position: "absolute",
background: "#fff",
width: "5.3rem",
left: "1rem",
top: "3.3rem",
zIndex: "1",
height: "20rem",
border: "#eee solid 0.08rem",
boxShadow: "0.125rem 0.125rem 0.25rem -0.25rem #000",
overflow: "hidden"
},
dateYearRow: {
width: "5rem",
height: "2rem",
display: "flex",
justifyContent: "center",
alignItems: "center",
cursor: "pointer",
// textIndent: "-1rem",
transition: "all 500ms"
},
dateYearActive: {
width: "5rem",
height: "2rem",
display: "flex",
justifyContent: "center",
alignItems: "center",
cursor: "pointer",
background: "#eee",
color: _theme.dateWeek.moveYear
// textIndent: "-1rem",
},
//月份
dateMonthUl: {
listStyle: "none",
margin: "0",
padding: "0",
position: "absolute",
background: "#fff",
width: "4.1rem",
height: "0rem",
right: "1rem",
top: "3.3rem",
zIndex: "1",
transition: "all 500ms",
overflow: "hidden"
},
dateMonthUlActive: {
listStyle: "none",
margin: "0",
padding: "0",
position: "absolute",
background: "#fff",
width: "4.1rem",
right: "1rem",
top: "3.3rem",
zIndex: "1",
height: "20rem",
border: "#eee solid 0.08rem",
boxShadow: "0.125rem 0.125rem 0.25rem -0.25rem #000",
overflow: "hidden"
},
dateMonthRow: {
width: "3.8rem",
height: "2rem",
display: "flex",
justifyContent: "center",
alignItems: "center",
cursor: "pointer",
// textIndent: "-1rem",
transition: "all 500ms"
},
dateMonthActive: {
width: "3.8rem",
height: "2rem",
display: "flex",
justifyContent: "center",
alignItems: "center",
cursor: "pointer",
background: "#eee",
color: _theme.dateWeek.moveYear
// textIndent: "-1rem",
},
//年份月份下拉的遮罩层
backbg: {
position: "absolute",
width: "100%",
height: "100%",
top: "0",
left: "0"
},
//星期或 左右按钮
dateDayBox: {
display: "flex",
flexWrap: "wrap",
width: "94%",
margin: "0 auto"
},
dateSwitchMonth: {
display: "flex",
width: "100%",
justifyContent: "space-between",
margin: "0.3rem 0.6rem 0"
},
dateSvgClick: {
cursor: "pointer"
},
dateWeek: {
display: "flex",
alignItems: "center",
justifyContent: "space-around",
width: "100%",
background: "#eee",
height: "1.8rem"
},
dateWeekDay: {
width: "1.5rem",
height: "1.5rem",
display: "flex",
justifyContent: "center",
alignItems: "center"
//margin: "0 0.125rem"
},
//天数
rosBox: {
display: "flex",
cursor: "pointer"
},
rosBoxCheck: {
display: "flex",
background: _theme.dateWeek.chooseDayRows,
cursor: "pointer"
},
rosBtnBox: {
width: "3rem",
height: "3rem",
display: "flex",
alignItems: "center",
justifyContent: "center"
},
dateCont: {
width: "100%",
display: "flex",
flexDirection: "column",
justifyContent: "center",
height: "18rem"
},
dateRow: {
width: "22rem",
display: "flex",
height: 2 ? "3rem" : "2.4rem",
justifyContent: "space-around",
alignItems: "center",
padding: 0,
margin: "0 auto"
},
dayBox: {
display: "flex",
justifyContent: "center",
alignItems: "center",
position: "relative",
width: "1.5rem",
height: "1.5rem",
margin: "0 0.125rem"
},
dayDefault: {
color: "#000",
fontSize: "0.92rem",
width: "0.3rem",
height: "0.3rem",
display: "flex",
justifyContent: "center",
alignItems: "center",
borderRadius: "50%",
cursor: "pointer"
},
dayDisabled: {
color: "#ccc",
fontSize: "0.92rem",
width: "0.3rem",
height: "0.3rem",
display: "flex",
justifyContent: "center",
alignItems: "center",
borderRadius: "50%",
cursor: "pointer"
},
dayToday: {
width: "0.3rem",
height: "0.3rem",
fontSize: "0.92rem",
display: "flex",
justifyContent: "center",
alignItems: "center",
color: "red",
cursor: "pointer"
},
dayActive: {
width: "100%",
height: "100%",
fontSize: "0.92rem",
display: "flex",
justifyContent: "center",
alignItems: "center",
// background: "red",
color: _theme.dateWeek.today,
borderRadius: "0.1rem",
cursor: "pointer"
},
dayMoveOn: {
display: "flex",
justifyContent: "center",
alignItems: "center",
fontSize: "0.92rem",
height: "1.5rem",
width: "1.5rem",
background: "pink",
borderRadius: "0.1rem",
transition: "all 500ms",
color: "#000",
cursor: "pointer"
},
//按钮
btnBox: {
display: "flex",
width: "88%",
justifyContent: "flex-end",
alignItems: "center",
height: "4rem",
borderTop: "#dfdfdf solid 0.08rem",
margin: "0 auto",
paddingRight: "1rem"
}
};
return _reactUtilsY._Object.merge(publicSty, sty);
};
exports.inputSty = inputSty;
//# sourceMappingURL=inputStyle.js.map