From 18cb29b4256786c6f753238100ba281d45834150 Mon Sep 17 00:00:00 2001
From: Raphael Michel <mail@raphaelmichel.de>
Date: Mon, 5 Nov 2018 22:45:33 +0100
Subject: [PATCH] Show date in event picker

---
 .../control/templates/pretixcontrol/base.html |  7 +++-
 .../static/pretixcontrol/scss/main.scss       | 40 ++++++++++++++++++-
 2 files changed, 43 insertions(+), 4 deletions(-)

diff --git a/src/pretix/control/templates/pretixcontrol/base.html b/src/pretix/control/templates/pretixcontrol/base.html
index 546c2aa02..50cf743d4 100644
--- a/src/pretix/control/templates/pretixcontrol/base.html
+++ b/src/pretix/control/templates/pretixcontrol/base.html
@@ -109,8 +109,11 @@
                 </div>
                 <ul class="nav navbar-nav navbar-top-links navbar-left hidden-xs">
                     <li class="dropdown">
-                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-calendar"></i>
-                            <span class="event-name">{{ request.event }}</span>
+                        <a href="#" class="dropdown-toggle event-dropdown-toggle" data-toggle="dropdown"><i class="fa fa-calendar"></i>
+                            <div class="event-indicator">
+                                <span class="event-name">{{ request.event }}</span>
+                                <span class="event-daterange">{{ request.event.get_date_range_display }}</span>
+                            </div>
                             <span class="caret"></span></a>
                         <ul class="dropdown-menu event-dropdown" role="menu" data-event-typeahead
                             data-source="{% url "control:events.typeahead" %}">
diff --git a/src/pretix/static/pretixcontrol/scss/main.scss b/src/pretix/static/pretixcontrol/scss/main.scss
index 48b723a17..49de9534e 100644
--- a/src/pretix/static/pretixcontrol/scss/main.scss
+++ b/src/pretix/static/pretixcontrol/scss/main.scss
@@ -309,19 +309,55 @@ body.loading #wrapper {
     height: 30px;
 }
 
-.event-name {
+.event-name, .event-indicator .event-daterange {
     display: inline-block;
-    max-width: 150px;
+    max-width: 200px;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
     vertical-align: bottom;
 }
+@media (max-width: $screen-sm-max) {
+    .event-name, .event-indicator .event-daterange {
+        max-width: 150px;
+    }
+}
 
 .dropdown-menu .form-box {
     padding: 3px 10px;
 }
+.navbar-nav > li > a.event-dropdown-toggle {
+    padding-top: 10px;
+    padding-bottom: 10px;
+    vertical-align: middle;
+    min-height: 0;
+    line-height: 0;
+    height: 50px;
 
+    i.fa {
+        position: relative;
+        line-height: 30px;
+        vertical-align: top;
+    }
+    .caret {
+        position: relative;
+        vertical-align: top;
+        top: 13px;
+    }
+    .event-indicator {
+        display: inline-block;
+        padding-left: 5px;
+        padding-right: 2px;
+        line-height: 15px;
+        span {
+            display: block;
+        }
+        span.event-daterange {
+            opacity: 0.7;
+            font-size: 11px;
+        }
+    }
+}
 .event-dropdown {
     width: 300px;
 }