Bug 846056 - Create animation constants based on WinJS showPanel [r=mbrubeck]

--HG--
extra : rebase_source : 293aea846a33e112c4be0719d646e4ed888488c3
This commit is contained in:
Rodrigo Silveira 2013-02-26 14:33:42 -08:00
parent e77384614a
commit 2df40d0d36
4 changed files with 11 additions and 5 deletions

View File

@ -13,7 +13,7 @@
/* Sliding Toolbar/Tab Tray ------------------------------------------------- */
#tray {
transition: transform 0.2s ease-out;
transition: transform @metro_animation_duration@ @metro_animation_easing@;
transform: translateY(-@tray_slide_height@);
width: 100%;
}
@ -513,7 +513,7 @@ appbar {
height: @toolbar_height@;
bottom: 0;
transform: translateY(@toolbar_height@);
transition: transform 0.2s ease-out;
transition: transform @metro_animation_duration@ @metro_animation_easing@;
width: 100%;
}

View File

@ -118,3 +118,7 @@
%define shadow_width_xlarge 7px
%define shadow_width_large 4px
%define shadow_width_small 1px
% easing function and duration for animations match winJS showPanel method
%define metro_animation_duration 550ms
%define metro_animation_easing cubic-bezier(0.1, 0.9, 0.2, 1)

View File

@ -2,6 +2,9 @@
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
%filter substitution
%include defines.inc
flyoutpanel {
height: 100%;
border-width: 2px;
@ -10,8 +13,7 @@ flyoutpanel {
-moz-border-start-style: solid;
visibility: collapse;
position: fixed;
/* bezier function and duration taken from winJS showPanel method */
transition: transform 550ms cubic-bezier(0.1, 0.9, 0.2, 1);
transition: transform @metro_animation_duration@ @metro_animation_easing@;
transform: translateX(100%);
font-size: 11pt;
right: 0;

View File

@ -8,7 +8,7 @@ chrome.jar:
% skin browser classic/1.0 %skin/
skin/aboutPage.css (aboutPage.css)
skin/about.css (about.css)
skin/flyoutpanel.css (flyoutpanel.css)
* skin/flyoutpanel.css (flyoutpanel.css)
* skin/browser.css (browser.css)
* skin/content.css (content.css)
skin/config.css (config.css)