Open4
Ant Design の PageHeader のタイトルの FontSizeを変更させてくれ
fontFamily
の変更は反映されるが fontSize
の変更が反映されない (20pxで固定される)
import { PageHeader } from 'antd'
const sitePageHeader: React.CSSProperties = {
border: '1px solid rgb(235, 237, 240)',
padding: '0 10%',
alignItems: 'leftCenter',
height: '80px',
display: 'flex',
fontFamily: 'Museo Sans',
fontSize: '24px',
}
const Header: React.FC = () => (
<PageHeader
style={sitePageHeader}
onBack={() => null}
title="App"
backIcon=""
/>
)
export default Header
antdのpageheaderの子要素に .ant-page-header-heading-title
スタイルが当たっているのが原因っぽい
.ant-page-header-heading-title {
margin-right: 12px;
margin-bottom: 0;
color: rgba(0, 0, 0, 0.85);
font-weight: 600;
font-size: 20px;
line-height: 32px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
ここの font-size
をデベロッパーツールで外したら反映された