govuk_admin_template 1.0.4 → 1.0.5

data/CHANGELOG.md

@@ -1,3 +1,7 @@
+# 1.0.5
+
+* Tweak to size of inputs when using input helper classes
+
 # 1.0.4
 
 * Fix precompile error with IE7 css

data/app/assets/stylesheets/govuk_admin_template/input_helpers.css.scss

@@ -6,47 +6,47 @@
    ========================================================================== */
 
 .input-md-1 {
-  @include col-md-width(1);
+  @include input-md-width(1);
 }
 
 .input-md-2 {
-  @include col-md-width(2);
+  @include input-md-width(2);
 }
 
 .input-md-3 {
-  @include col-md-width(3);
+  @include input-md-width(3);
 }
 
 .input-md-4 {
-  @include col-md-width(4);
+  @include input-md-width(4);
 }
 
 .input-md-5 {
-  @include col-md-width(5);
+  @include input-md-width(5);
 }
 
 .input-md-6 {
-  @include col-md-width(6);
+  @include input-md-width(6);
 }
 
 .input-md-7 {
-  @include col-md-width(7);
+  @include input-md-width(7);
 }
 
 .input-md-8 {
-  @include col-md-width(8);
+  @include input-md-width(8);
 }
 
 .input-md-9 {
-  @include col-md-width(9);
+  @include input-md-width(9);
 }
 
 .input-md-10 {
-  @include col-md-width(10);
+  @include input-md-width(10);
 }
 
 .input-md-11 {
-  @include col-md-width(11);
+  @include input-md-width(11);
 }
 
 .form-inline {

data/app/assets/stylesheets/govuk_admin_template/mixins.css.scss

@@ -50,6 +50,10 @@
   box-sizing: border-box;
 }
 
-@mixin col-md-width($x) {
-  max-width: ($container-md/$grid-columns) * $x;
+@mixin input-md-width($x) {
+  // Use a proportion of the widest desktop size. At smaller widths inputs
+  // will be constrained by their containers. Take into account padding
+  // from gutter
+  $single-column-width: $container-large-desktop/$grid-columns;
+  max-width: ($single-column-width * $x) - $grid-gutter-width;
 }

data/app/views/govuk_admin_template/style_guide/index.html.erb

@@ -56,6 +56,28 @@
     </div>
   </div>
 </div>
+
+<h3 class="add-bottom-margin">Inputs in a grid</h3>
+<div class="row">
+  <div class="col-md-1">
+    <input class="input-md-1 form-control" value="input-md-1" />
+  </div>
+  <div class="col-md-2">
+    <input class="input-md-2 form-control" value="input-md-2" />
+  </div>
+  <div class="col-md-3">
+    <input class="input-md-3 form-control" value="input-md-3" />
+  </div>
+  <div class="col-md-6">
+    <input class="input-md-6 form-control" value="input-md-6" />
+  </div>
+  <div class="col-md-4 add-top-margin">
+    <input class="input-md-4 form-control" value="input-md-4" />
+  </div>
+  <div class="col-md-8 add-top-margin">
+    <input class="input-md-8 form-control" value="input-md-8" />
+  </div>
+</div>
 <hr>
 
 <h2>Buttons</h2>

data/lib/govuk_admin_template/version.rb

@@ -1,3 +1,3 @@
 module GovukAdminTemplate
-  VERSION = "1.0.4"
+  VERSION = "1.0.5"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: govuk_admin_template
 version: !ruby/object:Gem::Version
-  version: 1.0.4
+  version: 1.0.5
   prerelease: 
 platform: ruby
 authors:
@@ -202,7 +202,7 @@ required_ruby_version: !ruby/object:Gem::Requirement
       version: '0'
       segments:
       - 0
-      hash: -1906158641196771987
+      hash: 2116947858523364151
 required_rubygems_version: !ruby/object:Gem::Requirement
   none: false
   requirements:
@@ -211,7 +211,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
       segments:
       - 0
-      hash: -1906158641196771987
+      hash: 2116947858523364151
 requirements: []
 rubyforge_project: 
 rubygems_version: 1.8.23