locomotivecms_wagon 2.4.1 → 3.0.0.beta2

data/generators/foundation/public/stylesheets/foundation6/motion-ui/effects/_fade.scss

@@ -1,32 +0,0 @@
-/// Creates a fading animation.
-/// @param {Number} $from [0] - Opacity to start at.
-/// @param {Number} $to [1] - Opacity to end at.
-/// @return {Map} A keyframes map that can be used with the `generate-keyframes()` mixin.
-@function fade(
-  $from: 0,
-  $to: 1
-) {
-  $type: type-of($from);
-  $keyframes: ();
-
-  @if $type == 'string' {
-    @if $from == in {
-      $from: 0;
-      $to: 1;
-    } @else if $from == out {
-      $from: 1;
-      $to: 0;
-    }
-  }
-
-  $fromName: $from * 100;
-  $toName:   $to   * 100;
-
-  $keyframes: (
-    name: 'fade-#{$fromName}-to-#{$toName}',
-    0: (opacity: $from),
-    100: (opacity: $to),
-  );
-
-  @return $keyframes;
-}

data/generators/foundation/public/stylesheets/foundation6/motion-ui/effects/_hinge.scss

@@ -1,65 +0,0 @@
-/// Creates a hinge effect by rotating the element.
-/// @param {Keyword} $state [in] - State to transition to.
-/// @param {Keyword} $from [left] - Edge of the element to rotate from. Can be `top`, `right`, `bottom`, or `left`.
-/// @param {Keyword} $axis [edge] - Axis of the element to rotate on. Can be `edge` or `center`.
-/// @param {Number} $perspective [2000px] - Perceived distance between the viewer and the element. A higher number will make the rotation effect more pronounced.
-/// @param {Keyword} $turn-origin [from-back] - Side of the element to start the rotation from. Can be `from-back` or `from-front`.
-@function hinge (
-  $state: in,
-  $from: left,
-  $axis: edge,
-  $perspective: 2000px,
-  $turn-origin: from-back
-) {
-  // Rotation directions when hinging from back vs. front
-  $rotation-amount: 90deg;
-  $rotations-back: (
-    top: rotateX($rotation-amount * -1),
-    right: rotateY($rotation-amount * -1),
-    bottom: rotateX($rotation-amount),
-    left: rotateY($rotation-amount),
-  );
-  $rotations-from: (
-    top: rotateX($rotation-amount),
-    right: rotateY($rotation-amount),
-    bottom: rotateX($rotation-amount * -1),
-    left: rotateY($rotation-amount * -1),
-  );
-
-  // Rotation origin
-  $rotation: '';
-  @if $turn-origin == from-front {
-    $rotation: map-get($rotations-from, $from);
-  } @else if $turn-origin == from-back {
-    $rotation: map-get($rotations-back, $from);
-  } @else {
-    @warn '$turn-origin must be either "from-back" or "from-front"';
-  }
-
-  // Start and end state
-  $start: '';
-  $end: '';
-  @if $state == in {
-    $start: perspective($perspective) $rotation;
-    $end: perspective($perspective) rotate(0deg);
-  } @else {
-    $start: perspective($perspective) rotate(0deg);
-    $end: perspective($perspective) $rotation;
-  }
-
-  // Turn axis
-  $origin: '';
-  @if $axis == edge {
-    $origin: $from;
-  } @else {
-    $origin: center;
-  }
-
-  $keyframes: (
-    name: 'hinge-#{$state}-#{$from}-#{$axis}-#{$turn-origin}',
-    0: (transform: $start, transform-origin: $origin),
-    100: (transform: $end),
-  );
-
-  @return $keyframes;
-}

data/generators/foundation/public/stylesheets/foundation6/motion-ui/effects/_shake.scss

@@ -1,15 +0,0 @@
-/// Creates a shaking animation.
-/// @param {Percentage} $intensity [7%] - Intensity of the shake, as a percentage value.
-/// @return {Map} A keyframes map that can be used with the `generate-keyframes()` mixin.
-@function shake($intensity: 7%) {
-  $right: (0, 10, 20, 30, 40, 50, 60, 70, 80, 90);
-  $left: (5, 15, 25, 35, 45, 55, 65, 75, 85, 95);
-
-  $keyframes: (
-    name: 'shake-#{($intensity / 1%)}',
-    $right: (transform: translateX($intensity)),
-    $left: (transform: translateX(-$intensity)),
-  );
-
-  @return $keyframes;
-}

data/generators/foundation/public/stylesheets/foundation6/motion-ui/effects/_slide.scss

@@ -1,41 +0,0 @@
-/// Creates a sliding animation.
-/// @param {Keyword} $state [in] - Whether to move to (`in`) or from (`out`) the element's default position.
-/// @param {Keyword} $direction [up] - Direction to move. Can be `up`, `down`, `left`, or `right`.
-/// @param {Number} $amount [100%] - Distance to move. Can be any CSS length unit.
-/// @return {Map} A keyframes map that can be used with the `generate-keyframes()` mixin.
-@function slide(
-  $state: in,
-  $direction: up,
-  $amount: 100%
-) {
-  $from: $amount;
-  $to: 0;
-  $func: 'translateY';
-
-  @if $direction == left or $direction == right {
-    $func: 'translateX';
-  }
-
-  @if $state == out {
-    $from: 0;
-    $to: $amount;
-  }
-
-  @if $direction == down or $direction == right {
-    @if $state == in {
-      $from: -$from;
-    }
-  } @else {
-    @if $state == out {
-      $to: -$to;
-    }
-  }
-
-  $keyframes: (
-    name: 'slide-#{$state}-#{$direction}-#{strip-unit($amount)}',
-    0: (transform: '#{$func}(#{$from})'),
-    100: (transform: '#{$func}(#{$to})'),
-  );
-
-  @return $keyframes;
-}

data/generators/foundation/public/stylesheets/foundation6/motion-ui/effects/_spin.scss

@@ -1,28 +0,0 @@
-/// Creates a spinning animation.
-/// @param {Keyword} $direction [cw] - Direction to spin. Should be `cw` (clockwise) or `ccw` (counterclockwise).
-/// @param {Number} $amount [360deg] - Amount to spin. Can be any CSS angle unit.
-/// @return {Map} A keyframes map that can be used with the `generate-keyframes()` mixin.
-@function spin(
-  $state: in,
-  $direction: cw,
-  $amount: 1turn
-) {
-  $start: 0;
-  $end: 0;
-
-  @if $state == in {
-    $start: if($direction == ccw, $amount, $amount * -1);
-    $end: 0;
-  } @else {
-    $start: 0;
-    $end: if($direction == ccw, $amount * -1, $amount);
-  }
-
-  $keyframes: (
-    name: 'spin-#{$direction}-#{$amount}',
-    0: (transform: rotate($start)),
-    100: (transform: rotate($end)),
-  );
-
-  @return $keyframes;
-}

data/generators/foundation/public/stylesheets/foundation6/motion-ui/effects/_wiggle.scss

@@ -1,13 +0,0 @@
-/// Creates a wiggling animation.
-/// @param {Number} $intensity [7deg] - Intensity of the wiggle. Can be any CSS angle unit.
-/// @return {Map} A keyframes map that can be used with the `generate-keyframes()` mixin.
-@function wiggle($intensity: 7deg) {
-  $keyframes: (
-    name: 'wiggle-#{$intensity}',
-    (40, 50, 60): (transform: rotate($intensity)),
-    (35, 45, 55, 65): (transform: rotate(-$intensity)),
-    (0, 30, 70, 100): (transform: rotate(0)),
-  );
-
-  @return $keyframes;
-}

data/generators/foundation/public/stylesheets/foundation6/motion-ui/effects/_zoom.scss

@@ -1,15 +0,0 @@
-/// Creates a scaling transition. A scale of `1` means the element is the same size. Larger numbers make the element bigger, while numbers less than 1 make the element smaller.
-/// @param {Number} $from [1.5] - Size to start at.
-/// @param {Number} $to [1] - Size to end at.
-@function zoom(
-  $from: 0,
-  $to: 1
-) {
-  $keyframes: (
-    name: 'scale-#{$to}-to-#{$from}',
-    0: (transform: scale($from)),
-    100: (transform: scale($to)),
-  );
-
-  @return $keyframes;
-}

data/generators/foundation/public/stylesheets/foundation6/motion-ui/motion-ui.scss

@@ -1,29 +0,0 @@
-// Motion UI by ZURB
-// foundation.zurb.com/motion-ui
-// Licensed under MIT Open Source
-
-@import 'settings';
-
-@import 'util/animation';
-@import 'util/args';
-@import 'util/keyframe';
-@import 'util/selector';
-@import 'util/series';
-@import 'util/transition';
-@import 'util/unit';
-
-@import 'effects/fade';
-@import 'effects/hinge';
-@import 'effects/spin';
-@import 'effects/zoom';
-@import 'effects/shake';
-@import 'effects/slide';
-@import 'effects/wiggle';
-
-@import 'transitions/fade';
-@import 'transitions/hinge';
-@import 'transitions/zoom';
-@import 'transitions/slide';
-@import 'transitions/spin';
-
-@import 'classes';

data/generators/foundation/public/stylesheets/foundation6/motion-ui/transitions/_fade.scss

@@ -1,28 +0,0 @@
-/// Creates a fade transition by adjusting the opacity of the element.
-/// @param {Keyword} $state [in] - State to transition to.
-/// @param {Number} $from [0] - Opacity to start at. Must be a number between 0 and 1.
-/// @param {Number} $to [1] - Opacity to end on.
-/// @param {Keyword} $duration [null] - Length (speed) of the transition.
-/// @param {Keyword|Function} $timing [null] - Easing of the transition.
-/// @param {Duration} $delay [null] - Delay in seconds or milliseconds before the transition starts.
-@mixin mui-fade(
-  $state: in,
-  $from: 0,
-  $to: 1,
-  $duration: null,
-  $timing: null,
-  $delay: null
-) {
-  $fade: fade($from, $to);
-
-  @include transition-start($state) {
-    @include transition-basics($duration, $timing, $delay);
-    @include -mui-keyframe-get($fade, 0);
-
-    transition-property: opacity;
-  }
-
-  @include transition-end($state) {
-    @include -mui-keyframe-get($fade, 100);
-  }
-}

data/generators/foundation/public/stylesheets/foundation6/motion-ui/transitions/_hinge.scss

@@ -1,43 +0,0 @@
-/// Creates a hinge transition by rotating the element.
-/// @param {Keyword} $state [in] - State to transition to.
-/// @param {Keyword} $from [left] - Edge of the element to rotate from. Can be `top`, `right`, `bottom`, or `left`.
-/// @param {Keyword} $axis [edge] - Axis of the element to rotate on. Can be `edge` or `center`.
-/// @param {Length} $perspective [2000px] - Perceived distance between the viewer and the element. A higher number will make the rotation effect more pronounced.
-/// @param {Keyword} $turn-origin [from-back] - Side of the element to start the rotation from. Can be `from-back` or `from-front`.
-/// @param {Boolean} $fade [true] - Set to `true` to fade the element in or out simultaneously.
-/// @param {Duration} $duration [null] - Length (speed) of the transition.
-/// @param {Keyword|Function} $timing [null] - Easing of the transition.
-/// @param {Duration} $delay [null] - Delay in seconds or milliseconds before the transition starts.
-@mixin mui-hinge (
-  $state: in,
-  $from: left,
-  $axis: edge,
-  $perspective: 2000px,
-  $turn-origin: from-back,
-  $fade: map-get($motion-ui-settings, hinge-and-fade),
-  $duration: null,
-  $timing: null,
-  $delay: null
-) {
-  $hinge: hinge($state, $from, $axis, $perspective, $turn-origin);
-
-  @include transition-start($state) {
-    @include transition-basics($duration, $timing, $delay);
-    @include -mui-keyframe-get($hinge, 0);
-
-    @if $fade {
-      transition-property: transform, opacity;
-      opacity: if($state == in, 0, 1);
-    } @else {
-      transition-property: transform, opacity;
-    }
-  }
-
-  @include transition-end($state) {
-    @include -mui-keyframe-get($hinge, 100);
-
-    @if $fade {
-      opacity: if($state == in, 1, 0);
-    }
-  }
-}

data/generators/foundation/public/stylesheets/foundation6/motion-ui/transitions/_slide.scss

@@ -1,42 +0,0 @@
-/// Creates a sliding transition by translating the element horizontally or vertically.
-/// @param {Keyword} $state [in] - State to transition to.
-/// @param {Keyword} $direction [left] - Direction to slide to. Can be `up`, `right`, `down`, or `left`.
-/// @param {Length} $amount [100%] - Length of the slide as a percentage value.
-/// @param {Boolean} $fade [false] - Set to `true` to fade the element in or out simultaneously.
-/// @param {Duration} $duration [null] - Length (speed) of the transition.
-/// @param {Keyword|Function} $timing [null] - Easing of the transition.
-/// @param {Duration} $delay [null] - Delay in seconds or milliseconds before the transition starts.
-@mixin mui-slide (
-  $state: in,
-  $direction: left,
-  $amount: 100%,
-  $fade: map-get($motion-ui-settings, slide-and-fade),
-  $duration: null,
-  $timing: null,
-  $delay: null
-) {
-  $slide: slide($state, $direction, $amount);
-
-  // CSS Output
-  @include transition-start($state) {
-    @include transition-basics($duration, $timing, $delay);
-    @include -mui-keyframe-get($slide, 0);
-
-    @if $fade {
-      transition-property: transform, opacity;
-      opacity: if($state == in, 0, 1);
-    } @else {
-      transition-property: transform, opacity;
-    }
-
-    backface-visibility: hidden;
-  }
-
-  @include transition-end($state) {
-    @include -mui-keyframe-get($slide, 100);
-
-    @if $fade {
-      opacity: if($state == in, 1, 0);
-    }
-  }
-}

data/generators/foundation/public/stylesheets/foundation6/motion-ui/transitions/_spin.scss

@@ -1,39 +0,0 @@
-/// Creates a spinning transition by rotating the element. The `turn` unit is used to specify how far to rotate. `1turn` is equal to a 360-degree spin.
-/// @param {Keyword} $state [in] - State to transition to.
-/// @param {Boolean} $direction [cw] - Direction to spin. Should be `cw` (clockwise) or `ccw` (counterclockwise).
-/// @param {Number} $amount [0.75turn] - Amount to element the element.
-/// @param {Boolean} $fade [false] - Set to `true` to fade the element in or out simultaneously.
-/// @param {Duration} $duration [null] - Length (speed) of the transition.
-/// @param {Keyword|Function} $timing [null] - Easing of the transition.
-/// @param {Duration} $delay [null] - Delay in seconds or milliseconds before the transition starts.
-@mixin mui-spin(
-  $state: in,
-  $direction: cw,
-  $amount: 0.75turn,
-  $fade: map-get($motion-ui-settings, spin-and-fade),
-  $duration: null,
-  $timing: null,
-  $delay: null
-) {
-  $spin: spin($state, $direction, $amount);
-
-  @include transition-start($state) {
-    @include transition-basics($duration, $timing, $delay);
-    @include -mui-keyframe-get($spin, 0);
-
-    @if $fade {
-      transition-property: transform, opacity;
-      opacity: if($state == in, 0, 1);
-    } @else {
-      transition-property: transform, opacity;
-    }
-  }
-
-  @include transition-end($state) {
-    @include -mui-keyframe-get($spin, 100);
-
-    @if $fade {
-      opacity: if($state == in, 1, 0);
-    }
-  }
-}

data/generators/foundation/public/stylesheets/foundation6/motion-ui/transitions/_zoom.scss

@@ -1,39 +0,0 @@
-/// Creates a scaling transition. A scale of `1` means the element is the same size. Larger numbers make the element bigger, while numbers less than 1 make the element smaller.
-/// @param {Keyword} $state [in] - State to transition to.
-/// @param {Number} $from [1.5] - Size to start at.
-/// @param {Number} $from [1] - Size to end at.
-/// @param {Boolean} $fade [true] - Set to `true` to fade the element in or out simultaneously.
-/// @param {Duration} $duration [null] - Length (speed) of the transition.
-/// @param {Keyword|Function} $timing [null] - Easing of the transition.
-/// @param {Duration} $delay [null] - Delay in seconds or milliseconds before the transition starts.
-@mixin mui-zoom(
-  $state: in,
-  $from: 1.5,
-  $to: 1,
-  $fade: map-get($motion-ui-settings, scale-and-fade),
-  $duration: null,
-  $timing: null,
-  $delay: null
-) {
-  $scale: zoom($from, $to);
-
-  @include transition-start($state) {
-    @include transition-basics($duration, $timing, $delay);
-    @include -mui-keyframe-get($scale, 0);
-
-    @if $fade {
-      transition-property: transform, opacity;
-      opacity: if($state == in, 0, 1);
-    } @else {
-      transition-property: transform, opacity;
-    }
-  }
-
-  @include transition-end($state) {
-    @include -mui-keyframe-get($scale, 100);
-
-    @if $fade {
-      opacity: if($state == in, 1, 0);
-    }
-  }
-}