Open MKR2554 opened 4 years ago
@lanjingling0510 is it possible to add className props to component ? if so, it would be better
@lanjingling0510 is it possible to add className props to component ? if so, it would be better you can add classname by yourself. then add your custome css. my component flowing:
import React, { useEffect } from 'react' import DatePicker from 'react-mobile-datepicker' import './index.less'
const MyDatePicker = ({ isOpen, onSelect, onCancel, confirmText, cancelText, value, }) => { useEffect(() => { const modalElement = document.getElementsByClassName('Modal-Portal')[0] modalElement.classList.add('myDatePicker') }, []) return ( <DatePicker theme="ios" isOpen={isOpen} showHeader={false} value={value} onCancel={onCancel} onSelect={onSelect} confirmText={confirmText} cancelText={cancelText} /> ) } export default MyDatePicker
my css file
.myDatePicker { .datepicker-modal { position: fixed; } .datepicker.ios { background-color: #ffffff; border-radius: 20px 20px 0px 0px; .datepicker-navbar { top: 20px; } .datepicker-content { padding-top: 94px; } .datepicker-navbar-btn { font-size: 28px; height: 74px; line-height: 74px; font-family: SF Pro Text, SF Pro Text-Regular; color: #0081cc; } .datepicker-scroll { & > li { font-size: 28px; font-family: SF Pro Text, SF Pro Text-Semibold; font-weight: 600; color: #262626; } } }
.lockBody { overflow: hidden; } }
Add Feature for customize the css property .