flexy 1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: 34e2c966b22c54d1f60fc12d5249024f122aa820
+  data.tar.gz: 2d9895b14c03cb1c61fe1c9ae9cb521a887dd0bc
+SHA512:
+  metadata.gz: 960e092aca02fd2dc62f3cdfa143fa374dac9a75119ed833bb334a800099294ef227081e9a7771966db292fdf6435c13715b47adabd3dd890738219889cf9ce2
+  data.tar.gz: 58de07412923f5c8a4ebb69b170f0d0a23a392bd3260ef9fd38a9284ffacd014bca3da55cd734621a6dfd20821c3b8675903dd2b240149e6714a67766cbe6d61

data/README.md

@@ -0,0 +1,54 @@
+Compass Extension Template
+==========================
+
+Whenever I'm creating a [Compass extension](http://compass-style.org/help/tutorials/extensions/), I find that I always use the same basic template for creating extensions, and that the project that Compass comes with isn't quite complete enough to get me where I need to be. With that in mind, I've created this little project to get you on your way. Here's a little template that I've put together to kickstart Compass extension development. Wherever it says "Extension" in the template files/file names, replace it with *your* extension's name. All files are self documented; please read the documentation there.
+
+## lib/extension.rb
+
+Your `lib` directory is your Ruby directory. The main file in here is **extension.rb** which contains the information that Compass needs to make your Extension run like a champ.  It contains the Compass requires for other gems (like you would include in *config.rb* normally), the code to register your extension with Compass, the version number and date of the version, and any SassScript you may want to write.
+
+## stylesheets/_extension.scss
+
+Your `stylesheets` directory is where you write all of your extension's Sass! I've included **_extension.scss**, but you can include whatever you'd like. Write Sass or SCSS, do what works for you! Have sub folders, have sub partials, this is your playground. Important to note: make sure that every file in here is a Partial unless there is a file you specifically want to be output as a full file. Generally speaking, most Compass extensions *only* have partial files.
+
+## templates/project
+
+Your `templates` directory is where you store any project templates/patterns you'd like a user to be able to use. The Compass Extension documentation explains in full what a template/pattern can do, the one provided is a generic one including print, i.e., and screen stylesheets that will import your extension. This will provide users with the ability to create a new project using your Compass extension in the following way:
+
+`compass create <my_project> -r extension --using extension`
+
+## CHANGELOG.md/README.md
+
+These files aren't required for your Compass extension, but I really like including them as they are useful for Users to understand the direction of your Compass extension. Yes! That means you get to throw this README out and write your own! Do it!
+
+## extension.gemspec
+
+This is the magic file that will turn your collection of files into a packaged Compass extension! It's all laid out for you, just add/change what you need! When you're all done editing what you need, in the command line, from the directory where that lives, type the following:
+
+`gem build extension.gemspec`
+
+This will bundle your extension up into a Ruby gem. From there, if you're just using it locally, you can install your Extension in by typing the following:
+
+`gem install extension-VERSION.gem`
+
+If you're looking to distribute your extension, first, make sure you've got a [Ruby Gems](http://rubygems.org/) account, and type in the following:
+
+`gem push extension-VERSION.gem`
+
+If you're not logged in to Ruby Gems, it will ask you to log in, then it will push your extension up to Ruby Gems! Tada! It's now distributed to the world! To install a Compass extension from Ruby Gems, it's as simple as:
+
+`gem install extension`
+
+<hr>
+
+# AND YOU'RE DONE.
+
+<hr>
+
+## Special Thanks
+Super special thanks goes out to [Nathan Weizenbaum](https://github.com/nex3/) for Sass, [Chris Eppstein](https://github.com/chriseppstein/) for Compass, and [Mason Wendell](https://github.com/canarymason/) and [Scott Kellum](https://github.com/scottkellum/), my Compass extension partners in crime. Much of what's presented here is an amalgamation of what Chris, Mason, and Scott have taught me, so double thanks to them.
+
+## License
+[Creative Commons Attribution 3.0](http://creativecommons.org/licenses/by/3.0). Go wild.
+
+If you're able to link me to your extension so I can see what you've built, that'd be awesome!

data/lib/flexy.rb

@@ -0,0 +1,30 @@
+# All gems that are required for this extension to work should go here.
+# These are the requires you would normally put in your config.rb file
+# By default, you should always included Compass. Do not include your
+#  extension.
+require 'compass'
+
+# This tells Compass what your Compass extension is called, and where to find
+#  its files
+# Replace 'extension' with the name of your extension. Spaces allowed.
+extension_path = File.expand_path(File.join(File.dirname(__FILE__), ".."))
+Compass::Frameworks.register('flexy', :path => extension_path)
+
+# Version and date of version for your Compass extension.
+# Replace Extension with the name of your extension
+#  Letters, numbers, and underscores only
+#  Version is a number. If a version contains alphas, it will be created as
+#    a prerelease version
+#  Date is in the form of YYYY-MM-DD
+module Extension
+  VERSION = "1.0"
+  DATE = "2014-06-03"
+end
+
+# This is where any custom SassScript should be placed. The functions will be  
+#  available on require of your extension without the need for users to import
+#  any partials. Uncomment below.
+
+# module Sass::Script::Functions
+# 
+# end

data/stylesheets/_flexy.scss

@@ -0,0 +1,43 @@
+@import "compass/css3/shared";
+
+$flexy-support: not -moz, -webkit, not -o, not -ms, not -khtml, official !default;
+$flexy-breakpoint: 769px !default;
+
+@mixin flexy(
+	$el: li,
+	$direction: row,
+	$align: stetch,
+	$justify: flex-start,
+	$grow: 0 1 auto,
+	$breakpoint: $flexy-breakpoint) {
+	
+	@media (min-width: $breakpoint) {
+
+		// Establish the flex formatting context	
+		@include experimental-value(display,flex,$flexy-support...);
+		
+		// Set the default flex-direction
+		@include experimental(flex-direction,$direction,$flexy-support...);
+
+		// Align flex items
+		@include experimental(align-items,$align,$flexy-support...);
+
+		// Define the flex container alignment
+		@include experimental(justify-content,$justify,$flexy-support...);
+
+		// Grow all flex items
+		& > #{$el} {
+			@include experimental(flex,$grow,$flexy-support...);
+		}
+	}
+}
+@mixin flexy-grow($item, $amt) {
+	// Grow individual flex items
+	& > :nth-child(#{$item}) {
+		@include experimental(flex-grow,$amt,$flexy-support...);
+	}
+}
+@mixin flexy-order($order) {
+	// Change order of flex items
+	@include experimental(order,$order,$flexy-support...);
+}

data/templates/project/manifest.rb

@@ -0,0 +1,19 @@
+# Description
+description "A simple Compass extension for Flexbox!"
+
+# Stylesheet Import
+file 'screen.scss', :like => :stylesheet, :media => 'screen, projection'
+
+# General File Import
+# file 'README.md', :to => "README.md"
+
+# Compass Extension Help
+help %Q{
+  Help for your Compass extension
+}
+
+# Compass Extension Welcome Message
+#  Users will see this when they create a new project using this template.
+welcome_message %Q{
+  You have successfully installed Flexy!
+}

data/templates/project/screen.scss

@@ -0,0 +1,3 @@
+// This file will get output into the user's Sass folder.
+// We're going to import our extension's Sass here! Remember to change it!
+@import "extension";

metadata

@@ -0,0 +1,76 @@
+--- !ruby/object:Gem::Specification
+name: flexy
+version: !ruby/object:Gem::Version
+  version: '1.0'
+platform: ruby
+authors:
+- Guil Hernandez
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2014-06-03 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: sass
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - '>='
+      - !ruby/object:Gem::Version
+        version: 3.2.0
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - '>='
+      - !ruby/object:Gem::Version
+        version: 3.2.0
+- !ruby/object:Gem::Dependency
+  name: compass
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - '>='
+      - !ruby/object:Gem::Version
+        version: 0.12.1
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - '>='
+      - !ruby/object:Gem::Version
+        version: 0.12.1
+description: A simple Flexbox Compass extension.
+email:
+- guil@teamtreehouse.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- README.md
+- lib/flexy.rb
+- stylesheets/_flexy.scss
+- templates/project/manifest.rb
+- templates/project/screen.scss
+homepage: http://teamtreehouse.com
+licenses: []
+metadata: {}
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - '>='
+    - !ruby/object:Gem::Version
+      version: 1.3.6
+requirements: []
+rubyforge_project: flexy
+rubygems_version: 2.2.2
+signing_key: 
+specification_version: 4
+summary: Using Flexbox has never been easier.
+test_files: []