Vector: Make animation LESS component

Reorg code.
In process support VectorBeta's ability to turn this off

Change-Id: I61f7c935de86ae7f05db0aa7fc9b4c0c92e7aaad

diff --git a/skins/vector/components/animations.less b/skins/vector/components/animations.less
new file mode 100644 (file)
index 0000000..9163779
--- /dev/null
+++ b/skins/vector/components/animations.less
@@ -0,0 +1,28 @@
+/* Animate between standard and high definition layouts */
+body.vector-animateLayout {
+       div#content,
+       div#footer,
+       #left-navigation {
+               .transition(margin-left 250ms, padding 250ms;);
+       }
+
+       #p-logo {
+               .transition(left 250ms);
+       }
+
+       #mw-panel {
+               .transition(padding-right 250ms);
+       }
+
+       #p-search {
+               .transition(margin-right 250ms);
+       }
+
+       #p-personal {
+               .transition(right 250ms);
+       }
+
+       #mw-head-base {
+               .transition(margin-left 250ms);
+       }
+}

diff --git a/skins/vector/components/common.less b/skins/vector/components/common.less
index cb89a7b..8e7fc4d 100644 (file)
--- a/skins/vector/components/common.less
+++ b/skins/vector/components/common.less
@@ -87,32 +87,3 @@ pre, .mw-code {
 .tipsy {
        font-size: 0.8em;
 }
-
-/* Animate between standard and high definition layouts */
-body.vector-animateLayout {
-       div#content,
-       div#footer,
-       #left-navigation {
-               .transition(margin-left 250ms, padding 250ms;);
-       }
-
-       #p-logo {
-               .transition(left 250ms);
-       }
-
-       #mw-panel {
-               .transition(padding-right 250ms);
-       }
-
-       #p-search {
-               .transition(margin-right 250ms);
-       }
-
-       #p-personal {
-               .transition(right 250ms);
-       }
-
-       #mw-head-base {
-               .transition(margin-left 250ms);
-       }
-}

diff --git a/skins/vector/styles.less b/skins/vector/styles.less
index 8d5423a..819286e 100644 (file)
--- a/skins/vector/styles.less
+++ b/skins/vector/styles.less
@@ -2,6 +2,7 @@
 
 @media screen {
        @import "components/common.less";
+       @import "components/animations.less";
        @import "components/navigation.less";
        @import "components/footer.less";
        @import 'components/notifications.less';