toolsmith 0.0.9 → 0.0.10

data/CHANGELOG.md

@@ -1,5 +1,10 @@
 # Changelog
 
+## v0.0.10
+
+* Definition list now captures all marup within it.
+* Definition list helper method is now `definition_list` instead of `definitions`
+
 ## v0.0.9
 
 * Fix Definition List to include `dl-horizontal` class.

data/README.md

@@ -4,21 +4,10 @@ A crafty tool to craft crafty UI's.
 
 ### Install
 
-In your gemfile, specify the private gem source. You can find our private source in http://know.gophilosophie.com
-
-```ruby
-if ENV["TOOLSMITH_GEM_URL"]
-  source ENV["TOOLSMITH_GEM_URL"]
-else
-  raise "Missing ENV var \"TOOLSMITH_GEM_URL\". Please see the README"
-end
-
-```
-
 In your projects gemfile, slap this in there:
 
 ```
-gem "toolsmith", "~> 0.0.1"
+gem "toolsmith"
 ```
 
 Then...
@@ -30,7 +19,7 @@ Profit.
 
 ### Usage
 
-When including toolsmith CSS and JS, you automatically get Bootstrap for free.
+When including toolsmith CSS and JS, you automatically get the Bootstrap CSS / JS for free as well.
 
 #### CSS
 
@@ -40,10 +29,28 @@ In your application.scss file, include an import directive like so:
 import "toolsmith";
 ```
 
-You also have ```toolsmith-responsive``` has an option.
+You also have ```toolsmith-responsive``` has an option, which includes `bootstrap-responsive` and any other responsive designs provided.
 
 #### Javascript
 
 ```js
 #= require toolsmith
-```
+```
+
+
+### What do I get?
+
+Toolsmith's aim is to provide very common UI components with simple methods. Things like Page Headers, Flash messages, etc...
+
+As an example:
+
+```erb
+<%= page_header "Projects", @project.name do |header| %>
+  <% header.button title: "Edit", path: edit_project_path(@project), icon: "pencil" %>
+  <% header.button title: "Delete", path: project_path(@project), icon: "trash", anchor: anchor: { method: :delete, confirm: "Are you sure?" } %>
+<% end %>
+
+```
+
+Gives you something like this for free:
+![Page Header Example](http://i.imgur.com/ycXzDR1.png)

data/app/assets/stylesheets/toolsmith/_variables.scss

@@ -1,217 +1 @@
-$black: #000;
-$grayDarker:  #222;
-$grayDark:  #333;
-$gray:  #555;
-$grayLight: #999;
-$grayLighter: #eee;
-$white: #fff;
-
-$blue:  #049cdb;
-$blueDark:  #0064cd;
-$green: #46a546;
-$red: #9d261d;
-$yellow:  #ffc40d;
-$orange:  #f89406;
-$pink:  #c3325f;
-$purple:  #7a43b6;
-
-$bodyBackground:  rgb(255, 255, 255);
-$textColor: $grayDark;
-
-$linkColor: #E22D60;
-$linkColorHover:  darken($linkColor, 15%);
-
-
-$sansFontFamily:  "Helvetica Neue", Helvetica, Arial, sans-serif;
-$serifFontFamily: Georgia, "Times New Roman", Times, serif;
-$monoFontFamily:  Monaco, Menlo, Consolas, "Courier New", monospace;
-
-$baseFontSize:  14px;
-$baseFontFamily:  $sansFontFamily;
-$baseLineHeight:  20px;
-$altFontFamily: $serifFontFamily;
-
-$headingsFontFamily:  inherit;
-$headingsFontWeight:  bold;
-$headingsColor: inherit;
-
-$fontSizeLarge: $baseFontSize * 1.25;
-$fontSizeSmall: $baseFontSize * 0.85;
-$fontSizeMini:  $baseFontSize * 0.75;
-
-$paddingLarge:  11px 19px;
-$paddingSmall:  2px 10px;
-$paddingMini: 0 6px;
-
-$baseBorderRadius:  4px;
-$borderRadiusLarge: 6px;
-$borderRadiusSmall: 3px;
-
-$tableBackground: transparent;
-$tableBackgroundAccent: #f9f9f9;
-$tableBackgroundHover:  #f5f5f5;
-$tableBorder: #ddd;
-
-$btnBackground: $white;
-$btnBackgroundHighlight:  darken($white, 10%);
-$btnBorder: #bbb;
-
-$btnPrimaryBackground:  #6d6d6d;
-$btnPrimaryBackgroundHighlight: darken($btnPrimaryBackground, 10%);
-
-$btnInfoBackground: #6d6d6d;
-$btnInfoBackgroundHighlight:  darken($btnInfoBackground, 10%);
-
-$btnSuccessBackground:  #6d6d6d;
-$btnSuccessBackgroundHighlight: darken($btnSuccessBackground, 10%);
-
-$btnWarningBackground:  #E22D60;
-$btnWarningBackgroundHighlight: darken($btnWarningBackground, 10%);
-
-$btnDangerBackground: #E22D60;
-$btnDangerBackgroundHighlight:  darken($btnDangerBackground, 10%);
-
-$btnInverseBackground:  #444;
-$btnInverseBackgroundHighlight: $grayDarker;
-
-$inputBackground: $white;
-$inputBorder: #ccc;
-$inputBorderRadius: $baseBorderRadius;
-$inputDisabledBackground: $grayLighter;
-$formActionsBackground: #f5f5f5;
-$inputHeight: $baseLineHeight + 10px;
-
-$dropdownBackground:  $white;
-$dropdownBorder:  rgba(0,0,0,.2);
-$dropdownDividerTop:  #e5e5e5;
-$dropdownDividerBottom: $white;
-
-$dropdownLinkColor: #6d6d6d;
-$dropdownLinkColorHover:  $white;
-$dropdownLinkColorActive: $white;
-
-$dropdownLinkBackgroundActive:  #E22D60;
-$dropdownLinkBackgroundHover: #E22D60;
-
-$zindexDropdown:  1000;
-$zindexPopover: 1010;
-$zindexTooltip: 1030;
-$zindexFixedNavbar: 1030;
-$zindexModalBackdrop: 1040;
-$zindexModal: 1050;
-
-$placeholderText: $grayLight;
-
-$hrBorder:  $grayLighter;
-$horizontalComponentOffset: 180px;
-
-$wellBackground:  #f5f5f5;
-
-$navbarCollapseWidth: 900px;
-$navbarCollapseDesktopWidth:  $navbarCollapseWidth + 1;
-
-$navbarHeight:  40px;
-$navbarBackgroundHighlight: #202020;
-$navbarBackground:  darken($navbarBackgroundHighlight, 5%);
-$navbarBorder:  darken($navbarBackground, 12%);
-
-$navbarText:  #E22D60;
-$navbarLinkColor: #6d6d6d;
-$navbarLinkColorHover:  #aaaaaa;
-$navbarLinkColorActive: #E22D60;
-$navbarLinkBackgroundHover: transparent;
-$navbarLinkBackgroundActive:  darken($navbarBackground, 5%);
-
-$navbarBrandColor:  #E22D60;
-
-$navbarInverseBackground: #111111;
-$navbarInverseBackgroundHighlight:  #222222;
-$navbarInverseBorder: #252525;
-
-$navbarInverseText: $grayLight;
-$navbarInverseLinkColor:  $navbarLinkColor;
-$navbarInverseLinkColorHover: $navbarLinkColorHover;
-$navbarInverseLinkColorActive:  $navbarLinkColorActive;
-$navbarInverseLinkBackgroundHover:  transparent;
-$navbarInverseLinkBackgroundActive: $navbarInverseBackground;
-
-$navbarInverseSearchBackground: lighten($navbarInverseBackground, 25%);
-$navbarInverseSearchBackgroundFocus:  $white;
-$navbarInverseSearchBorder: $navbarInverseBackground;
-$navbarInverseSearchPlaceholderColor: #ccc;
-
-$navbarInverseBrandColor: $navbarBrandColor;
-
-
-// Pagination
-// -------------------------
-$paginationBackground:  #fff;
-$paginationBorder:  #ddd;
-$paginationActiveBackground:  #f5f5f5;
-
-
-// Hero unit
-// -------------------------
-$heroUnitBackground:  #F5F5F5;
-$heroUnitHeadingColor:  inherit;
-$heroUnitLeadColor: inherit;
-
-
-// Form states and alerts
-// -------------------------
-$warningText: #c09853;
-$warningBackground: #fcf8e3;
-$warningBorder: darken(adjust-hue($warningBackground, -10), 3%);
-
-$errorText: #E22D60;
-$errorBackground: #f9e3e9;
-$errorBorder: darken(adjust-hue($errorBackground, -10), 3%);
-
-$successText: #333333;
-$successBackground: #ededed;
-$successBorder: darken(adjust-hue($successBackground, -10), 5%);
-
-$infoText:  #333333;
-$infoBackground:  #ededed;
-$infoBorder:  darken(adjust-hue($infoBackground, -10), 7%);
-
-
-// Tooltips and popovers
-// -------------------------
-$tooltipColor:  #fff;
-$tooltipBackground: #000;
-$tooltipArrowWidth: 5px;
-$tooltipArrowColor: $tooltipBackground;
-
-$popoverBackground: #fff;
-$popoverArrowWidth: 10px;
-$popoverArrowColor: #fff;
-$popoverTitleBackground:  darken($popoverBackground, 3%);
-
-// Special enhancement for popovers
-$popoverArrowOuterWidth:  $popoverArrowWidth + 1;
-$popoverArrowOuterColor:  rgba(0,0,0,.25);
-
-
-$gridColumns: 12;
-$gridColumnWidth: 60px;
-$gridGutterWidth: 20px;
-$gridRowWidth:  ($gridColumns * $gridColumnWidth) + ($gridGutterWidth * ($gridColumns - 1));
-
-$gridColumnWidth1200: 70px;
-$gridGutterWidth1200: 30px;
-$gridRowWidth1200:  ($gridColumns * $gridColumnWidth1200) + ($gridGutterWidth1200 * ($gridColumns - 1));
-
-$gridColumnWidth768:  42px;
-$gridGutterWidth768:  20px;
-$gridRowWidth768: ($gridColumns * $gridColumnWidth768) + ($gridGutterWidth768 * ($gridColumns - 1));
-
-
-$fluidGridColumnWidth:  percentage($gridColumnWidth/$gridRowWidth);
-$fluidGridGutterWidth:  percentage($gridGutterWidth/$gridRowWidth);
-
-$fluidGridColumnWidth1200:  percentage($gridColumnWidth1200/$gridRowWidth1200);
-$fluidGridGutterWidth1200:  percentage($gridGutterWidth1200/$gridRowWidth1200);
-
-$fluidGridColumnWidth768: percentage($gridColumnWidth768/$gridRowWidth768);
-$fluidGridGutterWidth768: percentage($gridGutterWidth768/$gridRowWidth768);
+@import "bootstrap/variables";

data/lib/toolsmith/helpers/definition_list_helpers.rb

@@ -1,10 +1,24 @@
 module Toolsmith
   module ViewHelpers
     module DefinitionListHelpers
-      def definitions(&block)
-        definition_list = Toolsmith::Views::DefinitionList.new(self)
-        yield definition_list if block_given?
-        definition_list
+      # Generates a Definition List
+      #
+      # ```
+      # <%= definition_list do |dl| %>
+      #   <%= dl.define "Name", "Robert Ross" %>
+      # <% end %>
+      # ```
+      #
+      # Will output:
+      #
+      # ```
+      # <dl class="dl-horizontal">
+      #   <dt>Name</dt><dd>Robert Ross</dd>
+      # </dl>
+      # ```
+      #
+      def definition_list(options={}, &block)
+        Toolsmith::Views::DefinitionList.new(self, options, &block)
       end
     end
   end

data/lib/toolsmith/helpers/grid_helpers.rb

@@ -1,11 +1,46 @@
 module Toolsmith
   module ViewHelpers
     module GridHelpers
+
+      # Generates a grid row.
+      #
+      # ```
+      # <%= row do %>
+      #   Content
+      # <% end %>
+      # ```
+      # Will output:
+      #
+      # ```
+      # <div class="row">
+      #   Content
+      # </div>
+      # ```
+      # @param options [Hash]
+      # @return [String] `<div class="row">Content</div>`
       def row(options={}, &block)
         row_class = options[:fluid] ? "row-fluid" : "row"
         content_tag(:div, class: row_class, &block)
       end
 
+      # Returns a grid column element.
+      #
+      # ```
+      # <%= column 12 do %>
+      #   I'm in a column!
+      # <% end %>
+      # ```
+      # Will output:
+      #
+      # ```
+      # <div class="span12">
+      #   I'm in a column!
+      # </div>
+      # ```
+      #
+      # @param width [Fixnum]
+      # @param options [Hash]
+      # @return [String]
       def column(width, options = {}, &block)
         classes = %W[span#{width}]
         classes << "offset#{options[:offset]}" if options[:offset]
@@ -13,6 +48,24 @@ module Toolsmith
         content_tag(:div, class: classes,  &block)
       end
 
+      # Create a row and fullwidth column (based on the standard 12 wide)
+      #
+      # ```
+      # <%= full_width_column do %>
+      #   My more-to-love column.
+      # <% end %>
+      # ```
+      # Will output:
+      #
+      # ```
+      # <div class="row">
+      #   <div class="span12">
+      #     My more-to-love column.
+      #   </div>
+      # </div>
+      # ```
+      # @see #row
+      # @see #column
       def full_width_column(options={}, &block)
         row(options) do
           column(12, &block)

data/lib/toolsmith/version.rb

@@ -1,3 +1,3 @@
 module Toolsmith
-  VERSION = "0.0.9"
+  VERSION = "0.0.10"
 end

data/lib/toolsmith/views/definition_list.rb

@@ -1,26 +1,29 @@
 module Toolsmith
   module Views
     class DefinitionList < Base
-      Definition = Struct.new(:term, :description)
+      DEFAULT_CLASS = "dl-horizontal"
 
-      def definitions
-        @definitions ||= []
+      attr_reader :content_block, :options
+
+      def initialize(context, options={}, &block)
+        @content_block = block if block_given?
+        @options = options
+        super(context, &nil)
       end
 
       def define(term, description)
-        definitions << Definition.new(term, description)
+        content_tag(:dt, term) + content_tag(:dd, description || " ")
       end
 
       def to_s
-        content_tag :dl, list_body, class: "dl-horizontal"
+        content = context.capture(self, &content_block)
+        content_tag :dl, content, dl_options
       end
 
       private
 
-      def list_body
-        definitions.map do |definition|
-          "#{content_tag :dt, definition.term}#{content_tag :dd, definition.description}".html_safe
-        end.html_join
+      def dl_options
+        { class: !options[:horizontal] ? DEFAULT_CLASS : "" }
       end
     end
   end

metadata

@@ -1,32 +1,39 @@
 --- !ruby/object:Gem::Specification
 name: toolsmith
 version: !ruby/object:Gem::Version
-  version: 0.0.9
+  version: 0.0.10
   prerelease: 
 platform: ruby
 authors:
 - Robert Ross
+- Brendan Loudermilk
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2013-02-01 00:00:00.000000000 Z
+date: 2013-02-15 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
   requirement: !ruby/object:Gem::Requirement
     none: false
     requirements:
-    - - ~>
+    - - ! '>='
       - !ruby/object:Gem::Version
         version: 3.2.11
+    - - <
+      - !ruby/object:Gem::Version
+        version: '4.1'
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     none: false
     requirements:
-    - - ~>
+    - - ! '>='
       - !ruby/object:Gem::Version
         version: 3.2.11
+    - - <
+      - !ruby/object:Gem::Version
+        version: '4.1'
 - !ruby/object:Gem::Dependency
   name: compass-rails
   requirement: !ruby/object:Gem::Requirement
@@ -142,6 +149,7 @@ dependencies:
 description: Toolsmith provides common helpers for UI components and styles.
 email:
 - bobby@gophilosophie.com
+- brendan@gophilosophie.com
 executables: []
 extensions: []
 extra_rdoc_files: []