Adapt layout for bootstrap v4-beta3

6 files changed, 28 insertions, 15 deletions

diff --git a/archaeological_operations/templates/ishtar/blocks/OAWidget.html b/archaeological_operations/templates/ishtar/blocks/OAWidget.html
index 1cce45909..6f4c1af24 100644
--- a/archaeological_operations/templates/ishtar/blocks/OAWidget.html
+++ b/archaeological_operations/templates/ishtar/blocks/OAWidget.html
@@ -1,4 +1,6 @@
 <div class="input-group">
-    <span class="input-group-addon">OA</span>
+    <div class="input-group-prepend">
+        <div class="input-group-text">OA</div>
+    </div>
     <input class="form-control widget-oa" type="text"{{final_attrs|safe}}>
 </div>
\ No newline at end of file
diff --git a/archaeological_operations/widgets.py b/archaeological_operations/widgets.py
index 1d53bb199..04e0fcdfd 100644
--- a/archaeological_operations/widgets.py
+++ b/archaeological_operations/widgets.py
@@ -53,8 +53,10 @@ class SelectParcelWidget(widgets.TextInput):
     def render(self, *args, **kwargs):
         render = super(SelectParcelWidget, self).render(*args, **kwargs)
         html = u"""{}
-        <button class='input-group-addon btn btn-success' name='formset_add'
-            value='add'>{}</button>""".format(render,  _(u"Add"))
+    <div class="input-group-append">
+        <button class='input-group-text btn btn-success' name='formset_add'
+            value='add'>{}</button>
+    </div>""".format(render,  _(u"Add"))
         return mark_safe(html)
 
 
diff --git a/bootstrap_datepicker/widgets.py b/bootstrap_datepicker/widgets.py
index 7baa44e66..be317f5d9 100644
--- a/bootstrap_datepicker/widgets.py
+++ b/bootstrap_datepicker/widgets.py
@@ -28,7 +28,7 @@ class DatePicker(DateTimeInput):
     class Media:
         class JSFiles(object):
             def __iter__(self):
-                yield 'js/bootstrap-datepicker.min.js'
+                yield 'js/bootstrap-datepicker.js'
                 lang = translation.get_language()
                 if lang:
                     lang = lang.lower()
@@ -83,8 +83,10 @@ class DatePicker(DateTimeInput):
     html_template = """
     <div%(div_attrs)s>
       <input%(input_attrs)s/>
-      <span class="input-group-addon">
-        <span%(icon_attrs)s></span>
+      <span class="input-group-append">
+        <span class="input-group-text">
+          <span%(icon_attrs)s></span>
+        </span>
       </span>
     </div>"""
 
diff --git a/ishtar_common/templates/blocks/SquareMeterWidget.html b/ishtar_common/templates/blocks/SquareMeterWidget.html
index 730a918c4..09e93b425 100644
--- a/ishtar_common/templates/blocks/SquareMeterWidget.html
+++ b/ishtar_common/templates/blocks/SquareMeterWidget.html
@@ -1,6 +1,10 @@
 <div class="input-group">
     <input class="area_widget form-control" type="text"{{final_attrs|safe}}>
-    <span class="input-group-addon">{{unit}} (<span id="ha_{{id}}">0</span>&nbsp;ha)</span>
+    <div class="input-group-append">
+        <div class="input-group-text">
+            {{unit}} (<span id="ha_{{id}}">0</span>&nbsp;ha)
+        </div>
+    </div>
 </div>
 <script type="text/javascript"><!--//
     function evaluate_{{safe_id}}(){
diff --git a/ishtar_common/templates/blocks/bs_form_snippet.html b/ishtar_common/templates/blocks/bs_form_snippet.html
index e58df1832..eb52fa653 100644
--- a/ishtar_common/templates/blocks/bs_form_snippet.html
+++ b/ishtar_common/templates/blocks/bs_form_snippet.html
@@ -20,9 +20,11 @@
 <div class="form-row">
     <div class="form-group col-lg-10">
         <div class="input-group">
-          <span class="input-group-addon">
-              <i class="fa fa-search" aria-hidden="true"></i></span>
-              {{field|safe}}
+          <span class="input-group-prepend">
+            <span class="input-group-text">
+               <i class="fa fa-search" aria-hidden="true"></i></span>
+          </span>
+          {{field|safe}}
         </div>
         {% if field.help_text %}
         <small><a data-toggle="collapse" href="#{{field.auto_id}}_help"
@@ -69,10 +71,11 @@
         {% endif %}
         {{field|safe}}
         {% if field.help_text %}
-          <span class="input-group-addon">
-            <a data-toggle="collapse" href="#{{field.auto_id}}_help"
+          <span class="input-group-append">
+            <a class="input-group-text" data-toggle="collapse"
+               href="#{{field.auto_id}}_help"
                aria-expanded="false" aria-controls="{{field.auto_id}}_help">
-                <i class="fa fa-question-circle" aria-hidden="true"></i>
+               <i class="fa fa-question-circle" aria-hidden="true"></i>
             </a>
           </span>
         </div>
diff --git a/ishtar_common/widgets.py b/ishtar_common/widgets.py
index 84a58c98c..24a87d5a8 100644
--- a/ishtar_common/widgets.py
+++ b/ishtar_common/widgets.py
@@ -404,8 +404,8 @@ class JQueryAutoComplete(forms.TextInput):
             if self.url_new:
                 url_new = self.url_new
             url_new = reverse(url_new, args=args)
-            new = u'<span class="input-group-addon">'\
-                  u'<a href="#" class="add-button" '\
+            new = u'<span class="input-group-append">'\
+                  u'<a href="#" class="add-button input-group-text" '\
                   u'onclick="open_window(\'%s\');">+</a></span></div>' % url_new
         html += u"""<input%(attrs_select)s/>%(new)s\
 <input type="hidden"%(attrs_hidden)s/>\