From f6b01b6e0251b42c2fca2bd94854a14581f951d8 Mon Sep 17 00:00:00 2001
From: Raphael Michel <mail@raphaelmichel.de>
Date: Wed, 30 Aug 2017 17:32:52 +0200
Subject: [PATCH] Improve margin arount product picture

---
 .../templates/pretixpresale/event/index.html  | 74 ++++++++++---------
 .../pretixpresale/event/voucher.html          | 28 ++++---
 .../static/pretixpresale/scss/_event.scss     |  4 +
 3 files changed, 59 insertions(+), 47 deletions(-)

diff --git a/src/pretix/presale/templates/pretixpresale/event/index.html b/src/pretix/presale/templates/pretixpresale/event/index.html
index 3c640f932..e71549ab9 100644
--- a/src/pretix/presale/templates/pretixpresale/event/index.html
+++ b/src/pretix/presale/templates/pretixpresale/event/index.html
@@ -177,23 +177,25 @@
                                                             alt="{{ item.name }}"/>
                                                 </a>
                                             {% endif %}
-                                            <a href="#" data-toggle="variations">
-                                                <strong>{{ item.name }}</strong>
-                                            </a>
-                                            {% if item.description %}
-                                                <div class="product-description">
-                                                    {{ item.description|localize|rich_text }}
-                                                </div>
-                                            {% endif %}
-                                            {% if item.min_per_order and item.min_per_order > 1 %}
-                                                <p>
-                                                    <small>
-                                                        {% blocktrans trimmed with num=item.min_per_order %}
-                                                            minimum amount to order: {{ num }}
-                                                        {% endblocktrans %}
-                                                    </small>
-                                                </p>
-                                            {% endif %}
+                                            <div class="product-description {% if item.picture %}with-picture{% endif %}">
+                                                <a href="#" data-toggle="variations">
+                                                    <strong>{{ item.name }}</strong>
+                                                </a>
+                                                {% if item.description %}
+                                                    <div class="product-description">
+                                                        {{ item.description|localize|rich_text }}
+                                                    </div>
+                                                {% endif %}
+                                                {% if item.min_per_order and item.min_per_order > 1 %}
+                                                    <p>
+                                                        <small>
+                                                            {% blocktrans trimmed with num=item.min_per_order %}
+                                                                minimum amount to order: {{ num }}
+                                                            {% endblocktrans %}
+                                                        </small>
+                                                    </p>
+                                                {% endif %}
+                                            </div>
                                         </div>
                                         <div class="col-md-2 col-xs-6 price">
                                             {% if item.min_price != item.max_price or item.free_price %}
@@ -293,24 +295,26 @@
                                                         alt="{{ item.name }}"/>
                                             </a>
                                         {% endif %}
-                                        <strong>{{ item.name }}</strong>
-                                        {% if item.description %}
-                                            <div class="product-description">
-                                                {{ item.description|localize|rich_text }}
-                                            </div>
-                                        {% endif %}
-                                        {% if event.settings.show_quota_left %}
-                                            {% include "pretixpresale/event/fragment_quota_left.html" with avail=item.cached_availability %}
-                                        {% endif %}
-                                        {% if item.min_per_order and item.min_per_order > 1 %}
-                                            <p>
-                                                <small>
-                                                    {% blocktrans trimmed with num=item.min_per_order %}
-                                                        minimum amount to order: {{ num }}
-                                                    {% endblocktrans %}
-                                                </small>
-                                            </p>
-                                        {% endif %}
+                                        <div class="product-description {% if item.picture %}with-picture{% endif %}">
+                                            <strong>{{ item.name }}</strong>
+                                            {% if item.description %}
+                                                <div class="product-description">
+                                                    {{ item.description|localize|rich_text }}
+                                                </div>
+                                            {% endif %}
+                                            {% if event.settings.show_quota_left %}
+                                                {% include "pretixpresale/event/fragment_quota_left.html" with avail=item.cached_availability %}
+                                            {% endif %}
+                                            {% if item.min_per_order and item.min_per_order > 1 %}
+                                                <p>
+                                                    <small>
+                                                        {% blocktrans trimmed with num=item.min_per_order %}
+                                                            minimum amount to order: {{ num }}
+                                                        {% endblocktrans %}
+                                                    </small>
+                                                </p>
+                                            {% endif %}
+                                        </div>
                                     </div>
                                     <div class="col-md-2 col-xs-6 price">
                                         {% if item.free_price %}
diff --git a/src/pretix/presale/templates/pretixpresale/event/voucher.html b/src/pretix/presale/templates/pretixpresale/event/voucher.html
index cdecbeb12..24ce06817 100644
--- a/src/pretix/presale/templates/pretixpresale/event/voucher.html
+++ b/src/pretix/presale/templates/pretixpresale/event/voucher.html
@@ -45,12 +45,14 @@
                                                         alt="{{ item.name }}"/>
                                             </a>
                                         {% endif %}
-                                        <strong>{{ item.name }}</strong>
-                                        {% if item.description %}
-                                            <div class="product-description">
-                                                {{ item.description|localize|rich_text }}
-                                            </div>
-                                        {% endif %}
+                                        <div class="product-description {% if item.picture %}with-picture{% endif %}">
+                                            <strong>{{ item.name }}</strong>
+                                            {% if item.description %}
+                                                <div class="product-description">
+                                                    {{ item.description|localize|rich_text }}
+                                                </div>
+                                            {% endif %}
+                                        </div>
                                     </div>
                                     <div class="col-md-2 col-xs-6 price">
                                         {% if item.min_price != item.max_price or item.free_price %}
@@ -135,12 +137,14 @@
                                                     alt="{{ item.name }}"/>
                                         </a>
                                     {% endif %}
-                                    <strong>{{ item.name }}</strong>
-                                    {% if item.description %}
-                                        <div class="product-description">
-                                            {{ item.description|localize|rich_text }}
-                                        </div>
-                                    {% endif %}
+                                    <div class="product-description {% if item.picture %}with-picture{% endif %}">
+                                        <strong>{{ item.name }}</strong>
+                                        {% if item.description %}
+                                            <div class="product-description">
+                                                {{ item.description|localize|rich_text }}
+                                            </div>
+                                        {% endif %}
+                                    </div>
                                 </div>
                                 <div class="col-md-2 col-xs-6 price">
                                     {% if item.free_price %}
diff --git a/src/pretix/static/pretixpresale/scss/_event.scss b/src/pretix/static/pretixpresale/scss/_event.scss
index 99568dcae..eb3d8de75 100644
--- a/src/pretix/static/pretixpresale/scss/_event.scss
+++ b/src/pretix/static/pretixpresale/scss/_event.scss
@@ -30,6 +30,10 @@
         display: block;
     }
 
+    .product-description.with-picture {
+        margin-left: 70px;
+    }
+
     .productpicture {
         float: left;
         margin-right: 10px;