mirror of
https://github.com/ant-design/ant-design.git
synced 2025-06-07 09:26:06 +08:00
fix: steps custom icon style
This commit is contained in:
parent
b50590c61f
commit
c352a1786b
@ -73,3 +73,9 @@ ReactDOM.render(
|
||||
padding: 5px 0;
|
||||
}
|
||||
```
|
||||
|
||||
<style>
|
||||
[data-theme="dark"] .gutter-box {
|
||||
background: #028ac8;
|
||||
}
|
||||
</style>
|
||||
|
@ -133,3 +133,9 @@ ReactDOM.render(<App />, mountNode);
|
||||
padding: 8px 16px;
|
||||
}
|
||||
```
|
||||
|
||||
<style>
|
||||
[data-theme="dark"] #components-grid-demo-playground [class~='ant-col'] > div {
|
||||
background: #028ac8;
|
||||
}
|
||||
</style>
|
||||
|
@ -66,6 +66,12 @@ ReactDOM.render(
|
||||
background: #7dbcea;
|
||||
color: #fff;
|
||||
}
|
||||
[data-theme="dark"] #components-layout-demo-basic .ant-layout-header {
|
||||
background: #6aa0c7;
|
||||
}
|
||||
[data-theme="dark"] #components-layout-demo-basic .ant-layout-footer {
|
||||
background: #6aa0c7;
|
||||
}
|
||||
#components-layout-demo-basic .ant-layout-footer {
|
||||
line-height: 1.5;
|
||||
}
|
||||
@ -74,12 +80,18 @@ ReactDOM.render(
|
||||
color: #fff;
|
||||
line-height: 120px;
|
||||
}
|
||||
[data-theme="dark"] #components-layout-demo-basic .ant-layout-sider {
|
||||
background: #3499ec;
|
||||
}
|
||||
#components-layout-demo-basic .ant-layout-content {
|
||||
background: rgba(16, 142, 233, 1);
|
||||
color: #fff;
|
||||
min-height: 120px;
|
||||
line-height: 120px;
|
||||
}
|
||||
[data-theme="dark"] #components-layout-demo-basic .ant-layout-content {
|
||||
background: #107bcb;
|
||||
}
|
||||
#components-layout-demo-basic > .code-box-demo > div > .ant-layout {
|
||||
margin-bottom: 48px;
|
||||
}
|
||||
|
@ -45,7 +45,7 @@ ReactDOM.render(
|
||||
<Breadcrumb.Item>List</Breadcrumb.Item>
|
||||
<Breadcrumb.Item>App</Breadcrumb.Item>
|
||||
</Breadcrumb>
|
||||
<div style={{ background: '#fff', padding: 24, minHeight: 280 }}>Content</div>
|
||||
<div className="site-layout-content">Content</div>
|
||||
</Content>
|
||||
<Footer style={{ textAlign: 'center' }}>Ant Design ©2018 Created by Ant UED</Footer>
|
||||
</Layout>,
|
||||
@ -54,6 +54,11 @@ ReactDOM.render(
|
||||
```
|
||||
|
||||
```css
|
||||
.site-layout-content {
|
||||
background: #fff;
|
||||
padding: 24px;
|
||||
min-height: 280px;
|
||||
}
|
||||
#components-layout-demo-top .logo {
|
||||
width: 120px;
|
||||
height: 31px;
|
||||
@ -62,3 +67,9 @@ ReactDOM.render(
|
||||
float: left;
|
||||
}
|
||||
```
|
||||
|
||||
<style>
|
||||
[data-theme="dark"] .site-layout-content {
|
||||
background: #141414;
|
||||
}
|
||||
</style>
|
||||
|
@ -52,7 +52,7 @@ A single step in the step bar.
|
||||
| disabled | Disable click | boolean | false | |
|
||||
|
||||
<style>
|
||||
.steps-content {
|
||||
[data-theme="dark"] .steps-content {
|
||||
border: 1px dashed #303030;
|
||||
background-color: rgba(255,255,255,0.04);
|
||||
color: rgba(255,255,255,0.65);
|
||||
|
@ -53,7 +53,7 @@ title: Steps
|
||||
| disabled | 禁用点击 | boolean | false | |
|
||||
|
||||
<style>
|
||||
.steps-content {
|
||||
[data-theme="dark"] .steps-content {
|
||||
border: 1px dashed #303030;
|
||||
background-color: rgba(255,255,255,0.04);
|
||||
color: rgba(255,255,255,0.65);
|
||||
|
@ -1,20 +1,22 @@
|
||||
.@{steps-prefix-cls}-item-custom {
|
||||
.@{steps-prefix-cls}-item-icon {
|
||||
height: auto;
|
||||
background: none;
|
||||
border: 0;
|
||||
> .@{steps-prefix-cls}-icon {
|
||||
top: 0;
|
||||
left: 0.5px;
|
||||
width: @steps-icon-size;
|
||||
height: @steps-icon-size;
|
||||
font-size: 24px;
|
||||
line-height: @steps-icon-size;
|
||||
.@{steps-prefix-cls} {
|
||||
.@{steps-prefix-cls}-item-custom {
|
||||
.@{steps-prefix-cls}-item-icon {
|
||||
height: auto;
|
||||
background: none;
|
||||
border: 0;
|
||||
> .@{steps-prefix-cls}-icon {
|
||||
top: 0;
|
||||
left: 0.5px;
|
||||
width: @steps-icon-size;
|
||||
height: @steps-icon-size;
|
||||
font-size: 24px;
|
||||
line-height: @steps-icon-size;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.@{steps-prefix-cls}-item-process {
|
||||
.@{steps-prefix-cls}-item-icon > .@{steps-prefix-cls}-icon {
|
||||
color: @process-icon-color;
|
||||
&.@{steps-prefix-cls}-item-process {
|
||||
.@{steps-prefix-cls}-item-icon > .@{steps-prefix-cls}-icon {
|
||||
color: @process-icon-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user