foundation / foundation-sites

The most advanced responsive front-end framework in the world. Quickly create prototypes and production code for sites that work on any kind of device.
https://get.foundation
MIT License
29.66k stars 5.48k forks source link

CSS3 Transitions & Micro Animations: Motion UI #9590

Closed IamManchanda closed 6 years ago

IamManchanda commented 7 years ago

Here are some examples (set of css transitions) to motivate it out and eventually include some of these (if not all) to motion ui !

Special Note: All of these micro animations that i am including are only the one that can be useful for most of the modern websites and applications and the one which make sense to put in on focus

Micro Animation for Buttons #9553 http://codepen.io/IamManchanda/pen/Pbvmxg

CSS Hamburger Menu(Open & Close) #9675 http://codepen.io/edoardo-bluframe/pen/dMZaMa

Modal Box Animation http://codepen.io/koolhaus/pen/ajwcE

Animated Input Form on focus http://codepen.io/IamManchanda/pen/XpraGx

CSS Smooth Checkboxes http://codepen.io/edoardo-bluframe/pen/yOPjBB

CSS Drawers http://codepen.io/edoardo-bluframe/pen/aNpZBR

CSS Typewritter effect The same effect that you look up when you open the slack homepage https://css-tricks.com/snippets/css/typewriter-effect/

IamManchanda commented 7 years ago

Awaiting reply @kball

kball commented 7 years ago

I'm interested in exploring the bigger picture on this... are there a set of animations that make sense to put in on focus?

IamManchanda commented 7 years ago

@kball : Yes there are some

for example : CSS Typewritter effect ( The same effect that you look up when you open the slack homepage ) https://css-tricks.com/snippets/css/typewriter-effect/

But yes a bit unsure whether these type of things should be put up in the core or not ?

kball commented 7 years ago

Probably not in core - more likely they'll be a part of MotionUI, if we decide to add them.

IamManchanda commented 7 years ago

Probably not in core - more likely they'll be a part of MotionUI, if we decide to add them.

So so should i forward this one to motion ui and also this typewritter effect ?

kball commented 7 years ago

I think eventually yes, that said, there is a larger audience here and this is something I'm interested in more opinions & thoughts on, so lets leave it here for now.

IamManchanda commented 7 years ago

I think eventually yes, that said, there is a larger audience here and this is something I'm interested in more opinions & thoughts on, so lets leave it here for now.

Ohk will leave this open here but created a issue there with a link to this page

IamManchanda commented 7 years ago

@kball : With the inspiration from to the mail i recieved from zurb about micro animation, i have updated my list ..... hope you will like it!

#MotionUI

colin-marshall commented 6 years ago

@IamManchanda closing this one out to possibly revisit in F7.