You've already forked matrix-react-sdk
mirror of
https://github.com/matrix-org/matrix-react-sdk.git
synced 2025-08-07 21:23:00 +03:00
Optimize input label transition on focus
Fix https://github.com/vector-im/element-web/issues/12876
This commit is contained in:
@@ -98,14 +98,14 @@ limitations under the License.
|
|||||||
transition:
|
transition:
|
||||||
font-size 0.25s ease-out 0.1s,
|
font-size 0.25s ease-out 0.1s,
|
||||||
color 0.25s ease-out 0.1s,
|
color 0.25s ease-out 0.1s,
|
||||||
top 0.25s ease-out 0.1s,
|
transform 0.25s ease-out 0.1s,
|
||||||
background-color 0.25s ease-out 0.1s;
|
background-color 0.25s ease-out 0.1s;
|
||||||
color: $primary-content;
|
color: $primary-content;
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
font-size: $font-14px;
|
font-size: $font-14px;
|
||||||
|
transform: translateY(0);
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0px;
|
left: 0px;
|
||||||
top: 0px;
|
|
||||||
margin: 7px 8px;
|
margin: 7px 8px;
|
||||||
padding: 2px;
|
padding: 2px;
|
||||||
pointer-events: none; // Allow clicks to fall through to the input
|
pointer-events: none; // Allow clicks to fall through to the input
|
||||||
@@ -124,10 +124,10 @@ limitations under the License.
|
|||||||
transition:
|
transition:
|
||||||
font-size 0.25s ease-out 0s,
|
font-size 0.25s ease-out 0s,
|
||||||
color 0.25s ease-out 0s,
|
color 0.25s ease-out 0s,
|
||||||
top 0.25s ease-out 0s,
|
transform 0.25s ease-out 0s,
|
||||||
background-color 0.25s ease-out 0s;
|
background-color 0.25s ease-out 0s;
|
||||||
font-size: $font-10px;
|
font-size: $font-10px;
|
||||||
top: -13px;
|
transform: translateY(-13px);
|
||||||
padding: 0 2px;
|
padding: 0 2px;
|
||||||
background-color: $field-focused-label-bg-color;
|
background-color: $field-focused-label-bg-color;
|
||||||
pointer-events: initial;
|
pointer-events: initial;
|
||||||
|
Reference in New Issue
Block a user