diff options
author | 2018-08-22 19:59:51 +0200 | |
---|---|---|
committer | 2018-08-22 19:59:51 +0200 | |
commit | 8ef1cd50a0bf34adc3033706a2eeadd4339daa67 (patch) | |
tree | 8885bc6035dbf664cff573fba56822cec6f3128d /scss/uikit/components/animation.scss | |
parent | Use `postgres` service on CI. (diff) |
Remove unused files.
Diffstat (limited to 'scss/uikit/components/animation.scss')
-rw-r--r-- | scss/uikit/components/animation.scss | 390 |
1 files changed, 0 insertions, 390 deletions
diff --git a/scss/uikit/components/animation.scss b/scss/uikit/components/animation.scss deleted file mode 100644 index c1d91928..00000000 --- a/scss/uikit/components/animation.scss +++ /dev/null @@ -1,390 +0,0 @@ -// Name: Animation -// Description: Utilities for keyframe animations -// -// Component: `uk-animation-*` -// -// Modifiers: `uk-animation-reverse` -// `uk-animation-fast` -// `uk-animation-fade` -// `uk-animation-scale-up` -// `uk-animation-scale-down` -// `uk-animation-slide-top-*` -// `uk-animation-slide-bottom-*` -// `uk-animation-slide-left-*` -// `uk-animation-slide-right-*` -// `uk-animation-kenburns` -// `uk-animation-shake` -// -// Sub-objects: `uk-animation-toggle` -// -// States: `uk-hover` -// -// ======================================================================== - - -// Variables -// ======================================================================== - -$animation-duration: 0.5s !default; -$animation-fade-duration: 0.8s !default; -$animation-kenburns-duration: 15s !default; -$animation-fast-duration: 0.1s !default; - -$animation-slide-small-translate: 10px !default; -$animation-slide-medium-translate: 50px !default; - - -/* ======================================================================== - Component: Animation - ========================================================================== */ - -[class*='uk-animation-'] { - animation-duration: $animation-duration; - animation-timing-function: ease-out; - animation-fill-mode: both; -} - - -/* Direction modifier - ========================================================================== */ - -.uk-animation-reverse { - animation-direction: reverse; - animation-timing-function: ease-in; -} - - -/* Animations for scrollspy - ========================================================================== */ - -/* - * Fade - */ - -.uk-animation-fade { - animation-name: uk-fade; - animation-duration: $animation-fade-duration; - animation-timing-function: linear; -} - -/* - * Scale - */ - -.uk-animation-scale-up { animation-name: uk-fade-scale-02; } -.uk-animation-scale-down { animation-name: uk-fade-scale-18; } - -/* - * Slide - */ - -.uk-animation-slide-top { animation-name: uk-fade-top; } -.uk-animation-slide-bottom { animation-name: uk-fade-bottom; } -.uk-animation-slide-left { animation-name: uk-fade-left; } -.uk-animation-slide-right { animation-name: uk-fade-right; } - -/* - * Slide Small - */ - -.uk-animation-slide-top-small { animation-name: uk-fade-top-small; } -.uk-animation-slide-bottom-small { animation-name: uk-fade-bottom-small; } -.uk-animation-slide-left-small { animation-name: uk-fade-left-small; } -.uk-animation-slide-right-small { animation-name: uk-fade-right-small; } - -/* - * Slide Medium - */ - -.uk-animation-slide-top-medium { animation-name: uk-fade-top-medium; } -.uk-animation-slide-bottom-medium { animation-name: uk-fade-bottom-medium; } -.uk-animation-slide-left-medium { animation-name: uk-fade-left-medium; } -.uk-animation-slide-right-medium { animation-name: uk-fade-right-medium; } - -/* - * Kenburns - */ - -.uk-animation-kenburns { - animation-name: uk-scale-kenburns; - animation-duration: $animation-kenburns-duration; -} - -/* - * Shake - */ - -.uk-animation-shake { animation-name: uk-shake; } - - -/* Duration modifier - ========================================================================== */ - -.uk-animation-fast { animation-duration: $animation-fast-duration; } - - -/* Enable animation only on hover -========================================================================== */ - -/* - * Note: Firefox and IE needs this because animations are not triggered when switching between display `none` and `block` - */ - -.uk-animation-toggle:not(:hover):not(.uk-hover) [class*='uk-animation-'] { animation-name: none; } - - -/* Keyframes used by animation classes - ========================================================================== */ - -/* - * Fade - */ - -@keyframes uk-fade { - 0% { opacity: 0; } - 100% { opacity: 1; } -} - -/* - * Slide Top - */ - -@keyframes uk-fade-top { - 0% { - opacity: 0; - transform: translateY(-100%); - } - 100% { - opacity: 1; - transform: translateY(0); - } -} - -/* - * Slide Bottom - */ - -@keyframes uk-fade-bottom { - 0% { - opacity: 0; - transform: translateY(100%); - } - 100% { - opacity: 1; - transform: translateY(0); - } -} - -/* - * Slide Left - */ - -@keyframes uk-fade-left { - 0% { - opacity: 0; - transform: translateX(-100%); - } - 100% { - opacity: 1; - transform: translateX(0); - } -} - -/* - * Slide Right - */ - -@keyframes uk-fade-right { - 0% { - opacity: 0; - transform: translateX(100%); - } - 100% { - opacity: 1; - transform: translateX(0); - } -} - -/* - * Slide Top Small - */ - -@keyframes uk-fade-top-small { - 0% { - opacity: 0; - transform: translateY(-$animation-slide-small-translate); - } - 100% { - opacity: 1; - transform: translateY(0); - } -} - -/* - * Slide Bottom Small - */ - -@keyframes uk-fade-bottom-small { - 0% { - opacity: 0; - transform: translateY($animation-slide-small-translate); - } - 100% { - opacity: 1; - transform: translateY(0); - } -} - -/* - * Slide Left Small - */ - -@keyframes uk-fade-left-small { - 0% { - opacity: 0; - transform: translateX(-$animation-slide-small-translate); - } - 100% { - opacity: 1; - transform: translateX(0); - } -} - -/* - * Slide Right Small - */ - -@keyframes uk-fade-right-small { - 0% { - opacity: 0; - transform: translateX($animation-slide-small-translate); - } - 100% { - opacity: 1; - transform: translateX(0); - } -} - -/* - * Slide Top Medium - */ - -@keyframes uk-fade-top-medium { - 0% { - opacity: 0; - transform: translateY(-$animation-slide-medium-translate); - } - 100% { - opacity: 1; - transform: translateY(0); - } -} - -/* - * Slide Bottom Medium - */ - -@keyframes uk-fade-bottom-medium { - 0% { - opacity: 0; - transform: translateY($animation-slide-medium-translate); - } - 100% { - opacity: 1; - transform: translateY(0); - } -} - -/* - * Slide Left Medium - */ - -@keyframes uk-fade-left-medium { - 0% { - opacity: 0; - transform: translateX(-$animation-slide-medium-translate); - } - 100% { - opacity: 1; - transform: translateX(0); - } -} - -/* - * Slide Right Medium - */ - -@keyframes uk-fade-right-medium { - 0% { - opacity: 0; - transform: translateX($animation-slide-medium-translate); - } - 100% { - opacity: 1; - transform: translateX(0); - } -} - -/* - * Scale Up - */ - -@keyframes uk-fade-scale-02 { - 0% { - opacity: 0; - transform: scale(0.2); - } - 100% { - opacity: 1; - transform: scale(1); - } -} - -/* - * Scale Down - */ - -@keyframes uk-fade-scale-18 { - 0% { - opacity: 0; - transform: scale(1.8); - } - 100% { - opacity: 1; - transform: scale(1); - } -} - -/* - * Kenburns - */ - -@keyframes uk-scale-kenburns { - 0% { transform: scale(1); } - 100% { transform: scale(1.2); } -} - -/* - * Shake - */ - -@keyframes uk-shake { - 0%, 100% { transform: translateX(0); } - 10% { transform: translateX(-9px); } - 20% { transform: translateX(8px); } - 30% { transform: translateX(-7px); } - 40% { transform: translateX(6px); } - 50% { transform: translateX(-5px); } - 60% { transform: translateX(4px); } - 70% { transform: translateX(-3px); } - 80% { transform: translateX(2px); } - 90% { transform: translateX(-1px); } -} - - -// Hooks -// ======================================================================== - -@if(mixin-exists(hook-animation-misc)) {@include hook-animation-misc();} - -// @mixin hook-animation-misc(){} |