Included javascript code to fix breadcrumb bug

Gustavo
1 parent e768a3e6
Showing 1 changed file with 20 additions and 5 deletions Show diff stats
subjects/templates/subjects/view.html
@@ -6,8 +6,23 @@
 {% block javascript%}
     {{ block.super }}
     <script type="text/javascript" src="{% static 'subjects/js/modal_subject.js' %}"></script>
+    <script type="text/javascript">
+    $(document).ready( function () {
+    	var ul = '';
+    	var div_crumb = $(".dropdown_crumb");
+      var div_change = $(".drop_change");
+    	if(window.innerWidth < 768) {
+    		ul = document.querySelector("ul.breadcrumb");
+    		if (ul) {
+    			ul.classList.remove('breadcrumb');
+    			ul.classList.add('screen_drop');
+    		}
+        div_change.addClass("dropdown-menu");
+        div_crumb.prepend("<button class='btn btn-block dropdown-toggle' type='button' data-toggle='dropdown'>{% trans 'Navigate' %} <span class='caret'></span></button>")
+      }
+    });
+    </script>
 {% endblock%}
-
 {% block breadcrumbs %}
     {{ block.super }}
     {% breadcrumb subject.category 'subjects:cat_view' subject.category.slug %}
@@ -83,7 +98,7 @@
             {% endif %}
  
             {% include 'topics/list.html' with subject=subject %}
-            
+
             <div id="participants" data-toggle="tooltip" data-title="{% trans 'Participants' %}">
                 <i class="fa fa-group"></i>
             </div>
@@ -163,7 +178,7 @@
                     var popover = $(".popover.fade.in"),
                         buttons = popover.parent().find('a'),
                         close = popover.parent().find('.close:visible');
-    
+
                     popover.animate({
                         'max-width': '330px',
                     }, 0);
@@ -178,7 +193,7 @@
  
                     close.on("click", function () {
                         popover.popover('hide');
-                    }); 
+                    });
  
                     buttons.on("click", function () {
                         popover.popover('hide');
@@ -189,7 +204,7 @@
             $('#participants').on('click', function(){
                 var $this = $(this),
                     list = $this.parent().find(".participants-list");
-                
+
                 if ($this.hasClass('open')) {
                     $this.animate({
                         right : '0px'
...	...	@@ -6,8 +6,23 @@
6	6	{% block javascript%}
7	7	{{ block.super }}
8	8	<script type="text/javascript" src="{% static 'subjects/js/modal_subject.js' %}"></script>
	9	+ <script type="text/javascript">
	10	+ $(document).ready( function () {
	11	+ var ul = '';
	12	+ var div_crumb = $(".dropdown_crumb");
	13	+ var div_change = $(".drop_change");
	14	+ if(window.innerWidth < 768) {
	15	+ ul = document.querySelector("ul.breadcrumb");
	16	+ if (ul) {
	17	+ ul.classList.remove('breadcrumb');
	18	+ ul.classList.add('screen_drop');
	19	+ }
	20	+ div_change.addClass("dropdown-menu");
	21	+ div_crumb.prepend("<button class='btn btn-block dropdown-toggle' type='button' data-toggle='dropdown'>{% trans 'Navigate' %} <span class='caret'></span></button>")
	22	+ }
	23	+ });
	24	+ </script>
9	25	{% endblock%}
10		-
11	26	{% block breadcrumbs %}
12	27	{{ block.super }}
13	28	{% breadcrumb subject.category 'subjects:cat_view' subject.category.slug %}
...	...	@@ -83,7 +98,7 @@
83	98	{% endif %}
84	99
85	100	{% include 'topics/list.html' with subject=subject %}
86		-
	101	+
87	102	<div id="participants" data-toggle="tooltip" data-title="{% trans 'Participants' %}">
88	103	<i class="fa fa-group"></i>
89	104	</div>
...	...	@@ -163,7 +178,7 @@
163	178	var popover = $(".popover.fade.in"),
164	179	buttons = popover.parent().find('a'),
165	180	close = popover.parent().find('.close:visible');
166		-
	181	+
167	182	popover.animate({
168	183	'max-width': '330px',
169	184	}, 0);
...	...	@@ -178,7 +193,7 @@
178	193
179	194	close.on("click", function () {
180	195	popover.popover('hide');
181		- });
	196	+ });
182	197
183	198	buttons.on("click", function () {
184	199	popover.popover('hide');
...	...	@@ -189,7 +204,7 @@
189	204	$('#participants').on('click', function(){
190	205	var $this = $(this),
191	206	list = $this.parent().find(".participants-list");
192		-
	207	+
193	208	if ($this.hasClass('open')) {
194	209	$this.animate({
195	210	right : '0px'
...	...