ant-design/site/theme/static/icons.less
Harry.Hou 6825456564 🐛 (Site_Icon_Display) modify background color for two tone icon item
when theme equal twoTone add calss to li tag, modify hover color from primary color to #8ecafe.

Closes #1
2019-03-04 17:13:36 +08:00

84 lines
1.6 KiB
Plaintext

ul.anticons-list {
margin: 10px 0;
overflow: hidden;
list-style: none;
li {
position: relative;
float: left;
width: 16.66%;
height: 100px;
margin: 3px 0;
padding: 10px 0 0;
overflow: hidden;
color: #555;
text-align: center;
list-style: none;
background-color: #fff;
border-radius: 4px;
cursor: pointer;
transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
.anticon {
margin: 12px 0 8px;
font-size: 36px;
transition: transform 0.3s ease-in-out;
will-change: transform;
}
.anticon-class {
display: block;
font-family: 'Lucida Console', Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
white-space: nowrap;
text-align: center;
transform: scale(0.83);
.ant-badge {
transition: color 0.3s ease-in-out;
}
}
&:hover {
color: #fff;
background-color: @primary-color;
.anticon {
transform: scale(1.4);
}
.ant-badge {
color: #fff;
}
}
&.outlined:hover {
background-color: #8ecafe;
}
&.copied:hover {
color: rgba(255, 255, 255, 0.2);
}
&::after {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
color: #fff;
line-height: 110px;
text-align: center;
opacity: 0;
transition: all 0.3s cubic-bezier(0.18, 0.89, 0.32, 1.28);
content: 'Copied!';
}
&.copied::after {
top: -10px;
opacity: 1;
}
}
}
.copied-code {
padding: 2px 4px 2px;
font-size: 12px;
background: #f5f5f5;
border-radius: 2px;
}