Update search results page

diff --git a/app/static/src/sass/modules/_page.scss b/app/static/src/sass/modules/_page.scss
index 2ed9aef059ce467ada09f423537861b698c0489c..c57a4ef7a43847a6a4c51ebc7745401caadfe026 100644 (file)
--- a/app/static/src/sass/modules/_page.scss
+++ b/app/static/src/sass/modules/_page.scss
@@ -349,17 +349,23 @@ $module: ".page";
 
     &--organization {
 
-        margin-top: -327px;
+        margin-top: -80px;
 
         @include mq($until: xs) {
-            margin-top: -123px;
+
         }
 
         .map {
             width: 100%;
-            height: 900px;
+            height: 950px;
         }
 
     }
 
+    &--search {
+
+        margin-top: 8rem;
+
+    }
+
 }

diff --git a/app/static/src/sass/modules/_pagination.scss b/app/static/src/sass/modules/_pagination.scss
index cd15a61e1131c6b2031c458a87d441b5379b74ce..d8188e73489f7afec8411717eac73fbf9d1af3ff 100644 (file)
--- a/app/static/src/sass/modules/_pagination.scss
+++ b/app/static/src/sass/modules/_pagination.scss
@@ -25,6 +25,7 @@ $module: ".pagination";
     list-style-type: none;
     margin: 0;
     padding: 0;
+    text-align: right;
 
     @include typeface(sans-serif);
 
@@ -49,15 +50,17 @@ $module: ".pagination";
         font-weight: weight(regular);
 
         display: block;
-        background: $color-main;
-        color: $color-black;
+        background: #001B42;
+        color: white;
+
+        border: 1px solid black;
 
         @include padding(.15 .5);
         @include transition(all .25s ease-in-out);
 
         &.active, &:hover {
-            background: $color-black;
-            color: $color-main;
+            background: #002C6B;
+            color: white;
         }
 
     }

diff --git a/app/static/src/sass/modules/_search.scss b/app/static/src/sass/modules/_search.scss
index bd460203f3c96dbdd9be99b50382e4cb54ebd1a0..8b9059b35ccae8a5a4423186b04680c201ab3265 100644 (file)
--- a/app/static/src/sass/modules/_search.scss
+++ b/app/static/src/sass/modules/_search.scss
@@ -84,10 +84,11 @@ $module: ".search";
         border: 0;
         outline: none;
         background: none;
-        border-bottom: 1px solid $color-black;
+        border-bottom: 1px solid $color-main;
 
         padding: 1rem 3rem 1rem 0;
         width: 100%;
+        color: white;
 
         @include font-size(xxl);
         @include typeface(serif);
@@ -110,6 +111,8 @@ $module: ".search";
         outline: 0;
         cursor: pointer;
 
+        color: white;
+
         @include font-size(xxl);
 
     }

diff --git a/app/static/src/sass/modules/boxes/_search-box.scss b/app/static/src/sass/modules/boxes/_search-box.scss
index 69e35549dd867624020926a14447bbbfd9ea22ab..628dc45ae990b1f449cfcc5bf46a6ba940bc4418 100644 (file)
--- a/app/static/src/sass/modules/boxes/_search-box.scss
+++ b/app/static/src/sass/modules/boxes/_search-box.scss
@@ -26,10 +26,20 @@ $module: ".search-box";
     @include clearfix;
     @include margin-bottom(2);
 
+    &:hover {
+
+        #{$module}__title {
+            color: $color-main;
+        }
+
+    }
+
     &__title {
-        @include margin(0 0 1 0);
+        @include margin(0 0 0 0);
         font-weight: weight(bold);
         text-transform: uppercase;
+        color: white;
+        @include transition(color 0.25s ease-in-out);
 
         i {
             display: inline-block;
@@ -43,11 +53,35 @@ $module: ".search-box";
     &__subtitle {
 
         @include font-size(m);
-        @include line-height(1);
+        @include line-height(.75);
         @include typeface(sans-serif);
+        @include margin-top(.25);
+        font-weight: weight(bold);
+        color: white;
+        text-transform: uppercase;
+        @include transition(color 0.5s ease-in-out);
+
+        span {
+            @include typeface(serif);
+            @include font-size(s);
+            font-weight: weight(regular);
+            text-transform: none;
+            display: block;
+            @include margin-top(.25);
+        }
+
+    }
+
+    &__tags {
 
-        @include margin-top(-.5);
-        @include margin-bottom(1);
+        text-transform: uppercase;
+        @include font-size(s);
+        @include line-height(1.25);
+        @include typeface(sans-serif);
+        @include margin(0 0 0 0);
+        font-weight: weight(regular);
+        color: $color-main;
+        @include transition(color 0.5s ease-in-out);
 
     }
 
@@ -57,6 +91,7 @@ $module: ".search-box";
         @include line-height(1);
         @include typeface(serif);
         font-weight: weight(light);
+        @include transition(color 0.5s ease-in-out);
 
     }
 

diff --git a/app/templates/agenda/includes/event_search.html b/app/templates/agenda/includes/event_search.html
index 1ecdf8cee2cb4886b8d01aa1fcee02b27a82d4ac..45f304d7f98ee1f60a4604eceb276a6dcd79c157 100644 (file)
--- a/app/templates/agenda/includes/event_search.html
+++ b/app/templates/agenda/includes/event_search.html
@@ -44,13 +44,16 @@
     {% keywords_for event as tags %}
     {% if event.departments.all.0 or tags %}
         {% if event.departments.all.0 %}
-            <div class="event-line-box__tags">
-                <div class="tag tag--small dashed">
-                  {{ event.departments.all.0.department.name }}
-                </div>
+            <div class="search-box__tags">
+                {{ event.departments.all.0.department.name }}
             </div>
         {% endif %}
     {% endif %}
+    {% if event.category %}
+        <div class="search-box__tags">
+            {{ event.category|truncatechars:15 }}
+        </div>
+    {% endif %}
 {% endblock %}
 
 {% block url %}

diff --git a/app/templates/core/inc/search_card.html b/app/templates/core/inc/search_card.html
index 5081ac32f6bcb9a248e6883be755a3520ec21adc..036dd095bd1f96bb237533146db9b4045963a363 100644 (file)
--- a/app/templates/core/inc/search_card.html
+++ b/app/templates/core/inc/search_card.html
@@ -4,17 +4,18 @@
     {% endblock %}
 
     <div class="search-box__right">
-        {% block tags %}
-        {% endblock %}
 
         <a href="{% block url %}{% endblock %}" target="_blank">
-            <h2 class="search-box__title dotted">
+            <h2 class="search-box__title">
                 {% block title %}
                 {% endblock %}
                 <i class="fa fa-{% block icon %}{% endblock %}"></i>
             </h2>
         </a>
 
+        {% block tags %}
+        {% endblock %}
+
         {% block subtitle %}
         {% endblock %}
 

diff --git a/app/templates/includes/pagination.html b/app/templates/includes/pagination.html
index 5725d867d8607da8c56b29ca4906d9412a40bbf7..2c5bfaf57b0992e5e9f1aaf1879029c580a0cd6c 100644 (file)
--- a/app/templates/includes/pagination.html
+++ b/app/templates/includes/pagination.html
@@ -3,7 +3,7 @@
 {% if current_page.has_previous or current_page.has_next %}
 <div class="container">
     <div class="row">
-        <div class="col-sm-9 col-lg-8 col-lg-push-2">
+        <div class="col-md-10 col-md-push-3">
             <ul class="pagination">
 
                 {% if current_page.has_previous %}

diff --git a/app/templates/magazine/article/article_list.html b/app/templates/magazine/article/article_list.html
index 6f4d325f10444f9b14bf7e5f69bf1b08be382c58..a1b644445f2a680155e0f0148a6088ddd431107a 100644 (file)
--- a/app/templates/magazine/article/article_list.html
+++ b/app/templates/magazine/article/article_list.html
@@ -50,16 +50,12 @@
                                 </div>
                             {% endfor %}
                         </div>
-                        <div class="row">
-                            <div class="col-xxs-16">
-                                {% pagination_for objects %}
-                            </div>
-                        </div>
                     </div>
                 </div>
             </div>
         </div>
     </div>
+    {% pagination_for objects %}
 </div>
 
 {% endblock %}

diff --git a/app/templates/media/inc/playlist_search.html b/app/templates/media/inc/playlist_search.html
index d4e0fb862e71e8ea2a1a36e9895313c52fd35df4..898892bf93b7f71ea25783f2d115b613c4881082 100644 (file)
--- a/app/templates/media/inc/playlist_search.html
+++ b/app/templates/media/inc/playlist_search.html
@@ -8,10 +8,8 @@
 {% block icon %}file-{{playlist.type}}-o{% endblock %}
 
 {% block tags %}
-    <div class="event-line-box__tags">
-        <div class="tag tag--small dashed dashed--gray">
-            {{playlist.type}}
-        </div>
+    <div class="search-box__tags">
+        {{playlist.type}}
     </div>
 {% endblock %}
 

diff --git a/app/templates/pages/page/includes/page_search.html b/app/templates/pages/page/includes/page_search.html
index 6bb6205eb7755b495331d1f657a09c8498a8e710..7a8544abc83361675c81e754d31d4e3301e86b02 100644 (file)
--- a/app/templates/pages/page/includes/page_search.html
+++ b/app/templates/pages/page/includes/page_search.html
@@ -10,28 +10,20 @@
 {% block tags %}
     {% with page.get_ascendants|last as top_level_parent %}
         {% if top_level_parent.get_content_model.title %}
-            <div class="event-line-box__tags">
-                <div class="tag tag--small dashed">
-                    {{ top_level_parent.get_content_model.title }}
-                </div>
+            <div class="search-box__tags">
+                {{ top_level_parent.get_content_model.title }}
             </div>
         {% elif page.departmentpage %}
-            <div class="event-line-box__tags">
-                <div class="tag tag--small dashed">
-                    {{ page.departmentpage.title }}
-                </div>
+            <div class="search-box__tags">
+                {{ page.departmentpage.title }}
             </div>
         {% elif page|classname == "Project"  %}
-            <div class="event-line-box__tags">
-                <div class="tag tag--small dashed">
-                    {% trans 'Project' %}
-                </div>
+            <div class="search-box__tags">
+                {% trans 'Project' %}
             </div>
         {% else %}
-            <div class="event-line-box__tags">
-                <div class="tag tag--small dashed dashed--gray">
-                    {% trans 'Page' %}
-                </div>
+            <div class="search-box__tags">
+                {% trans 'Page' %}
             </div>
         {% endif %}
     {% endwith %}

diff --git a/app/templates/search_results.html b/app/templates/search_results.html
index 8d52dc5c6c01297a5004b6dd13e1626c2a2313b8..0e822224bd2d441ab70414509bde405fc121a353 100644 (file)
--- a/app/templates/search_results.html
+++ b/app/templates/search_results.html
@@ -8,34 +8,24 @@
 <meta name="robots" content="noindex">
 {% endblock %}
 
-{% block breadcrumb_menu %}
-    <li class="breadcrumb__item">
-        <a href="{% url "home" %}">{% trans "Home" %}</a>
-    </li>
-    <li class="breadcrumb__item active">{% trans "Search Results" %}</li>
-{% endblock %}
-
 {% block main %}
-
-    <div class="page">
+    <div class="page page--search">
         <div class="container">
-
             <div class="row">
-                <div class="col-sm-9 col-sm-push-3 col-lg-9 col-lg-push-2 white-bg mb2">
-
-                    <form action="{% url "search" %}" role="search" class="search-form">
+                <div class="col-sm-16 col-md-10 col-md-push-3 tac">
+                    <form action="{% url "search" %}" role="search" class="search-form mb4">
                         <input class="form-control" placeholder="{% trans "Type something" %}" type="text" name="q" value="{{ request.GET.q }}">
                         <button type="submit">
                             <i class="fa fa-search" aria-hidden="true"></i>
                         </button>
                     </form>
-
-
                 </div>
             </div>
 
             <div class="row">
-                <div class="col-sm-3 col-lg-2 page__sidebar">
+
+                <div class="col-md-3 page__sidebar" style="display: none;">
+
                     <div style="position: relative;">
                         <ul class="nav-tree nav-tree--level-0" data-sticky data-sticky-parent="row" data-sticky-offset="100" data-sticky-detach-at="971">
                             {% for key,value in filter_dict.items %}
@@ -47,42 +37,46 @@
                             {% endfor %}
                         </ul>
                     </div>
+
                 </div>
 
-                <div class="mb2 col-sm-9 col-lg-8 white-bg page__content">
+                <div class="col-md-10 col-md-push-3 page__content" data-summary-content>
+                    <div class="page__content">
+                        {% for result in results.object_list %}
+                            {# result|classname #}
+                            {% if result|classname == 'Event' %}
+                                {% with result as event %}
+                                    {% include 'agenda/includes/event_search.html' %}
+                                {% endwith %}
+                            {% elif result|classname == 'Playlist' %}
+                                {% with result as playlist %}
+                                    {% include 'media/inc/playlist_search.html' %}
+                                {% endwith %}
+                            {% elif result|classname == 'Product' %}
+                                {% with result as product %}
+                                    {% include 'shop/product/includes/product_search.html' %}
+                                {% endwith %}
+                            {% else %}
+                                {% with result as page %}
+                                    {% include 'pages/page/includes/page_search.html' %}
+                                {% endwith %}
+                            {% endif %}
+                        {% endfor %}
+                        <p>
+                            {% if results.paginator.count == 0 %}
+                            {% blocktrans %}No results were found matching your query: {{ query }}{% endblocktrans %}
+                            {% endif %}
+                        </p>
 
-                    {% for result in results.object_list %}
-                        {# result|classname #}
-                        {% if result|classname == 'Event' %}
-                            {% with result as event %}
-                                {% include 'agenda/includes/event_search.html' %}
-                            {% endwith %}
-                        {% elif result|classname == 'Playlist' %}
-                            {% with result as playlist %}
-                                {% include 'media/inc/playlist_search.html' %}
-                            {% endwith %}
-                        {% elif result|classname == 'Product' %}
-                            {% with result as product %}
-                                {% include 'shop/product/includes/product_search.html' %}
-                            {% endwith %}
-                        {% else %}
-                            {% with result as page %}
-                                {% include 'pages/page/includes/page_search.html' %}
-                            {% endwith %}
-                        {% endif %}
-                    {% endfor %}
-                    <p>
-                        {% if results.paginator.count == 0 %}
-                        {% blocktrans %}No results were found matching your query: {{ query }}{% endblocktrans %}
-                        {% endif %}
-                    </p>
+                    </div>
                 </div>
+
             </div>
 
+
         </div>
 
         {% pagination_for results %}
 
     </div>
-
 {% endblock %}