Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse code

Fixes #3301 - Full width forms.

  • Loading branch information...
commit cb16e2f18639f531bf3347f08b3166f7f2ea7853 1 parent e810c0a
Jasper de Groot authored June 07, 2012
2  css/structure/jquery.mobile.button.css
@@ -81,6 +81,6 @@
81 81
 label.ui-submit { font-size: 16px; line-height: 1.4; font-weight: normal; margin: 0 0 .3em; display: block; }
82 82
 @media all and (min-width: 450px){
83 83
 	.ui-field-contain label.ui-submit { vertical-align: top; display: inline-block; width: 20%; margin: 0 2% 0 0; }
84  
-	.ui-field-contain .ui-btn.ui-submit { width: 60%; display: inline-block; }
  84
+	.ui-field-contain .ui-btn.ui-submit { width: 78%; display: inline-block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
85 85
 	.ui-hide-label .ui-btn.ui-submit { width: auto; }
86 86
 }
3  css/structure/jquery.mobile.controlgroup.css
@@ -24,7 +24,8 @@
24 24
 
25 25
 @media all and (min-width: 450px){
26 26
 	.ui-field-contain .ui-controlgroup-label { vertical-align: top; display: inline-block;  width: 20%;  margin: 0 2% 0 0;  }
27  
-	.ui-field-contain .ui-controlgroup-controls { width: 60%; display: inline-block; }
  27
+	.ui-field-contain .ui-controlgroup-controls { width: 78%; display: inline-block; }
28 28
 	.ui-field-contain .ui-controlgroup .ui-select { width: 100%; } 
29 29
 	.ui-field-contain .ui-controlgroup-horizontal .ui-select { width: auto; }
  30
+	.ui-hide-label .ui-controlgroup-controls { width: 100%; }
30 31
 }	
3  css/structure/jquery.mobile.forms.select.css
@@ -35,7 +35,8 @@ label.ui-select { font-size: 16px; line-height: 1.4;  font-weight: normal; margi
35 35
 
36 36
 @media all and (min-width: 450px){
37 37
 	.ui-field-contain label.ui-select { vertical-align: top;  display: inline-block;  width: 20%;  margin: 0 2% 0 0; }
38  
-	.ui-field-contain .ui-select { width: 60%; display: inline-block; }
  38
+	.ui-field-contain .ui-select { width: 78%; display: inline-block; }
  39
+	.ui-hide-label .ui-select { width: 100%; } 
39 40
 }
40 41
 
41 42
 /* when no placeholder is defined in a multiple select, the header height doesn't even extend past the close button.  this shim's content in there */
9  css/structure/jquery.mobile.forms.textinput.css
... ...
@@ -1,5 +1,6 @@
1 1
 label.ui-input-text { font-size: 16px; line-height: 1.4; display: block; font-weight: normal; margin: 0 0 .3em; }
2  
-input.ui-input-text, textarea.ui-input-text { background-image: none; padding: .4em; line-height: 1.4; font-size: 16px; display: block; width: 97%; outline: 0; }
  2
+input.ui-input-text, textarea.ui-input-text { background-image: none; padding: .4em; line-height: 1.4; font-size: 16px; display: block; width: 100%; outline: 0; }
  3
+input.ui-input-text, textarea.ui-input-text, .ui-input-search { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
3 4
 .ui-header input.ui-input-text,
4 5
 .ui-footer input.ui-input-text { margin-left: 1.25%; padding: .4em 1%; width: 95.5% } /* Note that padding left/right on text inputs is factored into how the element is displayed in Firefox, but does not actually pad the text inside it. */
5 6
  input.ui-input-text { -webkit-appearance: none; }
@@ -14,15 +15,13 @@ textarea.ui-input-text { height: 50px; -webkit-transition: height 200ms linear;
14 15
 input.ui-mini, .ui-mini input, textarea.ui-mini { font-size: 14px; }
15 16
 textarea.ui-mini { height: 45px; }
16 17
 
17  
-/* orientation adjustments - incomplete!*/
18 18
 @media all and (min-width: 450px){
19 19
 	.ui-field-contain label.ui-input-text  { vertical-align: top; display: inline-block;  width: 20%;  margin: 0 2% 0 0 }
20 20
 	.ui-field-contain input.ui-input-text, 
21 21
 	.ui-field-contain textarea.ui-input-text, 
22  
-	.ui-field-contain .ui-input-search { width: 60%; display: inline-block; } 
23  
-	.ui-field-contain .ui-input-search { width: 50%; }
  22
+	.ui-field-contain .ui-input-search { width: 78%; display: inline-block; } 
24 23
 	.ui-hide-label input.ui-input-text, 
25 24
 	.ui-hide-label textarea.ui-input-text, 
26  
-	.ui-hide-label .ui-input-search { padding: .4em; width: 97%; } 
  25
+	.ui-hide-label .ui-input-search { width: 100%; }
27 26
 	.ui-input-search input.ui-input-text { width: 98%; /*echos rule from above*/ }
28 27
 }
6  js/jquery.mobile.fieldContain.js
@@ -10,7 +10,11 @@ define( [ "jquery" ], function( $ ) {
10 10
 (function( $, undefined ) {
11 11
 
12 12
 $.fn.fieldcontain = function( options ) {
13  
-	return this.addClass( "ui-field-contain ui-body ui-br" );
  13
+	return this
  14
+		.addClass( "ui-field-contain ui-body ui-br" )
  15
+		.contents().filter( function() {
  16
+			return ( this.nodeType === 3 && !/\S/.test( this.nodeValue ) );
  17
+		}).remove();
14 18
 };
15 19
 
16 20
 //auto self-init widgets

0 notes on commit cb16e2f

Please sign in to comment.
Something went wrong with that request. Please try again.