jap_mag 0.0.3 → 0.0.4

data/.gitignore

@@ -15,3 +15,4 @@ spec/reports
 test/tmp
 test/version_tmp
 tmp
+.DS_Store

data/README.md

@@ -2,7 +2,7 @@
 
 JapMag is the design language created by Felix Ding in the spring of 2012. The essential idea behind JapMag is Japanese Minimalism. It focuses on content itself, and aims to solve information overload. On interaction design, JapMag advocates a flat information architecutre, a one-task-one-step method and a natural content flow on each page. Visually, JapMag stresses typography, whitespace and uses graphical elements as little as possible. Technically, JapMag avoids using Javascript, or overriding browsers' default behaviors.
 
-This gem helps designers start a project that follows JapMag. It consists of several CSS definations, Rails helpers and view templates.
+This gem helps designers start a project that follows JapMag design language. It consists of several CSS definations, Rails helpers and view templates. Think this gem as an UI kit similar to Twitter's Bootstrap, but more tightly integrated with Ruby on Rails.
 
 ## Installation
 

data/app/assets/stylesheets/jap_mag/base.scss

@@ -164,11 +164,11 @@ blockquote {
 		}
 
 		.zh-CN {
-			background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAALCAIAAAD5gJpuAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAFqSURBVHjaYrzOwPAPjJgYQEDAleHVbhADIvgHLPgHiQ0QQCxAlkR9NW8sw+cV/1gV/7Gb/hV4+vfzhj8Mv/78//Pn/+/f/8AkhH1t0yaAAAJp4I37zyz2lDfu79uqv/++/WYz+cuq/vvLxt8gdb+A5K9/v34B2SyyskBLAAII5JAva/7/+/z367a/f3/8ZuT9+//Pr78vQUrB6n4CSSj6/RuoASCAWEDO/fD3ddEfhv9/OE3/sKj8/n7k9/fDQNUIs/+DVf8HawAIIJCT/v38C3Hr95N/GDh/f94AVvT7N8RUBpjxQAVADQABBNLw/y/Ifwy/f/399ufTOpDBEPf8g5sN0QBEDAwAAQTWABEChgOSA9BVA00E2wAQQCANQBbEif/AzoCqgLkbbBYwWP/+//sXqBYggFhAkfL7D7OkJFCOCSj65zfUeFjwg8z++/ffX5AGoGKAAGI8jhSRyIw/SJH9D4aAYQoQYAA6rnMw1jU2vQAAAABJRU5ErkJggg==) no-repeat 0 2px;
+			background: url($flag_zh-cn) no-repeat 0 2px;
 		}
 		
 		.en {
-			background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAALCAIAAAD5gJpuAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAHzSURBVHjaYkxOP8IAB//+Mfz7w8Dwi4HhP5CcJb/n/7evb16/APL/gRFQDiAAw3JuAgAIBEDQ/iswEERjGzBQLEru97ll0g0+3HvqMn1SpqlqGsZMsZsIe0SICA5gt5a/AGIEarCPtFh+6N/ffwxA9OvP/7//QYwff/6fZahmePeB4dNHhi+fGb59Y4zyvHHmCEAAAW3YDzQYaJJ93a+vX79aVf58//69fvEPlpIfnz59+vDhw7t37968efP3b/SXL59OnjwIEEAsDP+YgY53b2b89++/awvLn98MDi2cVxl+/vl6mituCtBghi9f/v/48e/XL86krj9XzwEEEENy8g6gu22rfn78+NGs5Ofr16+ZC58+fvyYwX8rxOxXr169fPny+fPn1//93bJlBUAAsQADZMEBxj9/GBxb2P/9+S/R8u3vzxuyaX8ZHv3j8/YGms3w8ycQARmi2eE37t4ACCDGR4/uSkrKAS35B3TT////wADOgLOBIaXIyjBlwxKAAGKRXjCB0SOEaeu+/y9fMnz4AHQxCP348R/o+l+//sMZQBNLEvif3AcIIMZbty7Ly6t9ZmXl+fXj/38GoHH/UcGfP79//BBiYHjy9+8/oUkNAAHEwt1V/vI/KBY/QSISFqM/GBg+MzB8A6PfYC5EFiDAABqgW776MP0rAAAAAElFTkSuQmCC) no-repeat 0 2px;
+			background: url($flag_en) no-repeat 0 2px;
 		}
 	}
 }

data/app/assets/stylesheets/jap_mag/mixins.scss

@@ -4,6 +4,26 @@
   -webkit-border-radius: $radius;
 }
 
+@mixin columns($count: 2, $gap: 60px) {
+  -moz-column-count: $count;
+  -webkit-column-count: $count;
+  column-count: $count;
+  -moz-column-gap: $gap;
+  -webkit-column-gap: $gap;
+  column-gap: $gap;
+}
+
+@mixin rotate($degrees) {
+  -webkit-transform: rotate(#{$degrees}deg);
+  -moz-transform: rotate(#{$degrees}deg);
+  -ms-transform: rotate(#{$degrees}deg);
+  -o-transform: rotate(#{$degrees}deg);
+  transform: rotate(#{$degrees}deg);
+
+  filter:  progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', M11=#{cos($degrees)}, M12=-#{sin($degrees)}, M21=#{sin($degrees)}, M22=#{cos($degrees)});
+  -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', M11=#{cos($degrees)}, M12=-#{sin($degrees)}, M21=#{sin($degrees)}, M22=#{cos($degrees)})";
+  zoom: 1;
+}
 
 @mixin box-shadow($effect: 1px 0px 5px black) {
 	box-shadow: $effect;
@@ -21,8 +41,7 @@
 	}
 	
 	#wrapper {
-		padding: 10px;
-		margin: 0 auto;
+		padding: 0;
 	}
 	
 	#body {
@@ -36,11 +55,19 @@
 			width: 95%;
 		}
 	}
+	
+	#error_explanation {
+		width: auto;
+	}
 }
 
 @mixin set_width($base_width) {
 	#wrapper {
-		width: $base_width - 20px;
+		width: $base_width !important;
+		
+		.gutter {
+			width: $base_width - 20px;
+		}
 	}
 }
 
@@ -66,4 +93,18 @@
 		@include set_width(568px);
 		@content;
 	}
+}
+
+/* all iPhone */
+@mixin iphone_portrait_and_landscape {
+	@include iphone_portrait {@content};
+	@include iphone_4s_landscape {@content};
+	@include iphone_5_landscape {@content};
+}
+
+/* Desktop, say, 960px width */
+@mixin desktop {
+	@media only screen and (min-width: 768px) {
+		@content;
+	}
 }

data/app/assets/stylesheets/jap_mag/variables.scss

@@ -3,10 +3,15 @@ $base_width: 800px;
 $color_green: #53a440;
 $color_light_green: #7dde66;
 $color_lighter_green: #65b453;
+$color_even_lighter_green: #e0ffe2;
 $color_blue: #3b7fa6; /*#56a1cc;*/
 $color_light_blue: #6aa5c6;
 $color_lighter_blue: #EBF8F9;
 $color_red: #e75151;/*#ff5656;*/
 $color_yellow: #fc9729;
 $color_pink: #FF7676;
-$color_body: #000;
+$color_light_pink: #ffe0e0;
+$color_body: #000;
+
+$flag_zh-cn: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAALCAIAAAD5gJpuAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAFqSURBVHjaYrzOwPAPjJgYQEDAleHVbhADIvgHLPgHiQ0QQCxAlkR9NW8sw+cV/1gV/7Gb/hV4+vfzhj8Mv/78//Pn/+/f/8AkhH1t0yaAAAJp4I37zyz2lDfu79uqv/++/WYz+cuq/vvLxt8gdb+A5K9/v34B2SyyskBLAAII5JAva/7/+/z367a/f3/8ZuT9+//Pr78vQUrB6n4CSSj6/RuoASCAWEDO/fD3ddEfhv9/OE3/sKj8/n7k9/fDQNUIs/+DVf8HawAIIJCT/v38C3Hr95N/GDh/f94AVvT7N8RUBpjxQAVADQABBNLw/y/Ifwy/f/399ufTOpDBEPf8g5sN0QBEDAwAAQTWABEChgOSA9BVA00E2wAQQCANQBbEif/AzoCqgLkbbBYwWP/+//sXqBYggFhAkfL7D7OkJFCOCSj65zfUeFjwg8z++/ffX5AGoGKAAGI8jhSRyIw/SJH9D4aAYQoQYAA6rnMw1jU2vQAAAABJRU5ErkJggg==";
+$flag_en: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAALCAIAAAD5gJpuAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAHzSURBVHjaYkxOP8IAB//+Mfz7w8Dwi4HhP5CcJb/n/7evb16/APL/gRFQDiAAw3JuAgAIBEDQ/iswEERjGzBQLEru97ll0g0+3HvqMn1SpqlqGsZMsZsIe0SICA5gt5a/AGIEarCPtFh+6N/ffwxA9OvP/7//QYwff/6fZahmePeB4dNHhi+fGb59Y4zyvHHmCEAAAW3YDzQYaJJ93a+vX79aVf58//69fvEPlpIfnz59+vDhw7t37968efP3b/SXL59OnjwIEEAsDP+YgY53b2b89++/awvLn98MDi2cVxl+/vl6mituCtBghi9f/v/48e/XL86krj9XzwEEEENy8g6gu22rfn78+NGs5Ofr16+ZC58+fvyYwX8rxOxXr169fPny+fPn1//93bJlBUAAsQADZMEBxj9/GBxb2P/9+S/R8u3vzxuyaX8ZHv3j8/YGms3w8ycQARmi2eE37t4ACCDGR4/uSkrKAS35B3TT////wADOgLOBIaXIyjBlwxKAAGKRXjCB0SOEaeu+/y9fMnz4AHQxCP348R/o+l+//sMZQBNLEvif3AcIIMZbty7Ly6t9ZmXl+fXj/38GoHH/UcGfP79//BBiYHjy9+8/oUkNAAHEwt1V/vI/KBY/QSISFqM/GBg+MzB8A6PfYC5EFiDAABqgW776MP0rAAAAAElFTkSuQmCC";

data/app/assets/stylesheets/jap_mag/widgets.scss

@@ -16,19 +16,18 @@
 
 div.pagination {
 	margin: 10px 0;
+	overflow: hidden;
 
-	em {
+	em, a, span {
 		padding: 10px;
+		float: left;
+		margin: 0 5px 5px 0;
 	}
 
 	.current {
 		background: #aaa;
 		color: #fff;
 	}
-
-	a {
-		padding: 10px;
-	}
 }
 
 #flash {	
@@ -74,6 +73,7 @@ table.basic {
 	margin: 0;
 	padding: 0;
 	width: 100%;
+	word-break: break-all;
 
 	td, & th {
 		margin: 0;
@@ -101,6 +101,14 @@ table.basic {
 	tr:last-child {
 		border-bottom: 1px solid #ccc;
 	}
+	
+	.ok {
+		background: $color_even_lighter_green;
+	}
+	
+	.bad {
+		background: $color_light_pink;
+	}
 }
 
 /* call to action*/
@@ -453,6 +461,10 @@ ul.scopes {
 	}
 }
 
+ul.list {
+	list-style-type: disc;
+}
+
 ol.list {
 	list-style-type: decimal;
 }

data/app/helpers/jap_mag_widgets_helper.rb

@@ -168,20 +168,6 @@ module JapMagWidgetsHelper
     file = File.join("tmp", "restart.txt")
     File.exists?(file) ? File.atime(file) : nil
   end
-  
-  def current_controller_action_in?(*args)
-    args.each do |element|
-      if element.include?("#")
-        array = element.match(/([a-z\-\_]*)#([a-z\-\_]*)/).to_a
-        c, a = array[1], array[2]
-        return true if controller.controller_name == c && controller.action_name == a
-      else
-        return true if controller.controller_name == element
-      end
-    end
-    
-    false
-  end
 
   protected
   

data/app/views/layouts/_footer.erb

@@ -1,11 +1,13 @@
 <div id="footer">
-	<p><%= t :copyright %></p>
-	<%= clearfix %>
-	<ul class="languages">
-		<%
-		p = params.dup.delete_if{|key| %w(action controller locale).include?(key)}
-		%>
-		<li class="en"><%= link_to_unless_current t(:english), locale: :en, params: p %></li>
-		<li class="zh-CN"><%= link_to_unless_current t(:chinese), locale: "zh-CN", params: p %></li>
-	</ul>
+	<div class="gutter">
+		<p><%= t :copyright %></p>
+		<%= clearfix %>
+		<ul class="languages">
+			<%
+			p = params.dup.delete_if{|key| %w(action controller locale).include?(key)}
+			%>
+			<li class="en"><%= link_to_unless_current t(:english), locale: :en, params: p %></li>
+			<li class="zh-CN"><%= link_to_unless_current t(:chinese), locale: "zh-CN", params: p %></li>
+		</ul>
+	</div>
 </div>

data/app/views/layouts/_header.erb

@@ -1,5 +1,7 @@
 <div id="header">
-	<h1><%= link_to t("logo"), root_path %></h1>
-	<p class="slogan"><%= t("slogan") %></p>
-	<%= render "layouts/navigation" %>
+	<div class="gutter">
+		<h1><%= link_to t("logo"), root_path %></h1>
+		<p class="slogan"><%= t("slogan") %></p>
+		<%= render "layouts/navigation" %>
+	</div>
 </div>

data/app/views/layouts/application.erb

@@ -19,8 +19,10 @@
 		<%= render :partial => "/layouts/header" %>
 
 		<div id="body">
-			<%= render :partial => "/layouts/flash", :locals => {:flash => flash} %>
-			<%= yield %>
+			<div class="gutter">
+				<%= render :partial => "/layouts/flash", :locals => {:flash => flash} %>
+				<%= yield %>
+			</div>
 		</div>
 
 		<%= render :partial => "/layouts/footer" %>

data/lib/jap_mag.rb

@@ -1,12 +1,38 @@
 module JapMag
   # i18N
   def _ key, options={}
-    key = (key[0] == "/") ? key.gsub("/", "") : "#{params[:controller]}.#{params[:action]}.#{key}"
+    # for absolute pathes /
+    if (key[0] == "/")
+      key = key.gsub("/", "")
+    
+    # for all other cases  
+    else
+      key = "#{params[:controller]}.#{params[:action]}.#{key}"
+    end
+
     t(key, options)
   end
   
+  def current_controller_action_in?(*args)
+    controller = params["controller"]
+    action = params["action"]
+
+    args.each do |element|
+      if element.include?("#")
+        array = element.match(/([a-z\-\_]*)#([a-z\-\_]*)/).to_a
+        c, a = array[1], array[2]
+        return true if controller == c && action == a
+      else
+        return true if controller == element
+      end
+    end
+  
+    false
+  end
+  
   def self.included base
     base.helper_method :_
+    base.helper_method :current_controller_action_in?
   end
   
   class Engine < Rails::Engine

data/lib/jap_mag/version.rb

@@ -0,0 +1,3 @@
+module JapMag
+  VERSION = "0.0.4"
+end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: jap_mag
 version: !ruby/object:Gem::Version
-  version: 0.0.3
+  version: 0.0.4
   prerelease: 
 platform: ruby
 authors:
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2012-10-19 00:00:00.000000000 Z
+date: 2013-03-29 00:00:00.000000000 Z
 dependencies: []
 description: JapMag is the design language created by Felix Ding. This gem helps designers
   start a project that follows JapMag.
@@ -43,6 +43,7 @@ files:
 - config/locales/en.yml
 - jap_mag.gemspec
 - lib/jap_mag.rb
+- lib/jap_mag/version.rb
 homepage: https://github.com/felixding/JapMag
 licenses: []
 post_install_message: