Bootstrap grid content position - django

I have the following code for django-oscar
<ul class="row">
{% for product in products %}
<li class="col-xs-6 col-sm-4 col-md-3 col-lg-3">{% render_product product %}</li>
{% endfor %}
</ul>
it works find except on the phone.
As you can see from the screen shot, there is a weird space in the grid system when the size is reduced to the phone (it actually displays like this on the phone). On the desktop, the grid system displays correctly until the size of the browser becomes less than certain px. Is there a way to fix this? (I think I am using bootstrap3)
Grid system working well
Phone mode

what you're looking for is clearfix
Add this to the parent element, in this case the row class

If you look closely, in phone mode the In Stock is on different lines, i am assuming this is a height problem. Best solution is to use flex box . Or manually adjust the min height.

Related

Drupal 8 - Broken default image link in view

I'm new to Drupal and I've been given a project to fix a couple of bugs on...
I've got a view with several fields, it displays OK when there is a picture but when there is no picture (and thus the need to display a default picture), then a broken image link appears...For some reason the path points to a different directory...
This works:
<div class="item-header"> <div class="views-field views-field-field-selection-photos"> ... <div class="content">
<div class="field field--name-field-photo field--type-image field--label-hidden field--item"> <img src="/sites/default/files/somepicture.jpeg?itok=sJ6SOjXo" width="445" height="334"/>
This does not, due to the path pointing to ../sites instead of /sites:
<div class="item-header">
<div class="views-field views-field-field-selection-photos"><div class="field-content"><img src="../sites/default/files/structures/photos/defaultpic.jpg" width="100%" />
I've been looking at theming fields but that seems overkill, I wonder if there's a nice and clean way to sort this out rather than override a template or anything else that would seem a bit too much...
Thanks

Django template loops unwantedly fetching items in random order

I am using Django 2.2 and psql 10.8 on Ubuntu 18.04.1.
I have a collection of items that I want to iterate over and render the results in a template.
They are expected to be rendered in exactly the order that they have been created in the database (by pk). However, they seem to be rendered in a random order instead.
The problem does not occur when using sqlite.
I have not found the solution for this problem; reverse iterating through the objects results also not in the desired behaviour. A simple portion of the code would be:
<div class="row">
<ul class="tabs">
{% for category in categories %}
<li class="tab col s3">{{category}}</li>
{% endfor %}
</ul>
</div>
Say I have created four categories A, B, C, D;
when using sqlite in dev, they would be rendered in that order on the frontend page.
With psql, I am seeing an unordered result.
Any help in the right direction is appreciated!

how can I add more character space to the home page tagline in big cartel?

Does anyone know how to edit the CSS in a Big Cartel theme (specifically the FOUNDRY theme) to allow for more text in the home page tagline? Currently, you can only type about 100 characters. I would like to be able to write a bit more (like a small paragraph about the shop and current product overview).
The text box is limited to 100 characters, so to edit that you'll need to change the code the Advanced > Home section of the Customize Design area. Find this code at the top:
{% if theme.home_tagline != blank %}
<div class="home_tagline">
{{ theme.home_tagline }}
</div>
{% endif %}
And replace the {{ theme.home_tagline }} with your own text.

Nav-bar Foundation Become Down Position

I have problem using nav-bar menu on foundation 3. I use default code on foundation 3 old doc but the menu become down. Please see my attach. [https://f.cloud.github.com/assets/4178068/487263/0e3ed49a-b951-11e2-9e10-ce74723ef6b3.jpg]
Please help regarding my problem. Thank you.
Some code:
<ul class="nav-bar">
<li class="active">Menu 1</li>
</ul>
The items on your nav-bar are exceeding the width of your template. You have to either give a bigger width to the .row class located in the foundation.css or remove some items from the nav-bar.

DJangoCMS - Outputting number of menu children to menu template

Within DjangoCMS I'd like to display the number of children a page has in the navigation.
I have a menu item called "Careers" and I'd like it to say "Careers (2)" if there are 2 sub-pages within that page in the site tree.
Is this possible?
I can target the right menu item in menu.html but need to dynamically generate the number somehow.
{% if child.get_menu_title|slugify == "careers" %}<span>1</span>{% endif %}
I more or less determined that without faffing with models (which I can't do) I solved the problem with some nifty CSS and JavaScript. Not a wonderful result, but it's sufficient.
Just tried it myself and you can do:
{% if child.children %} <span>{{ child.children|length }}</span>{% endif %}