css: Immediately transition visibility when showing popup
For reasons I don't understand, an activated popup was visible during transition even though the boolean `visibility` property didn't switch to `visible` until the end of the 0.3s transition. This prevented input elements from getting focus until the end of the transition. Now input elements can get focus right away.pull/5485/head
parent
56d6a1800b
commit
ff7a2aa0ea
|
@ -2,13 +2,16 @@
|
|||
position: absolute;
|
||||
top: 10px;
|
||||
right: 30px;
|
||||
transition: all 0.3s cubic-bezier(0.74, -0.05, 0.27, 1.75);
|
||||
/* visibility must transition immediately so that input elements inside the popup can get focus */
|
||||
transition: all 0.3s cubic-bezier(0.74, -0.05, 0.27, 1.75), visibility 0s;
|
||||
z-index: 500;
|
||||
}
|
||||
|
||||
.popup:not(.popup-show):not(#users.chatAndUsers) {
|
||||
opacity: 0;
|
||||
transform: scale(0.7);
|
||||
/* visibility must not change to hidden until the end of the transition */
|
||||
transition: all 0.3s cubic-bezier(0.74, -0.05, 0.27, 1.75);
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue