From a2e0955bca647f3a8925b737e7fb67b14591a1df Mon Sep 17 00:00:00 2001
From: Nicola Fontana <ntd@entidi.it>
Date: Thu, 28 Jul 2016 23:53:32 +0200
Subject: [PATCH 1/8] Render help description as tooltip on form fields

---
 css/silverstrap.css          | 3 +++
 js/silverstrap.js            | 6 ++++++
 templates/forms/FormField.ss | 2 +-
 3 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/css/silverstrap.css b/css/silverstrap.css
index 3c6aca9..9f3efb8 100644
--- a/css/silverstrap.css
+++ b/css/silverstrap.css
@@ -259,6 +259,9 @@ ul.nav-stacked ul > li:last-child:visible > a {
 	background-color: #0088cc;
 	cursor: pointer;
 }
+.tooltip-inner {
+	width: 20em;
+}
 
 /**
  * Hovering content component, i.e. new content that appears above default
diff --git a/js/silverstrap.js b/js/silverstrap.js
index e794d5a..7ba83a1 100644
--- a/js/silverstrap.js
+++ b/js/silverstrap.js
@@ -28,6 +28,12 @@ var silverstrap = {
 $(document).ready(function () {
   var $subject;
 
+  // Enable help tooltips for form elements
+  $subject = $('[data-toggle="tooltip"]');
+  $subject.tooltip({
+    placement: 'right'
+  });
+
   // Enable colorbox support on Fotorama frames
   if ($.isFunction($.colorbox) && $.isFunction($.Fotorama)) {
     var transition;
diff --git a/templates/forms/FormField.ss b/templates/forms/FormField.ss
index 2a83b28..668afff 100644
--- a/templates/forms/FormField.ss
+++ b/templates/forms/FormField.ss
@@ -1 +1 @@
-<input class="form-control $extraClass" $getAttributesHTML('class')<% if $isReadonly %> readonly<% else_if $isDisabled %> disabled<% end_if %>>
+<input class="form-control $extraClass" $getAttributesHTML('class')<% if $isReadonly %> readonly<% else_if $isDisabled %> disabled<% end_if %><% if $Description && not $isDisabled %> data-toggle="tooltip" title="$Description.ATT"<% end_if %>>

From e5b634453e95186bea9a05e9ddf37b0b72acdf3f Mon Sep 17 00:00:00 2001
From: Nicola Fontana <ntd@entidi.it>
Date: Fri, 29 Jul 2016 16:08:40 +0200
Subject: [PATCH 2/8] Use custom classes provided by the
 entidi/silverstrap-module

---
 composer.json                                  | 3 ++-
 templates/forms/CheckboxField_holder.ss        | 2 +-
 templates/forms/DropdownField.ss               | 2 +-
 templates/forms/FieldGroup_holder.ss           | 6 +++---
 templates/forms/FormField.ss                   | 2 +-
 templates/forms/FormField_holder.ss            | 6 +++---
 templates/forms/FormField_holder_small.ss      | 4 ++--
 templates/forms/Literal_holder.ss              | 4 ++--
 templates/forms/OptionsetField_holder_small.ss | 4 ++--
 templates/forms/TextareaField.ss               | 2 +-
 10 files changed, 18 insertions(+), 17 deletions(-)

diff --git a/composer.json b/composer.json
index 1788960..0b7cac5 100644
--- a/composer.json
+++ b/composer.json
@@ -18,7 +18,8 @@
         "source": "http://dev.entidi.com/p/silverstrap/source/tree/master/"
     },
     "require": {
-        "silverstripe/framework": "~3.1"
+        "silverstripe/framework": "~3.1",
+        "entidi/silverstrap-module": "~1.0"
     },
     "extra": {
         "screenshots": [
diff --git a/templates/forms/CheckboxField_holder.ss b/templates/forms/CheckboxField_holder.ss
index ff9698c..211f5ab 100644
--- a/templates/forms/CheckboxField_holder.ss
+++ b/templates/forms/CheckboxField_holder.ss
@@ -1,5 +1,5 @@
 <div class="form-group $HolderClasses<% if $Message %> has-error<% end_if %>">
-  <div class="col-sm-offset-3 col-sm-6">
+  <div class="$Silverstrap.no_label $Silverstrap.holder">
     <div class="checkbox<% if $isReadonly || $isDisabled %> disabled<% end_if %>">
       <label>
         $Field
diff --git a/templates/forms/DropdownField.ss b/templates/forms/DropdownField.ss
index 5735195..d0ba5c5 100644
--- a/templates/forms/DropdownField.ss
+++ b/templates/forms/DropdownField.ss
@@ -1,3 +1,3 @@
-<select  class="form-control $extraClass" $getAttributesHTML('class')<% if $isReadonly %> readonly<% else_if $isDisabled %> disabled<% end_if %>><% loop $Options %>
+<select  class="$Silverstrap.control $extraClass" $getAttributesHTML('class')<% if $isReadonly %> readonly<% else_if $isDisabled %> disabled<% end_if %>><% loop $Options %>
   <option value="$Value.XML"<% if $Selected %> selected<% end_if %><% if $Disabled %> disabled<% end_if %>><% if $Title.exists %>$Title.XML<% else %>&nbsp;<% end_if %></option><% end_loop %>
 </select>
diff --git a/templates/forms/FieldGroup_holder.ss b/templates/forms/FieldGroup_holder.ss
index a45942a..24d3907 100644
--- a/templates/forms/FieldGroup_holder.ss
+++ b/templates/forms/FieldGroup_holder.ss
@@ -1,10 +1,10 @@
 <div class="form-group $HolderClasses<% if $Message %> has-error<% end_if %>"><% if $Title %>
-  <label class="control-label col-sm-3"<% if $ID %> for="$ID"<% end_if %>>$Title</label><% end_if %><% loop $FieldList %>
+  <label class="$Silverstrap.label"<% if $ID %> for="$ID"<% end_if %>>$Title</label><% end_if %><% loop $FieldList %>
   <%-- The following div should pertain to SmallFieldHolder but I cannot pass parameters
        to the underlying templates for applying the offset only to the first field --%>
-  <div class="col-sm-2<% if not $Up.Title && $First %> col-sm-offset-3<% end_if %>">
+  <div class="$Silverstrap.small_holder<% if not $Up.Title && $First %> $Silverstrap.no_label<% end_if %>">
     $SmallFieldHolder
   </div><% end_loop %><% if $Message %>
   <p class="help-block">$Message</p><% end_if %><% if $RightTitle %>
-  <label class="control-label col-sm-3"<% if $ID %> for="$ID"<% end_if %>>$RightTitle</label><% end_if %>
+  <label class="$Silverstrap.right_label"<% if $ID %> for="$ID"<% end_if %>>$RightTitle</label><% end_if %>
 </div>
diff --git a/templates/forms/FormField.ss b/templates/forms/FormField.ss
index 668afff..2521a67 100644
--- a/templates/forms/FormField.ss
+++ b/templates/forms/FormField.ss
@@ -1 +1 @@
-<input class="form-control $extraClass" $getAttributesHTML('class')<% if $isReadonly %> readonly<% else_if $isDisabled %> disabled<% end_if %><% if $Description && not $isDisabled %> data-toggle="tooltip" title="$Description.ATT"<% end_if %>>
+<input class="$Silverstrap.control $extraClass" $getAttributesHTML('class')<% if $isReadonly %> readonly<% else_if $isDisabled %> disabled<% end_if %><% if $Description && not $isDisabled %> data-toggle="tooltip" title="$Description.ATT"<% end_if %>>
diff --git a/templates/forms/FormField_holder.ss b/templates/forms/FormField_holder.ss
index 335bdac..1ab2e04 100644
--- a/templates/forms/FormField_holder.ss
+++ b/templates/forms/FormField_holder.ss
@@ -1,8 +1,8 @@
 <div class="form-group $HolderClasses<% if $Message %> has-error<% end_if %>"><% if $Title %>
-  <label class="control-label col-sm-3"<% if $ID %> for="$ID"<% end_if %>>$Title</label><% end_if %>
-  <div class="<% if not $Title %>col-sm-offset-3 <% end_if %>col-sm-6 $extraClass">
+  <label class="$Silverstrap.label"<% if $ID %> for="$ID"<% end_if %>>$Title</label><% end_if %>
+  <div class="<% if not $Title %>$Silverstrap.no_label <% end_if %>$Silverstrap.holder $extraClass">
     $Field<% if $Message %>
     <p class="help-block">$Message</p><% end_if %>
   </div><% if $RightTitle %>
-  <label class="control-label col-sm-3"<% if $ID %> for="$ID"<% end_if %>>$RightTitle</label><% end_if %>
+  <label class="$Silverstrap.right_label"<% if $ID %> for="$ID"<% end_if %>>$RightTitle</label><% end_if %>
 </div>
diff --git a/templates/forms/FormField_holder_small.ss b/templates/forms/FormField_holder_small.ss
index 3a645a8..ab258a3 100644
--- a/templates/forms/FormField_holder_small.ss
+++ b/templates/forms/FormField_holder_small.ss
@@ -1,3 +1,3 @@
-<% if $Title %><label class="control-label"<% if $ID %> for="$ID"<% end_if %>>$Title</label><% end_if %>
+<% if $Title %><label class="$Silverstrap.small_label"<% if $ID %> for="$ID"<% end_if %>>$Title</label><% end_if %>
 $Field<% if $RightTitle %>
-<label class="control-label"<% if $ID %> for="$ID"<% end_if %>>$RightTitle</label><% end_if %>
+<label class="$Silverstrap.small_right_label"<% if $ID %> for="$ID"<% end_if %>>$RightTitle</label><% end_if %>
diff --git a/templates/forms/Literal_holder.ss b/templates/forms/Literal_holder.ss
index c8af8f9..99c3b2b 100644
--- a/templates/forms/Literal_holder.ss
+++ b/templates/forms/Literal_holder.ss
@@ -1,6 +1,6 @@
 <div class="form-group"><% if $Title %>
-  <label class="control-label col-sm-3"<% if $ID %> for="$ID"<% end_if %>>$Title</label><% end_if %>
-  <div class="<% if not $Title %>col-sm-offset-3 <% end_if %>col-sm-9">
+  <label class="$Silverstrap.label"<% if $ID %> for="$ID"<% end_if %>>$Title</label><% end_if %>
+  <div class="<% if not $Title %>$Silverstrap.no_label <% end_if %>$Silverstrap.holder">
     $Field
   </div>
 </div>
diff --git a/templates/forms/OptionsetField_holder_small.ss b/templates/forms/OptionsetField_holder_small.ss
index 3e2de7d..0a72d72 100644
--- a/templates/forms/OptionsetField_holder_small.ss
+++ b/templates/forms/OptionsetField_holder_small.ss
@@ -1,5 +1,5 @@
-<% if $Title %><label class="control-label"<% if $ID %> for="$ID"<% end_if %>>$Title</label><% end_if %>
+<% if $Title %><label class="$Silverstrap.small_label"<% if $ID %> for="$ID"<% end_if %>>$Title</label><% end_if %>
 <div>
   $Field
 </div><% if $RightTitle %>
-<label class="control-label"<% if $ID %> for="$ID"<% end_if %>>$RightTitle</label><% end_if %>
+<label class="$Silverstrap.small_right_label"<% if $ID %> for="$ID"<% end_if %>>$RightTitle</label><% end_if %>
diff --git a/templates/forms/TextareaField.ss b/templates/forms/TextareaField.ss
index ed9d3ff..4628e4a 100644
--- a/templates/forms/TextareaField.ss
+++ b/templates/forms/TextareaField.ss
@@ -1 +1 @@
-<textarea class="form-control $extraClass" $getAttributesHTML('class')<% if $isReadonly %> readonly<% else_if $isDisabled %> disabled<% end_if %>>$Value</textarea>
+<textarea class="$Silverstrap.control $extraClass" $getAttributesHTML('class')<% if $isReadonly %> readonly<% else_if $isDisabled %> disabled<% end_if %>>$Value</textarea>

From 5ee440293ba009059577ef73fa27116a4bf8ad9e Mon Sep 17 00:00:00 2001
From: Nicola Fontana <ntd@entidi.it>
Date: Fri, 29 Jul 2016 18:53:54 +0200
Subject: [PATCH 3/8] Dynamicize form > div classes

Those will typically be only .form-group but... just in case.
---
 templates/Includes/Form.ss              | 37 +++++++++++++------------
 templates/forms/CheckboxField_holder.ss |  2 +-
 templates/forms/FieldGroup_holder.ss    |  2 +-
 templates/forms/FormField_holder.ss     |  2 +-
 templates/forms/Literal_holder.ss       |  2 +-
 5 files changed, 24 insertions(+), 21 deletions(-)

diff --git a/templates/Includes/Form.ss b/templates/Includes/Form.ss
index 39ce36e..ba25cfb 100644
--- a/templates/Includes/Form.ss
+++ b/templates/Includes/Form.ss
@@ -1,18 +1,21 @@
 <% if $IncludeFormTag %>
-<form class="form-horizontal $extraClass" $getAttributesHTML('class') role="form"><% end_if %><% if $Message %>
-	<div id="{$FormName}_error" class="alert $MessageType">
-		<button type="button" class="close" data-dismiss="alert">&times;</button>
-		$Message
-	</div><% else %>
-	<div id="{$FormName}_error" class="alert hide $MessageType"></div><% end_if %>
-
-	<fieldset><% if $Legend %>
-		<legend>$Legend</legend><% end_if %><% loop $Fields %>
-		$FieldHolder<% end_loop %>
-	</fieldset><% if $Actions %>
-	<div class="form-group">
-		<div class="col-sm-offset-3 col-sm-9"><% loop $Actions %>
-			$Field<% end_loop %>
-		</div>
-	</div><% end_if %><% if $IncludeFormTag %>
-</form><% end_if %>
+<div class="row">
+  <form class="form-horizontal $extraClass" $getAttributesHTML('class') role="form"><% end_if %><% if $Message %>
+    <div id="{$FormName}_error" class="alert $MessageType">
+      <button type="button" class="close" data-dismiss="alert">&times;</button>
+      $Message
+    </div><% else %>
+    <div id="{$FormName}_error" class="alert hide $MessageType"></div><% end_if %>
+    <fieldset><% if $Legend %>
+      <legend>$Legend</legend><% end_if %><% loop $Fields %>
+      $FieldHolder<% end_loop %>
+    </fieldset><% if $Actions %>
+    <div class="row">
+      <div class="$Silverstrap.group">
+        <div class="$Silverstrap.no_label $Silverstrap.holder"><% loop $Actions %>
+          $Field<% end_loop %>
+        </div>
+      </div><% end_if %><% if $IncludeFormTag %>
+    </div>
+  </form><% end_if %>
+</div>
diff --git a/templates/forms/CheckboxField_holder.ss b/templates/forms/CheckboxField_holder.ss
index 211f5ab..352cb21 100644
--- a/templates/forms/CheckboxField_holder.ss
+++ b/templates/forms/CheckboxField_holder.ss
@@ -1,4 +1,4 @@
-<div class="form-group $HolderClasses<% if $Message %> has-error<% end_if %>">
+<div class="$Silverstrap.group $HolderClasses<% if $Message %> has-error<% end_if %>">
   <div class="$Silverstrap.no_label $Silverstrap.holder">
     <div class="checkbox<% if $isReadonly || $isDisabled %> disabled<% end_if %>">
       <label>
diff --git a/templates/forms/FieldGroup_holder.ss b/templates/forms/FieldGroup_holder.ss
index 24d3907..8c80e43 100644
--- a/templates/forms/FieldGroup_holder.ss
+++ b/templates/forms/FieldGroup_holder.ss
@@ -1,4 +1,4 @@
-<div class="form-group $HolderClasses<% if $Message %> has-error<% end_if %>"><% if $Title %>
+<div class="$Silverstrap.group $HolderClasses<% if $Message %> has-error<% end_if %>"><% if $Title %>
   <label class="$Silverstrap.label"<% if $ID %> for="$ID"<% end_if %>>$Title</label><% end_if %><% loop $FieldList %>
   <%-- The following div should pertain to SmallFieldHolder but I cannot pass parameters
        to the underlying templates for applying the offset only to the first field --%>
diff --git a/templates/forms/FormField_holder.ss b/templates/forms/FormField_holder.ss
index 1ab2e04..dd6d68b 100644
--- a/templates/forms/FormField_holder.ss
+++ b/templates/forms/FormField_holder.ss
@@ -1,4 +1,4 @@
-<div class="form-group $HolderClasses<% if $Message %> has-error<% end_if %>"><% if $Title %>
+<div class="$Silverstrap.group $HolderClasses<% if $Message %> has-error<% end_if %>"><% if $Title %>
   <label class="$Silverstrap.label"<% if $ID %> for="$ID"<% end_if %>>$Title</label><% end_if %>
   <div class="<% if not $Title %>$Silverstrap.no_label <% end_if %>$Silverstrap.holder $extraClass">
     $Field<% if $Message %>
diff --git a/templates/forms/Literal_holder.ss b/templates/forms/Literal_holder.ss
index 99c3b2b..32b9cb3 100644
--- a/templates/forms/Literal_holder.ss
+++ b/templates/forms/Literal_holder.ss
@@ -1,4 +1,4 @@
-<div class="form-group"><% if $Title %>
+<div class="$Silverstrap.group"><% if $Title %>
   <label class="$Silverstrap.label"<% if $ID %> for="$ID"<% end_if %>>$Title</label><% end_if %>
   <div class="<% if not $Title %>$Silverstrap.no_label <% end_if %>$Silverstrap.holder">
     $Field

From d3ac9c952d576e60d614bb6dc824f6d895e2571d Mon Sep 17 00:00:00 2001
From: Nicola Fontana <ntd@entidi.it>
Date: Fri, 29 Jul 2016 19:00:58 +0200
Subject: [PATCH 4/8] Avoid to forcibly insert <form> inside a div.row

If needed, this can be easily done from the master template.
---
 templates/Includes/Form.ss | 38 ++++++++++++++++++--------------------
 1 file changed, 18 insertions(+), 20 deletions(-)

diff --git a/templates/Includes/Form.ss b/templates/Includes/Form.ss
index ba25cfb..72c28e7 100644
--- a/templates/Includes/Form.ss
+++ b/templates/Includes/Form.ss
@@ -1,21 +1,19 @@
 <% if $IncludeFormTag %>
-<div class="row">
-  <form class="form-horizontal $extraClass" $getAttributesHTML('class') role="form"><% end_if %><% if $Message %>
-    <div id="{$FormName}_error" class="alert $MessageType">
-      <button type="button" class="close" data-dismiss="alert">&times;</button>
-      $Message
-    </div><% else %>
-    <div id="{$FormName}_error" class="alert hide $MessageType"></div><% end_if %>
-    <fieldset><% if $Legend %>
-      <legend>$Legend</legend><% end_if %><% loop $Fields %>
-      $FieldHolder<% end_loop %>
-    </fieldset><% if $Actions %>
-    <div class="row">
-      <div class="$Silverstrap.group">
-        <div class="$Silverstrap.no_label $Silverstrap.holder"><% loop $Actions %>
-          $Field<% end_loop %>
-        </div>
-      </div><% end_if %><% if $IncludeFormTag %>
-    </div>
-  </form><% end_if %>
-</div>
+<form class="form-horizontal $extraClass" $getAttributesHTML('class') role="form"><% end_if %><% if $Message %>
+  <div id="{$FormName}_error" class="alert $MessageType">
+    <button type="button" class="close" data-dismiss="alert">&times;</button>
+    $Message
+  </div><% else %>
+  <div id="{$FormName}_error" class="alert hide $MessageType"></div><% end_if %>
+  <fieldset><% if $Legend %>
+    <legend>$Legend</legend><% end_if %><% loop $Fields %>
+    $FieldHolder<% end_loop %>
+  </fieldset><% if $Actions %>
+  <div class="row">
+    <div class="$Silverstrap.group">
+      <div class="$Silverstrap.no_label $Silverstrap.holder"><% loop $Actions %>
+        $Field<% end_loop %>
+      </div>
+    </div><% end_if %><% if $IncludeFormTag %>
+  </div>
+</form><% end_if %>

From 8b5552b7cc79be70528aade7868bb0aa7707bf8f Mon Sep 17 00:00:00 2001
From: Nicola Fontana <ntd@entidi.it>
Date: Fri, 29 Jul 2016 20:21:03 +0200
Subject: [PATCH 5/8] Remove bogus div.row around action field group

---
 templates/Includes/Form.ss | 12 +++++-------
 1 file changed, 5 insertions(+), 7 deletions(-)

diff --git a/templates/Includes/Form.ss b/templates/Includes/Form.ss
index 72c28e7..148520b 100644
--- a/templates/Includes/Form.ss
+++ b/templates/Includes/Form.ss
@@ -9,11 +9,9 @@
     <legend>$Legend</legend><% end_if %><% loop $Fields %>
     $FieldHolder<% end_loop %>
   </fieldset><% if $Actions %>
-  <div class="row">
-    <div class="$Silverstrap.group">
-      <div class="$Silverstrap.no_label $Silverstrap.holder"><% loop $Actions %>
-        $Field<% end_loop %>
-      </div>
-    </div><% end_if %><% if $IncludeFormTag %>
-  </div>
+  <div class="$Silverstrap.group">
+    <div class="$Silverstrap.no_label $Silverstrap.holder"><% loop $Actions %>
+      $Field<% end_loop %>
+    </div>
+  </div><% end_if %><% if $IncludeFormTag %>
 </form><% end_if %>

From d64904bfbd7122ae07de8fe27007ba0fb1ff2346 Mon Sep 17 00:00:00 2001
From: Nicola Fontana <ntd@entidi.it>
Date: Fri, 29 Jul 2016 20:21:37 +0200
Subject: [PATCH 6/8] Place tooltip below on sm and xs devices

---
 js/silverstrap.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/js/silverstrap.js b/js/silverstrap.js
index 7ba83a1..d123547 100644
--- a/js/silverstrap.js
+++ b/js/silverstrap.js
@@ -31,7 +31,9 @@ $(document).ready(function () {
   // Enable help tooltips for form elements
   $subject = $('[data-toggle="tooltip"]');
   $subject.tooltip({
-    placement: 'right'
+    placement: function () {
+      return $(window).width() >= 992 ? 'right' : 'bottom';
+    }
   });
 
   // Enable colorbox support on Fotorama frames

From 306100729994e40d037aec28ab4043b4bf1aa0f7 Mon Sep 17 00:00:00 2001
From: Nicola Fontana <ntd@entidi.it>
Date: Fri, 29 Jul 2016 21:02:21 +0200
Subject: [PATCH 7/8] Add reponsive form screenshots

---
 composer.json | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/composer.json b/composer.json
index 0b7cac5..5644adf 100644
--- a/composer.json
+++ b/composer.json
@@ -23,7 +23,8 @@
     },
     "extra": {
         "screenshots": [
-            "http://silverstripe.entidi.com/assets/silverstrap.png"
+            "http://silverstripe.entidi.com/assets/silverstrap.png",
+            "http://silverstripe.entidi.com/assets/silverstrap-forms.jpeg"
         ]
     },
     "suggest": {

From 0293457bc7a5bd8b1b4075d064d58608a1612f19 Mon Sep 17 00:00:00 2001
From: Nicola Fontana <ntd@entidi.it>
Date: Tue, 2 Aug 2016 15:32:33 +0200
Subject: [PATCH 8/8] Remove silverstripe/framework dependency from composer

This is already pulled in by entidi/silverstrap-module.
---
 composer.json | 1 -
 1 file changed, 1 deletion(-)

diff --git a/composer.json b/composer.json
index 5644adf..0cfbecd 100644
--- a/composer.json
+++ b/composer.json
@@ -18,7 +18,6 @@
         "source": "http://dev.entidi.com/p/silverstrap/source/tree/master/"
     },
     "require": {
-        "silverstripe/framework": "~3.1",
         "entidi/silverstrap-module": "~1.0"
     },
     "extra": {