优化播放控制按钮交互效果
parent
32ffe33e1a
commit
f59b2d26ad
|
@ -820,7 +820,7 @@ export default {
|
||||||
}
|
}
|
||||||
.middle-container {
|
.middle-container {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
padding: 5px 8px 5px 8px;
|
padding: 5px 10px 5px 8px;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-flow: column nowrap;
|
flex-flow: column nowrap;
|
||||||
}
|
}
|
||||||
|
@ -914,10 +914,10 @@ export default {
|
||||||
flex: none;
|
flex: none;
|
||||||
height: 46%;
|
height: 46%;
|
||||||
// margin-top: -2px;
|
// margin-top: -2px;
|
||||||
transition: @transition-theme;
|
// transition: @transition-theme;
|
||||||
transition-property: color;
|
// transition-property: color;
|
||||||
color: @color-theme;
|
// color: @color-theme;
|
||||||
transition: opacity 0.1s ease;
|
transition: opacity 0.2s ease;
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
||||||
|
@ -925,8 +925,11 @@ export default {
|
||||||
fill: currentColor;
|
fill: currentColor;
|
||||||
filter: drop-shadow(0 0 1px rgba(0, 0, 0, 0.2));
|
filter: drop-shadow(0 0 1px rgba(0, 0, 0, 0.2));
|
||||||
}
|
}
|
||||||
|
&:hover {
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
&:active {
|
&:active {
|
||||||
opacity: 0.7;
|
opacity: 0.6;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -619,10 +619,10 @@ export default {
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
flex: none;
|
flex: none;
|
||||||
transition: @transition-theme;
|
// transition: @transition-theme;
|
||||||
transition-property: color;
|
// transition-property: color;
|
||||||
color: @color-player-detail-play-btn;
|
color: @color-player-detail-play-btn;
|
||||||
transition: opacity 0.1s ease;
|
transition: opacity 0.2s ease;
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue