|
|
@@ -17,7 +17,7 @@
|
|
|
position: relative;
|
|
|
overflow: hidden;
|
|
|
border: @border;
|
|
|
- transition: all .3s;
|
|
|
+ transition: all 0.3s;
|
|
|
|
|
|
&:hover {
|
|
|
border-color: @primary-color-hover;
|
|
|
@@ -25,11 +25,11 @@
|
|
|
|
|
|
.menu-icon-disabled {
|
|
|
position: absolute;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
top: 0;
|
|
|
left: 0;
|
|
|
z-index: 2;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
background-color: rgba(#000, 0.1);
|
|
|
cursor: not-allowed;
|
|
|
}
|
|
|
@@ -45,6 +45,9 @@
|
|
|
padding: 8px;
|
|
|
background-color: rgba(#000, 0.06);
|
|
|
cursor: pointer;
|
|
|
+ > span {
|
|
|
+ font-size: 30px;
|
|
|
+ }
|
|
|
|
|
|
.menu-select-icon {
|
|
|
font-size: 90px;
|
|
|
@@ -74,18 +77,18 @@
|
|
|
.menu-icon-items {
|
|
|
display: grid;
|
|
|
grid-gap: 20px;
|
|
|
+ grid-template-columns: repeat(6, 1fr);
|
|
|
max-height: 500px;
|
|
|
overflow-y: auto;
|
|
|
- grid-template-columns: repeat(6, 1fr);
|
|
|
|
|
|
.icon-item {
|
|
|
- height: 100px;
|
|
|
- font-size: 40px;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
- border-radius: 2px;
|
|
|
+ height: 100px;
|
|
|
+ font-size: 40px;
|
|
|
border: 2px solid #efefef;
|
|
|
+ border-radius: 2px;
|
|
|
cursor: pointer;
|
|
|
|
|
|
&:hover {
|
|
|
@@ -93,15 +96,16 @@
|
|
|
}
|
|
|
|
|
|
&.active {
|
|
|
- border-color: @primary-color-active;
|
|
|
color: @primary-color-active;
|
|
|
+ border-color: @primary-color-active;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.icon {
|
|
|
- width: 1em; height: 1em;
|
|
|
+ width: 1em;
|
|
|
+ height: 1em;
|
|
|
+ overflow: hidden;
|
|
|
vertical-align: -0.15em;
|
|
|
fill: currentColor;
|
|
|
- overflow: hidden;
|
|
|
}
|