mai 0.0.3 → 0.0.5

data/sass/mai/modules/transitions/_tada.sass

@@ -0,0 +1,52 @@
+
+@import base
+
+/* Definition
+  ----------------------------------------------------------------------------------------------------------------------
+
+.transition.tada
+  -webkit-animation-name: tada
+  animation-name: tada
+
+
+/* Keyframes
+  ----------------------------------------------------------------------------------------------------------------------
+
+@-webkit-keyframes tada
+  0%
+    -webkit-transform: scale(1)
+    transform: scale(1)
+  10%, 20%
+    -webkit-transform: scale(0.9) rotate(-3deg)
+    transform: scale(0.9) rotate(-3deg)
+  30%, 50%, 70%, 90%
+    -webkit-transform: scale(1.1) rotate(3deg)
+    transform: scale(1.1) rotate(3deg)
+  40%, 60%, 80%
+    -webkit-transform: scale(1.1) rotate(-3deg)
+    transform: scale(1.1) rotate(-3deg)
+  100%
+    -webkit-transform: scale(1) rotate(0)
+    transform: scale(1) rotate(0)
+
+@keyframes tada
+  0%
+    -webkit-transform: scale(1)
+    -ms-transform: scale(1)
+    transform: scale(1)
+  10%, 20%
+    -webkit-transform: scale(0.9) rotate(-3deg)
+    -ms-transform: scale(0.9) rotate(-3deg)
+    transform: scale(0.9) rotate(-3deg)
+  30%, 50%, 70%, 90%
+    -webkit-transform: scale(1.1) rotate(3deg)
+    -ms-transform: scale(1.1) rotate(3deg)
+    transform: scale(1.1) rotate(3deg)
+  40%, 60%, 80%
+    -webkit-transform: scale(1.1) rotate(-3deg)
+    -ms-transform: scale(1.1) rotate(-3deg)
+    transform: scale(1.1) rotate(-3deg)
+  100%
+    -webkit-transform: scale(1) rotate(0)
+    -ms-transform: scale(1) rotate(0)
+    transform: scale(1) rotate(0)

data/sass/mai/themes/_pinky.sass

@@ -1,2 +1,12 @@
+/*
+ * Pinky
+ *
+ * Example theme for Mai intended to demonstrate when and how configuration variables should be set in order to
+ * properly overwrite the default in a consistent manner across all modules.
+ *
+ * @package     Mai/Themes
+ * @copyright   2013-2014 Muyo
+ * @link        http://github.com/muyo/mai
+ * ------------------------------------------------------------------------------------------------------------------- /
 
 @import pinky/colors

data/sass/mai/themes/pinky/_colors.sass

@@ -1,4 +1,3 @@
-
 /* Pinky Theme colors
   ----------------------------------------------------------------------------------------------------------------------
 

data/sass/mai/utils/_context.sass

@@ -1,25 +1,35 @@
+/*
+ * Context switcher for targeted stylesheets.
+ *
+ * Currently a near-copypasta from Jacket (git://github.com/Team-Sass/jacket.git).
+ *
+ * @package     Mai/Utils
+ * @copyright   2013-2014 Muyo
+ * @link        http://github.com/muyo/mai
+ * ------------------------------------------------------------------------------------------------------------------- /
 
-/* Context switcher for targeted stylesheets.
-  ----------------------------------------------------------------------------------------------------------------------
-  Currently a copypasta from Jacket (git://github.com/Team-Sass/jacket.git).
+$context:  null !default    // Default list of contexts.
+$_context: null             // Private variable.
 
 
-$m-context: null !default
-$m-_context: null
+/* -------------------------------------------------------------------------------------------------------------------
+ * Context mixin
+ * Takes a list of contexts and outputs a block of styles if a context is set.
+ * ------------------------------------------------------------------------------------------------------------------- /
 
-=context($args...)
+@mixin context($contexts...)
   $matches: false
   $selectors: ()
   $filtered: ()
   $selector-string: ''
 
-  $m-_context: $args
+  $_context: $contexts !global
 
-  @if list-separator($m-context) == 'space'
-    $m-context: $m-context, null
+  @if list-separator($context) == 'space'
+    $m-context: $context, null !global
 
-  @each $item in $m-context
-    @each $arg in $args
+  @each $item in $context
+    @each $arg in $contexts
       @if index($arg, nth($item, 1))
         @if length($item) == 1
           $matches: true
@@ -42,5 +52,27 @@ $m-_context: null
     #{$selector-string}
       @content
 
+
+/* -------------------------------------------------------------------------------------------------------------------
+ * Context function
+ * Takes a list of contexts and outputs a value if a context is set.
+ * ------------------------------------------------------------------------------------------------------------------- /
+
+@function context($value, $contexts...)
+
+  @each $item in $context
+    @each $context in $contexts
+      @if index($context, nth($item, 1))
+        @return $value
+
+  // Else return null. If null is the only value for a selector, the selector will not be printed.
+  @return null
+
+
+/* -------------------------------------------------------------------------------------------------------------------
+ * Mai-context function
+ * Takes a context value. Use when code inside a context needs to know if a specific context is set.
+ * ------------------------------------------------------------------------------------------------------------------- /
+
 @function mai-context($arg)
-  @return if(index($m-_context, $arg), true, false)
+  @return if(index($_context, $arg), true, false)

data/sass/mai/utils/_global.sass

@@ -1,8 +1,12 @@
-
-/* Global mixins
-  ----------------------------------------------------------------------------------------------------------------------
-  Mixins that are generic enough to be easily used outside of Mai, even if prefixed with 'm-'.
-
+/*
+ * Global utilities
+ *
+ * Utilities that are generic enough to be easily used outside of Mai.
+ *
+ * @package     Mai/Utils
+ * @copyright   2013-2014 Muyo
+ * @link        http://github.com/muyo/mai
+ * ------------------------------------------------------------------------------------------------------------------- /
 
 =box-sizing($type: border-box)
   -moz-box-sizing: $type

data/sass/mai/utils/_media.sass

@@ -1,23 +1,39 @@
+/*
+ * Media query helper utilities
+ *
+ * @package     Mai/Utils
+ * @copyright   2013-2014 Muyo
+ * @link        http://github.com/muyo/mai
+ * ------------------------------------------------------------------------------------------------------------------- /
 
-/* Media query helper utilities
-  ----------------------------------------------------------------------------------------------------------------------
-  Requires
-    - Configs: media, grid
-
-
-=for($size, $type: 'screen')
-  @if $size == 'breakpoint'
-    @media #{$m-media-query-breakpoint}
+=for($size, $type: 'up')
+  @if $size == 'small' and $type == 'up'
+    @media #{$m-media-query-s-up}
+      @content
+  @else if $size == 'small' and $type == 'only'
+    @media #{$m-media-query-s-only}
+      @content
+  @else if $size == 'medium' and $type == 'up'
+    @media #{$m-media-query-m-up}
+      @content
+  @else if $size == 'medium' and $type == 'only'
+    @media #{$m-media-query-m-only}
+      @content
+  @else if $size == 'large' and $type == 'up'
+    @media #{$m-media-query-l-up}
+      @content
+  @else if $size == 'large' and $type == 'only'
+    @media #{$m-media-query-l-only}
       @content
-  @if $size == 'small' and $type == 'screen'
-    @media #{$m-media-query-small}
+  @else if $size == 'xlarge' and $type == 'up'
+    @media #{$m-media-query-xl-up}
       @content
-  @else if $size == 'medium' and $type == 'screen'
-    @media #{$m-media-query-medium}
+  @else if $size == 'xlarge' and $type == 'only'
+    @media #{$m-media-query-xl-only}
       @content
-  @else if $size == 'large' and $type == 'screen'
-    @media #{$m-media-query-large}
+  @else if $size == 'xxlarge' and $type == 'up'
+    @media #{$m-media-query-xxl-up}
       @content
-  @else if $size == 'xlarge' and $type == 'screen'
-    @media #{$m-media-query-xlarge}
+  @else if $size == 'xxlarge' and $type == 'only'
+    @media #{$m-media-query-xxl-only}
       @content

data/sass/mai/utils/_mobile.sass

@@ -1,10 +1,14 @@
-
-/* Utils for mobile browsers
-  ----------------------------------------------------------------------------------------------------------------------
+/*
+ * Utilities for mobile devices
+ *
+ * @package     Mai/Utils
+ * @copyright   2013-2014 Muyo
+ * @link        http://github.com/muyo/mai
+ * ------------------------------------------------------------------------------------------------------------------- /
 
 =kill-mobile-zoom
   -webkit-text-size-adjust: 100%
   -ms-text-size-adjust: none
 
 =kill-tap-highlight
-  -webkit-tap-highlight-color: rgba(0,0,0,0)
+  -webkit-tap-highlight-color: rgba(black, 0)

data/sass/mai/utils/_rgba.sass

@@ -1,18 +1,47 @@
+/*
+ * RGBA Utilities
+ *
+ * Requires the 'compass-rgbapng' gem (https://github.com/aaronrussell/compass-rgbapng) to be installed.
+ *
+ * @package     Mai/Utils
+ * @copyright   2013-2014 Muyo
+ * @link        http://github.com/muyo/mai
+ * ------------------------------------------------------------------------------------------------------------------- /
 
 @import rgbapng
 
+$rgba-bg-img-path: 'png' !default
+$rgba-bg-img-size:  5    !default
+$rgba-bg-opacity:   .75  !default
 
-/* RGBA utilities
+/* Functions
   ----------------------------------------------------------------------------------------------------------------------
-  Requires
-    - Gems: rgbapng
 
+@function rgba-png($color, $opacity: $rgba-bg-opacity, $path: $rgba-bg-img-path, $size: $rgba-bg-img-size)
+  @return image_url(png_pixelate(rgba($color, $opacity), $path, $size))
 
-$path-in-img-rgba-png: 'png' !default
-$rgbapng_path: $path-in-img-rgba-png !default
+@function rgba-inline($color, $opacity: $rgba-bg-opacity, $size: $rgba-bg-img-size)
+  @return png_base64(rgba($color, $opacity), $size)
 
 
-=bg-rgba-fallback($color, $opacity: $bg-opacity-base)
+/* -------------------------------------------------------------------------------------------------------------------
+ * Mixin: RGBA Background
+ * Mixes in a RGBA background with fallback to a base color and an opaque, external .png image.
+ * ------------------------------------------------------------------------------------------------------------------- /
+
+@mixin rgba-bg($color, $opacity: $rgba-bg-opacity, $path: $rgba-bg-img-path, $size: $rgba-bg-img-size)
+  background: $color
+  background: rgba-png($color, $opacity, $path, $size)
+  background: rgba($color, $opacity)
+
+
+/* -------------------------------------------------------------------------------------------------------------------
+ * Mixin: RGBA Background (inline)
+ * Mixes in a RGBA background with fallback to a base color and an opaque, inline (base64 encoded) .png image.
+ * ------------------------------------------------------------------------------------------------------------------- /
+
+@mixin rgba-bg-inline($color, $opacity: $rgba-bg-opacity, $size: $rgba-bg-img-size)
   background: $color
-  background: image-url((png_pixelate(rgba($color, $opacity), $path-in-img-rgba-png)))
-  background: rgba($color, $opacity)
+  background: rgba-inline($color, $opacity, $size)
+  background: rgba($color, $opacity)
+

data/sass/mai/utils/_ui.sass

@@ -1,14 +1,12 @@
-
-@import "media"
-
-
-/* UI utilities
-  ----------------------------------------------------------------------------------------------------------------------
-  Requires
-    - Utils: media
-
-
-=cf()
+/*
+ * UI Utilities
+ *
+ * @package     Mai/Utils
+ * @copyright   2013-2014 Muyo
+ * @link        http://github.com/muyo/mai
+ * ------------------------------------------------------------------------------------------------------------------- /
+
+@mixin cf()
   *zoom: 1
   &:before, &:after
     content: " "
@@ -16,18 +14,5 @@
   &:after
     clear: both
 
-=clearfix()
-  +cf()
-
-=cfBreakpoint()
-  +for('breakpoint')
-    &:before, &:after
-      content: " "
-      display: table
-    &:after
-      clear: both
-    &:last-child
-      float: none
-
-=clearfixBreakpoint()
-  +cfBreakpoint()
+@mixin clearfix()
+  +cf()

metadata

@@ -1,18 +1,20 @@
 --- !ruby/object:Gem::Specification
 name: mai
 version: !ruby/object:Gem::Version
-  version: 0.0.3
+  version: 0.0.5
+  prerelease: 
 platform: ruby
 authors:
 - Muyo
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2013-06-06 00:00:00.000000000 Z
+date: 2014-07-03 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: sass
   requirement: !ruby/object:Gem::Requirement
+    none: false
     requirements:
     - - ! '>='
       - !ruby/object:Gem::Version
@@ -20,6 +22,7 @@ dependencies:
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
+    none: false
     requirements:
     - - ! '>='
       - !ruby/object:Gem::Version
@@ -49,14 +52,27 @@ files:
 - sass/mai/config/_base.sass
 - sass/mai/config/_colors.sass
 - sass/mai/config/_global.sass
-- sass/mai/config/_grid.sass
 - sass/mai/config/_media.sass
+- sass/mai/config/modules/_grid.sass
 - sass/mai/media/_print.sass
 - sass/mai/modules/_grid.sass
+- sass/mai/modules/_transitions.sass
+- sass/mai/modules/_ui.sass
 - sass/mai/modules/grid/_base.sass
-- sass/mai/modules/grid/_functions.sass
+- sass/mai/modules/grid/_block.sass
 - sass/mai/modules/grid/_media.sass
 - sass/mai/modules/grid/media/_base.sass
+- sass/mai/modules/grid/media/_block.sass
+- sass/mai/modules/transitions/_base.sass
+- sass/mai/modules/transitions/_bounce.sass
+- sass/mai/modules/transitions/_fade.sass
+- sass/mai/modules/transitions/_flash.sass
+- sass/mai/modules/transitions/_flip.sass
+- sass/mai/modules/transitions/_pulse.sass
+- sass/mai/modules/transitions/_scale.sass
+- sass/mai/modules/transitions/_shake.sass
+- sass/mai/modules/transitions/_slide.sass
+- sass/mai/modules/transitions/_tada.sass
 - sass/mai/themes/_pinky.sass
 - sass/mai/themes/pinky/_colors.sass
 - sass/mai/utils/_context.sass
@@ -71,25 +87,27 @@ files:
 homepage: https://github.com/muyo/mai
 licenses:
 - MIT
-metadata: {}
 post_install_message: 
 rdoc_options: []
 require_paths:
 - lib
 required_ruby_version: !ruby/object:Gem::Requirement
+  none: false
   requirements:
   - - ! '>='
     - !ruby/object:Gem::Version
       version: '0'
 required_rubygems_version: !ruby/object:Gem::Requirement
+  none: false
   requirements:
   - - ! '>='
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
 rubyforge_project: 
-rubygems_version: 2.0.3
+rubygems_version: 1.8.24
 signing_key: 
-specification_version: 4
+specification_version: 3
 summary: Mai CSS skeleton built on Compass
 test_files: []
+has_rdoc: 

checksums.yaml

@@ -1,15 +0,0 @@
----
-!binary "U0hBMQ==":
-  metadata.gz: !binary |-
-    NGM3MGQyMjA2MzA5OWQyNWYyOGVhZDhhYzM0NTI3OGM4NzAxMTZjMA==
-  data.tar.gz: !binary |-
-    MTc1ODc1MjgxMzMwMTEwNGE3YWIzZWVhYzFiNGFlNjNiNWQ1NTQ4Zg==
-!binary "U0hBNTEy":
-  metadata.gz: !binary |-
-    NjRjZTY1YTg1YjI4NzAwYWZjOTA3OWQ4ZWJiNjVlM2FlMWM0MDVjOGQ0ZTQ4
-    YjE0MDBkMGRhZGI0ZWI0NmNjODY3MDA4MmNhZDY5MTA1NzhhYTQ2YWMxYjRl
-    YzViYTFjNTdiZjI3NWQ5Y2RiNmIwNzg1OWFiOTdjNjhkZGZhMDg=
-  data.tar.gz: !binary |-
-    ZjBiZWIyZWUwODRiOTRmZDhkYTE3MWEzZWQ1ZTJlMTk5N2NjMTQ5Njc5ODU0
-    NTBiY2Y0MGMzZWZlZDllYTM2M2RhYzJmNDVjODdjODc1Mzg5MDI3NDU5ZTFl
-    OWQzMTdhMTBmNTIzNDllMGVkMTg2ZTE4OTczZTUwZDBhYzNjNzY=