@vnmfify/core
Version:
```shell npm i @vnmfify/core -S ```
1 lines • 6.65 kB
Source Map (JSON)
{"version":3,"sources":["transition/transition.scss"],"names":[],"mappings":"AAEA,0CACE,GACE,uCAAA,CAAA,+BAAA,CAAA,CAFJ,kCACE,GACE,uCAAA,CAAA,+BAAA,CAAA,CAIJ,yCACE,GACE,uCAAA,CAAA,+BAAA,CAAA,CAFJ,iCACE,GACE,uCAAA,CAAA,+BAAA,CAAA,CAIJ,4CACE,GACE,wCAAA,CAAA,gCAAA,CAAA,CAFJ,oCACE,GACE,wCAAA,CAAA,gCAAA,CAAA,CAIJ,2CACE,GACE,wCAAA,CAAA,gCAAA,CAAA,CAFJ,mCACE,GACE,wCAAA,CAAA,gCAAA,CAAA,CAIJ,4CACE,GACE,wCAAA,CAAA,gCAAA,CAAA,CAFJ,oCACE,GACE,wCAAA,CAAA,gCAAA,CAAA,CAIJ,2CACE,GACE,wCAAA,CAAA,gCAAA,CAAA,CAFJ,mCACE,GACE,wCAAA,CAAA,gCAAA,CAAA,CAIJ,6CACE,GACE,uCAAA,CAAA,+BAAA,CAAA,CAFJ,qCACE,GACE,uCAAA,CAAA,+BAAA,CAAA,CAIJ,4CACE,GACE,uCAAA,CAAA,+BAAA,CAAA,CAFJ,oCACE,GACE,uCAAA,CAAA,+BAAA,CAAA,CAIJ,mCACE,GACE,SAAA,CAGF,GACE,SAAA,CAAA,CANJ,2BACE,GACE,SAAA,CAGF,GACE,SAAA,CAAA,CAIJ,oCACE,GACE,SAAA,CAGF,GACE,SAAA,CAAA,CANJ,4BACE,GACE,SAAA,CAGF,GACE,SAAA,CAAA,CAIJ,kCACE,GACE,8BAAA,CAAA,sBAAA,CAGF,GACE,+BAAA,CAAA,uBAAA,CAAA,CANJ,0BACE,GACE,8BAAA,CAAA,sBAAA,CAGF,GACE,+BAAA,CAAA,uBAAA,CAAA,CAMF,6EAGE,6DAAA,CAAA,qDAAA,CAEA,gCAAA,CAAA,wBAAA,CAHA,sCAAA,CAAA,8BAAA,CAEA,iFAAA,CAAA,yEACA,CAGF,qCAEE,6DAAA,CAAA,qDAAA,CAEA,gCAAA,CAAA,wBAAA,CAHA,uCAAA,CAAA,+BAAA,CAEA,+EAAA,CAAA,uEACA,CAMF,qFAGE,6DAAA,CAAA,qDAAA,CAEA,gCAAA,CAAA,wBAAA,CAHA,6CAAA,CAAA,qCAAA,CAEA,iFAAA,CAAA,yEACA,CAGF,yCAEE,6DAAA,CAAA,qDAAA,CAEA,gCAAA,CAAA,wBAAA,CAHA,4CAAA,CAAA,oCAAA,CAEA,iFAAA,CAAA,yEACA,CAKF,yFAGE,6DAAA,CAAA,qDAAA,CAEA,gCAAA,CAAA,wBAAA,CAHA,+CAAA,CAAA,uCAAA,CAEA,iFAAA,CAAA,yEACA,CAGF,2CAEE,6DAAA,CAAA,qDAAA,CAEA,gCAAA,CAAA,wBAAA,CAHA,8CAAA,CAAA,sCAAA,CAEA,iFAAA,CAAA,yEACA,CAKF,yFAGE,6DAAA,CAAA,qDAAA,CAEA,gCAAA,CAAA,wBAAA,CAHA,+CAAA,CAAA,uCAAA,CAEA,iFAAA,CAAA,yEACA,CAGF,2CAEE,6DAAA,CAAA,qDAAA,CAEA,gCAAA,CAAA,wBAAA,CAHA,8CAAA,CAAA,sCAAA,CAEA,iFAAA,CAAA,yEACA,CAKF,2FAGE,6DAAA,CAAA,qDAAA,CAEA,gCAAA,CAAA,wBAAA,CAHA,gDAAA,CAAA,wCAAA,CAEA,iFAAA,CAAA,yEACA,CAGF,4CAEE,6DAAA,CAAA,qDAAA,CAEA,gCAAA,CAAA,wBAAA,CAHA,+CAAA,CAAA,uCAAA,CAEA,iFAAA,CAAA,yEACA","file":"index.css","sourcesContent":["@import \"./variables\";\n\n@keyframes #{$component-prefix}slide-up-enter {\n from {\n transform: translate3d(0, 100%, 0);\n }\n}\n\n@keyframes #{$component-prefix}slide-up-exit {\n to {\n transform: translate3d(0, 100%, 0);\n }\n}\n\n@keyframes #{$component-prefix}slide-down-enter {\n from {\n transform: translate3d(0, -100%, 0);\n }\n}\n\n@keyframes #{$component-prefix}slide-down-exit {\n to {\n transform: translate3d(0, -100%, 0);\n }\n}\n\n@keyframes #{$component-prefix}slide-left-enter {\n from {\n transform: translate3d(-100%, 0, 0);\n }\n}\n\n@keyframes #{$component-prefix}slide-left-exit {\n to {\n transform: translate3d(-100%, 0, 0);\n }\n}\n\n@keyframes #{$component-prefix}slide-right-enter {\n from {\n transform: translate3d(100%, 0, 0);\n }\n}\n\n@keyframes #{$component-prefix}slide-right-exit {\n to {\n transform: translate3d(100%, 0, 0);\n }\n}\n\n@keyframes #{$component-prefix}fade-in {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n}\n\n@keyframes #{$component-prefix}fade-out {\n from {\n opacity: 1;\n }\n\n to {\n opacity: 0;\n }\n}\n\n@keyframes #{$component-prefix}rotate {\n from {\n transform: rotate(0deg);\n }\n\n to {\n transform: rotate(360deg);\n }\n}\n\n// Fade Animation\n.#{$component-prefix}transition-fade {\n &-appear-active,\n &-enter-active {\n animation-name: #{$component-prefix}fade-in;\n animation-duration: var(--animation-duration-base, $animation-duration-base);\n animation-timing-function: var(--animation-timing-function-enter, $animation-timing-function-enter);\n animation-fill-mode: both;\n }\n\n &-exit-active {\n animation-name: #{$component-prefix}fade-out;\n animation-duration: var(--animation-duration-base, $animation-duration-base);\n animation-timing-function: var(--animation-timing-function-exit, $animation-timing-function-exit);\n animation-fill-mode: both;\n }\n}\n\n// Slide Animation\n.#{$component-prefix}transition-slide-up {\n &-appear-active,\n &-enter-active {\n animation-name: #{$component-prefix}slide-up-enter;\n animation-duration: var(--animation-duration-base, $animation-duration-base);\n animation-timing-function: var(--animation-timing-function-enter, $animation-timing-function-enter);\n animation-fill-mode: both;\n }\n\n &-exit-active {\n animation-name: #{$component-prefix}slide-up-exit;\n animation-duration: var(--animation-duration-base, $animation-duration-base);\n animation-timing-function: var(--animation-timing-function-enter, $animation-timing-function-enter);\n animation-fill-mode: both;\n }\n}\n\n.#{$component-prefix}transition-slide-down {\n &-appear-active,\n &-enter-active {\n animation-name: #{$component-prefix}slide-down-enter;\n animation-duration: var(--animation-duration-base, $animation-duration-base);\n animation-timing-function: var(--animation-timing-function-enter, $animation-timing-function-enter);\n animation-fill-mode: both;\n }\n\n &-exit-active {\n animation-name: #{$component-prefix}slide-down-exit;\n animation-duration: var(--animation-duration-base, $animation-duration-base);\n animation-timing-function: var(--animation-timing-function-enter, $animation-timing-function-enter);\n animation-fill-mode: both;\n }\n}\n\n.#{$component-prefix}transition-slide-left {\n &-appear-active,\n &-enter-active {\n animation-name: #{$component-prefix}slide-left-enter;\n animation-duration: var(--animation-duration-base, $animation-duration-base);\n animation-timing-function: var(--animation-timing-function-enter, $animation-timing-function-enter);\n animation-fill-mode: both;\n }\n\n &-exit-active {\n animation-name: #{$component-prefix}slide-left-exit;\n animation-duration: var(--animation-duration-base, $animation-duration-base);\n animation-timing-function: var(--animation-timing-function-enter, $animation-timing-function-enter);\n animation-fill-mode: both;\n }\n}\n\n.#{$component-prefix}transition-slide-right {\n &-appear-active,\n &-enter-active {\n animation-name: #{$component-prefix}slide-right-enter;\n animation-duration: var(--animation-duration-base, $animation-duration-base);\n animation-timing-function: var(--animation-timing-function-enter, $animation-timing-function-enter);\n animation-fill-mode: both;\n }\n\n &-exit-active {\n animation-name: #{$component-prefix}slide-right-exit;\n animation-duration: var(--animation-duration-base, $animation-duration-base);\n animation-timing-function: var(--animation-timing-function-enter, $animation-timing-function-enter);\n animation-fill-mode: both;\n }\n}\n"]}