From 842f764c96a3cac6ff4fc94bd367db1624e0b726 Mon Sep 17 00:00:00 2001 From: Alexander Bell Date: Thu, 7 Jun 2018 08:29:33 -0700 Subject: [PATCH] Animation speed up --- package.json | 2 +- src/components/Menu.js | 8 ++++---- src/styles/Menu.css | 2 +- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/package.json b/package.json index 0ce8c87..e638628 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-animated-menus", - "version": "1.0.11", + "version": "1.0.12", "description": "React component that mounts three dot button that morphs into a menu by clicking on it.", "main": "./lib/index.js", "license": "MIT", diff --git a/src/components/Menu.js b/src/components/Menu.js index 49ea446..f9c581e 100644 --- a/src/components/Menu.js +++ b/src/components/Menu.js @@ -97,9 +97,9 @@ class App extends Component { borderRadius: { value: 0, easing: "easeOutCubic", - duration: 1000 + duration: 500 }, - duration: 2000, + duration: 1000, backgroundColor: "rgb(255, 255, 255)" }) .add({ @@ -110,7 +110,7 @@ class App extends Component { return 400 + (i * 200); }, easing: 'easeInOutCubic', - offset: '-=1700' + offset: '-=700' }); } else { animation = anime.timeline(); @@ -140,7 +140,7 @@ class App extends Component { scaleX: [1,0.1], scaleY: [1,0.14], borderRadius: "100%", - duration: 1000, + duration: 700, backgroundColor: this.getColor(), easing: "easeInOutCubic", offset: '-=500' diff --git a/src/styles/Menu.css b/src/styles/Menu.css index 5f364f8..222810a 100644 --- a/src/styles/Menu.css +++ b/src/styles/Menu.css @@ -66,7 +66,7 @@ color: rgb(60, 60, 60); } .Menu_button:hover { - background-color: rgb(227, 227, 227); + background-color: rgb(240, 240, 240); padding-left: 10%; } .Menu_button:active {