tamem-scss 1.0.2

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: 8cad2b69d954e405c52b70c3d85e3dab0c324f60
+  data.tar.gz: d60484db7a7db7d1f38496a698461a5704a881a8
+SHA512:
+  metadata.gz: 8390ea3dae05c0d62466987f7b825f0eac5a22e32f9f6541256df063bfaaf97c270c59bc21e207cc8d5cf10af911b2c17536512cf720586e142b6bab0fc77deb
+  data.tar.gz: d55458fddc4f086963f395f22c9e10f0f82af764a62a835b216729e027cf5920ed1c58e18a7867a462e43ea9fc1c9d848b64b51c453833756301d84d057fe643

data/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2017 Fesuy
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

data/README.md

@@ -0,0 +1,102 @@
+# tamem-scss
+Tamem-scss is cross browser helper for sass. You can enjoy coding without create vendor prefix :D
+
+## Installation
+[Bower](https://bower.io/) `bower install tamem-scss --save`
+
+[Npm](https://www.npmjs.com/package/tamem-scss) `npm install tamem-scss --save-dev`
+
+Or you can direct download from this repo and extract into your sass project.
+
+Check the [documentation](https://fesuydev.github.io/tamem-scss/)
+
+## How to use
+Tamem-scss is a collection of several mixins.
+You only need to include Tamem-scss into your sass project.
+```
+@import "somedir/tamem";
+
+// and then call some tamem helper
+.box {
+  @include size(20px, 30px);
+  @include margin-vertical(10px);
+}
+```
+
+### Features
+- align-content
+- align-items
+- align-self
+- display-flex
+- display-inline-flex
+- flex
+- flex-basis
+- flex-direction
+- flex-flow
+- flex-grow
+- flex-shrink
+- flex-wrap
+- justify-content
+- keyframes
+- order
+- rounded
+- left-rounded
+- right-rounded
+- top-rounded
+- bottom-rounded
+- perspective
+- perspective-origin
+- rotate
+- rotate3d
+- rotateX
+- rotateY
+- rotateZ
+- skew
+- skew3d
+- skewX
+- skewY
+- scale
+- scale3d
+- scaleX
+- scaleY
+- scaleZ
+- size
+- square
+- transform
+- transform-origin
+- transform-style
+- translate
+- translate3d
+- translateX
+- translateY
+- translateZ
+- transition
+- transition-delay
+- transition-duration
+- transition-property
+- transition-timing-function
+
+#### Another helper features
+- box-shadow
+- box-sizing
+- create-grid
+- create-grid-offset
+- clearfix
+- font-face-src
+- margin-vertical
+- margin-horizontal
+- opacity
+- padding-vertical
+- padding-horizontal
+- text-overflow
+- size
+- strip-unit
+- square
+- user-select
+
+#### Notes
+if you want using clearfix you have 2 ways to do that
+You can use `@extend %clearfix` or `@include clearfix`
+
+#### License
+Tamem-scss is open-sourced software licensed under the [MIT License](http://opensource.org/licenses/MIT)

data/bower.json

@@ -0,0 +1,25 @@
+{
+  "name": "tamem-scss",
+  "homepage": "https://github.com/fesuydev/tamem-scss",
+  "authors": [
+    "Fesuy <fesuydev@gmail.com>"
+  ],
+  "description": "Tamem-scss is a cross browser helper for sass. You can enjoy coding without create vendor prefix :D",
+  "main": "_tamem.scss",
+  "keywords": [
+    "tamem",
+    "scss",
+    "sass",
+    "css",
+    "cross-browser"
+  ],
+  "license": "MIT",
+  "ignore": [
+    "**/.*",
+    ".sass-cache",
+    "node_modules",
+    "bower_components",
+    "test",
+    "tests"
+  ]
+}

data/lib/tamem/scss.rb

@@ -0,0 +1,7 @@
+require "tamem/scss/version"
+
+module Tamem
+  module Scss
+    # Your code goes here...
+  end
+end

data/lib/tamem/scss/version.rb

@@ -0,0 +1,5 @@
+module Tamem
+  module Scss
+    VERSION = "1.0.2"
+  end
+end

data/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "tamem-scss",
+  "version": "1.0.1",
+  "description": "Tamem-scss is a cross browser helper for sass. You can enjoy coding without create vendor prefix :D",
+  "main": "_tamem.scss",
+  "style": "_tamem.scss",
+  "scripts": {
+    "test": "mocha",
+    "test-only": "mocha"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/fesuydev/tamem-scss.git"
+  },
+  "keywords": [
+    "tamem",
+    "scss",
+    "sass",
+    "css",
+    "cross-browser"
+  ],
+  "author": "fesuydev@gmail.com",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/fesuydev/tamem-scss/issues"
+  },
+  "homepage": "https://github.com/fesuydev/tamem-scss#readme",
+  "dependencies": {},
+  "devDependencies": {
+    "mocha": "^3.2.0",
+    "sassy-test": "^3.0.4"
+  }
+}

data/sass/_tamem.scss

@@ -0,0 +1,6 @@
+@import "core/helpers";
+@import "core/animation";
+@import "core/rounded";
+@import "core/transformation";
+@import "core/transition";
+@import "core/flexbox";

data/sass/core/_animation.scss

@@ -0,0 +1,318 @@
+///
+/// Animation helper
+///
+/// @group animation
+/// @param {list | string} $value
+///
+/// @example scss
+///   .box {
+///     @include animation(4s linear 0s infinite alternate move_eye);
+///   }
+///
+///   // CSS Output
+///   .box {
+///     -webkit-animation: 4s linear 0s infinite alternate slide_away;
+///        -moz-animation: 4s linear 0s infinite alternate slide_away;
+///          -o-animation: 4s linear 0s infinite alternate slide_away;
+///             animation: 4s linear 0s infinite alternate slide_away;
+///   }
+///
+@mixin animation($value) {
+  -webkit-animation: $value;
+     -moz-animation: $value;
+       -o-animation: $value;
+          animation: $value;
+}
+
+///
+/// Animation delay helper
+///
+/// @group animation
+/// @param {list | number} $time
+///
+/// @example scss
+///   .box {
+///     @include animation-delay(4s, 2ms);
+///   }
+///
+///   // CSS Output
+///   .box {
+///     -webkit-animation-delay: 4s, 2ms;
+///        -moz-animation-delay: 4s, 2ms;
+///          -o-animation-delay: 4s, 2ms;
+///             animation-delay: 4s, 2ms;
+///   }
+///
+@mixin animation-delay($time...) {
+  -webkit-animation-delay: $time;
+     -moz-animation-delay: $time;
+       -o-animation-delay: $time;
+          animation-delay: $time;
+}
+
+///
+/// Animation direction helper
+///
+/// @group animation
+/// @param {list | string} $value
+///
+/// @example scss
+///   .box {
+///     @include animation-direction(normal);
+///   }
+///
+///   // CSS Output
+///   .box {
+///     -webkit-animation-direction: normal;
+///        -moz-animation-direction: normal;
+///          -o-animation-direction: normal;
+///             animation-direction: normal;
+///   }
+///
+@mixin animation-direction($value...) {
+  -webkit-animation-direction: $value;
+     -moz-animation-direction: $value;
+       -o-animation-direction: $value;
+          animation-direction: $value;
+}
+
+///
+/// Animation duration helper
+///
+/// @group animation
+/// @param {list | number} $time
+///
+/// @example scss
+///   .box {
+///     @include animation-duration(4s, 2ms);
+///   }
+///
+///   // CSS Output
+///   .box {
+///     -webkit-animation-duration: 4s, 2ms;
+///        -moz-animation-duration: 4s, 2ms;
+///          -o-animation-duration: 4s, 2ms;
+///             animation-duration: 4s, 2ms;
+///   }
+///
+@mixin animation-duration($time...) {
+  -webkit-animation-duration: $time;
+     -moz-animation-duration: $time;
+       -o-animation-duration: $time;
+          animation-duration: $time;
+}
+
+///
+/// Animation fill mode helper
+///
+/// @group animation
+/// @param {list | string} $value
+///
+/// @example scss
+///   .box {
+///     @include animation-fill-mode(both);
+///   }
+///
+///   // CSS Output
+///   .box {
+///     -webkit-animation-fill-mode:both;
+///        -moz-animation-fill-mode:both;
+///          -o-animation-fill-mode:both;
+///             animation-fill-mode:both;
+///   }
+///
+@mixin animation-fill-mode($value...) {
+  -webkit-animation-fill-mode: $value;
+     -moz-animation-fill-mode: $value;
+       -o-animation-fill-mode: $value;
+          animation-fill-mode: $value;
+}
+
+///
+/// Animation iteration count helper
+///
+/// @group animation
+/// @param {list | string | number} $value
+///
+/// @example scss
+///   .box {
+///     @include animation-iteration-count(1);
+///   }
+///
+///   // CSS Output
+///   .box {
+///     -webkit-animation-iteration-count: 1;
+///        -moz-animation-iteration-count: 1;
+///          -o-animation-iteration-count: 1;
+///             animation-iteration-count: 1;
+///   }
+///
+@mixin animation-iteration-count($value...) {
+  -webkit-animation-iteration-count: $value;
+     -moz-animation-iteration-count: $value;
+       -o-animation-iteration-count: $value;
+          animation-iteration-count: $value;
+}
+
+///
+/// Animation name helper
+///
+/// @group animation
+/// @param {list | string} $value
+///
+/// @example scss
+///   .box {
+///     @include animation-name(slide_away);
+///   }
+///
+///   // CSS Output
+///   .box {
+///     -webkit-animation-name: slide_away;
+///        -moz-animation-name: slide_away;
+///          -o-animation-name: slide_away;
+///             animation-name: slide_away;
+///   }
+///
+@mixin animation-name($value...) {
+  -webkit-animation-name: $value;
+     -moz-animation-name: $value;
+       -o-animation-name: $value;
+          animation-name: $value;
+}
+
+///
+/// Animation play state helper
+///
+/// @group animation
+/// @param {list | string} $value
+///
+/// @example scss
+///   .box {
+///     @include animation-play-state(running);
+///   }
+///
+///   // CSS Output
+///   .box {
+///     -webkit-animation-play-state: running;
+///        -moz-animation-play-state: running;
+///          -o-animation-play-state: running;
+///             animation-play-state: running;
+///   }
+///
+@mixin animation-play-state($value...) {
+  -webkit-animation-play-state: $value;
+     -moz-animation-play-state: $value;
+       -o-animation-play-state: $value;
+          animation-play-state: $value;
+}
+
+///
+/// Animation timing function helper
+///
+/// @group animation
+/// @param {list | string} $value
+///
+/// @example scss
+///   .box {
+///     @include animation-timing-function(ease-in);
+///   }
+///
+///   // CSS Output
+///   .box {
+///     -webkit-animation-timing-function: ease-in;
+///        -moz-animation-timing-function: ease-in;
+///          -o-animation-timing-function: ease-in;
+///             animation-timing-function: ease-in;
+///   }
+///
+@mixin animation-timing-function($value...) {
+  -webkit-animation-timing-function: $value;
+     -moz-animation-timing-function: $value;
+       -o-animation-timing-function: $value;
+          animation-timing-function: $value;
+}
+
+///
+/// Keyframes helper helper
+///
+/// @group animation
+/// @param {string} $value
+///
+/// @example scss
+///   @include keyframes(slide_away) {
+///     0% {
+///       top: 5%;
+///     }
+///
+///     50% {
+///       top: 200%;
+///     }
+///
+///     100% {
+///       top: -10%;
+///     }
+///   }
+///
+///   // CSS Output
+///   @-webkit-keyframes slide_away {
+///     0% {
+///       top: 5%;
+///     }
+///     50% {
+///       top: 200%;
+///     }
+///     100% {
+///       top: -10%;
+///     }
+///   }
+///
+///   @-moz-keyframes slide_away {
+///     0% {
+///       top: 5%;
+///     }
+///     50% {
+///       top: 200%;
+///     }
+///     100% {
+///       top: -10%;
+///     }
+///   }
+///
+///   @-o-keyframes slide_away {
+///     0% {
+///       top: 5%;
+///     }
+///     50% {
+///       top: 200%;
+///     }
+///     100% {
+///       top: -10%;
+///     }
+///   }
+///
+///   @keyframes slide_away {
+///     0% {
+///       top: 5%;
+///     }
+///     50% {
+///       top: 200%;
+///     }
+///     100% {
+///       top: -10%;
+///     }
+///   }
+///
+@mixin keyframes($name) {
+  @-webkit-keyframes #{$name} {
+    @content
+  }
+  @-moz-keyframes #{$name} {
+    @content
+  }
+  @-o-keyframes #{$name} {
+    @content
+  }
+  @keyframes #{$name} {
+    @content
+  }
+}