mirror of
https://github.com/twbs/bootstrap.git
synced 2025-09-02 01:42:36 +02:00
use transforms to make the dialog smooooth
This commit is contained in:
@@ -120,6 +120,12 @@
|
||||
-webkit-transition-duration: @transition-duration;
|
||||
transition-duration: @transition-duration;
|
||||
}
|
||||
.transition-transform(@transition) {
|
||||
-webkit-transition: -webkit-transform @transition;
|
||||
-moz-transition: -moz-transform @transition;
|
||||
-o-transition: -o-transform @transition;
|
||||
transition: transform @transition;
|
||||
}
|
||||
|
||||
// Transformations
|
||||
.rotate(@degrees) {
|
||||
|
@@ -25,11 +25,11 @@
|
||||
z-index: @zindex-modal-background;
|
||||
|
||||
// When fading in the modal, animate it to slide down
|
||||
&.fade {
|
||||
top: -25%;
|
||||
.transition(~"opacity 0.3s linear, top 0.3s ease-out");
|
||||
&.fade .modal-dialog {
|
||||
.translate(0, -25%);
|
||||
.transition-transform(~"0.3s ease-out");
|
||||
}
|
||||
&.fade.in { top: 0; }
|
||||
&.fade.in .modal-dialog { .translate(0, 0)}
|
||||
}
|
||||
|
||||
// Shell div to position the modal with bottom padding
|
||||
|
Reference in New Issue
Block a user