mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-25 03:29:59 +08:00
Code Issues Actions 35 Packages Projects Releases Wiki Activity

fix: grid

Browse Source
This commit is contained in:
ycjcl868 2019-12-23 14:49:45 +08:00
parent 7fe921454f
commit 5d0aa4a231
4 changed files with 90 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/grid/demo/flex-align.md
View File

@ -74,6 +74,6 @@ ReactDOM.render(
```css
#components-grid-demo-flex-align [class~='ant-row'] {
background: #f5f5f5;
background: rgba(128, 128, 128, 0.08);
}
```

2
components/grid/demo/flex-order.md
View File

@ -39,6 +39,6 @@ ReactDOM.render(
```css
#components-grid-demo-flex-order [class~='ant-row'] {
background: #f5f5f5;
background: rgba(128, 128, 128, 0.08);
}
```

79
site/theme/static/markdown.less
View File

@ -318,6 +318,57 @@
#f5f5f5 95.83333333%,
transparent 95.83333333%
);
& when (@theme = dark) {
background-image: linear-gradient(
90deg,
#1d1d1d 4.16666667%,
transparent 4.16666667%,
transparent 8.33333333%,
#1d1d1d 8.33333333%,
#1d1d1d 12.5%,
transparent 12.5%,
transparent 16.66666667%,
#1d1d1d 16.66666667%,
#1d1d1d 20.83333333%,
transparent 20.83333333%,
transparent 25%,
#1d1d1d 25%,
#1d1d1d 29.16666667%,
transparent 29.16666667%,
transparent 33.33333333%,
#1d1d1d 33.33333333%,
#1d1d1d 37.5%,
transparent 37.5%,
transparent 41.66666667%,
#1d1d1d 41.66666667%,
#1d1d1d 45.83333333%,
transparent 45.83333333%,
transparent 50%,
#1d1d1d 50%,
#1d1d1d 54.16666667%,
transparent 54.16666667%,
transparent 58.33333333%,
#1d1d1d 58.33333333%,
#1d1d1d 62.5%,
transparent 62.5%,
transparent 66.66666667%,
#1d1d1d 66.66666667%,
#1d1d1d 70.83333333%,
transparent 70.83333333%,
transparent 75%,
#1d1d1d 75%,
#1d1d1d 79.16666667%,
transparent 79.16666667%,
transparent 83.33333333%,
#1d1d1d 83.33333333%,
#1d1d1d 87.5%,
transparent 87.5%,
transparent 91.66666667%,
#1d1d1d 91.66666667%,
#1d1d1d 95.83333333%,
transparent 95.83333333%
);
}
}
.ant-row > div,
.code-box-demo .ant-row > div {
@ -331,24 +382,44 @@
}
.code-box-demo .ant-row > div:not(.gutter-row) {
padding: 16px 0;
& when (@theme = dark) {
background: #028ac8;
}
& when not (@theme = dark) {
background: #00a0e9;
}
&:nth-child(2n + 1) {
& when (@theme = dark) {
background: fade(#0088c6, 70%);
}
& when not (@theme = dark) {
background: fade(#00a0e9, 70%);
}
}
}
.ant-row .demo-col,
.code-box-demo .ant-row .demo-col {
margin-top: 0;
margin-bottom: 0;
padding: 30px 0;
color: #fff;
& when (@theme = dark) {
color: @black;
}
& when not (@theme = dark) {
color: @light;
}
font-size: 18px;
text-align: center;
border: none;
}
.ant-row .demo-col-1 {
& when (@theme = dark) {
background: fade(#0088c6, 70%);
}
& when not (@theme = dark) {
background: fade(#00a0e9, 70%);
}
}
.ant-row .demo-col-2,
.code-box-demo .ant-row .demo-col-2 {
background: fade(#00a0e9, 50%);
@ -356,8 +427,10 @@
.ant-row .demo-col-3,
.code-box-demo .ant-row .demo-col-3 {
color: #999;
& when not (@theme = dark) {
background: rgba(255, 255, 255, 0.2);
}
}
.ant-row .demo-col-4,
.code-box-demo .ant-row .demo-col-4 {
background: fade(#00a0e9, 60%);
@ -365,7 +438,9 @@
.ant-row .demo-col-5,
.code-box-demo .ant-row .demo-col-5 {
color: #999;
background: rgba(255, 255, 255, 0.5);
& when not (@theme = dark) {
background: rgba(255, 255, 255, 0.2);
}
}
.code-box-demo .height-100 {
height: 100px;

9
site/theme/template/Layout/Header.jsx
View File

@ -41,6 +41,7 @@ class Header extends React.Component {
static contextTypes = {
router: PropTypes.object.isRequired,
isMobile: PropTypes.bool.isRequired,
theme: PropTypes.oneOf(['default', 'dark']),
};
state = {
@ -107,7 +108,7 @@ class Header extends React.Component {
render() {
const { menuVisible } = this.state;
const { isMobile } = this.context;
const { isMobile, theme } = this.context;
const menuMode = isMobile ? 'inline' : 'horizontal';
const {
location,
@ -266,7 +267,11 @@ class Header extends React.Component {
/>
<img
alt="Ant Design"
src="https://gw.alipayobjects.com/zos/rmsportal/DkKNubTaaVsKURhcVGkh.svg"
src={
theme === 'dark'
? 'https://alipay-rmsdeploy-image.cn-hangzhou.alipay.aliyun-inc.com/antfincdn/2Xu%245IJoP5/DkKNubTaaVsKURhcVGkh.svg'
: 'https://gw.alipayobjects.com/zos/rmsportal/DkKNubTaaVsKURhcVGkh.svg'
}
/>
</Link>
</Col>