/scss/partials/_glow.scss

 1@import 'options';
 2
 3// Only include all this junk if $unicorn-btn-build-types list had 'glow'
 4// We looked in to conditional imports but no go in Sass today
 5@if $unicorn-btn-build-glow {
 6    //////////////////////////////////////////////////////////
 7    // GLOWING BUTTON STYLES ////////////////////////////////////////
 8    //////////////////////////////////////////////////////////
 9    @-webkit-keyframes glowing,
10     {
11        from { @include box-shadow(0px 0px 0px rgba($unicorn-btn-glow-color, 0.3), 0px 1px 2px rgba(0, 0, 0, .20));}
12        50% { @include box-shadow(0px 0px 16px rgba($unicorn-btn-glow-color, 0.8), 0px 1px 2px rgba(0, 0, 0, .20));}
13        to { @include box-shadow(0px 0px 0px rgba($unicorn-btn-glow-color, 0.3), 0px 1px 2px rgba(0, 0, 0, .20));}
14    }
15    @-moz-keyframes glowing,
16     {
17        from { @include box-shadow(0px 0px 0px rgba($unicorn-btn-glow-color, 0.3), 0px 1px 2px rgba(0, 0, 0, .20));}
18        50% { @include box-shadow(0px 0px 16px rgba($unicorn-btn-glow-color, 0.8), 0px 1px 2px rgba(0, 0, 0, .20));}
19        to { @include box-shadow(0px 0px 0px rgba($unicorn-btn-glow-color, 0.3), 0px 1px 2px rgba(0, 0, 0, .20));}
20    }
21    @-o-keyframes glowing,
22     {
23        from { @include box-shadow(0px 0px 0px rgba($unicorn-btn-glow-color, 0.3), 0px 1px 2px rgba(0, 0, 0, .20));}
24        50% { @include box-shadow(0px 0px 16px rgba($unicorn-btn-glow-color, 0.8), 0px 1px 2px rgba(0, 0, 0, .20));}
25        to { @include box-shadow(0px 0px 0px rgba($unicorn-btn-glow-color, 0.3), 0px 1px 2px rgba(0, 0, 0, .20));}
26    }
27    @keyframes glowing,
28     {
29        from { @include box-shadow(0px 0px 0px rgba($unicorn-btn-glow-color, 0.3), 0px 1px 2px rgba(0, 0, 0, .20));}
30        50% { @include box-shadow(0px 0px 16px rgba($unicorn-btn-glow-color, 0.8), 0px 1px 2px rgba(0, 0, 0, .20));}
31        to { @include box-shadow(0px 0px 0px rgba($unicorn-btn-glow-color, 0.3), 0px 1px 2px rgba(0, 0, 0, .20));}
32    }
33}
34
35@mixin glow {
36    -webkit-animation-duration: 3s;
37    -moz-animation-duration: 3s;
38    -ms-animation-duration: 3s;
39    -o-animation-duration: 3s;
40    animation-duration: 3s;
41    -webkit-animation-iteration-count: infinite;
42    -khtml-animation-iteration-count: infinite;
43    -moz-animation-iteration-count: infinite;
44    -ms-animation-iteration-count: infinite;
45    -o-animation-iteration-count: infinite;
46    animation-iteration-count: infinite;
47    -webkit-animation-name: glowing;
48    -khtml-animation-name: glowing;
49    -moz-animation-name: glowing;
50    -ms-animation-name: glowing;
51    -o-animation-name: glowing;
52    animation-name: glowing;
53}
54
55@mixin no_animation {
56    -webkit-animation-name: none;
57    -moz-animation-name: none;
58    -ms-animation-name: none;
59    -o-animation-name: none;
60    animation-name: none;
61}