From 2c5089beb638ddefd3833c0f128036b7a82b93b7 Mon Sep 17 00:00:00 2001
From: Chris Lawton <chris.lawton@torchbox.com>
Date: Wed, 21 Feb 2018 13:00:49 +0000
Subject: [PATCH] adding search input styles

---
 .../apply/dashboard/templates/dashboard/dashboard.html | 10 ++++++----
 .../dashboard/templates/dashboard/includes/search.html |  4 ++--
 .../static_src/src/sass/apply/components/_heading.scss |  5 +++++
 opentech/static_src/src/sass/apply/main.scss           |  1 +
 4 files changed, 14 insertions(+), 6 deletions(-)
 create mode 100644 opentech/static_src/src/sass/apply/components/_heading.scss

diff --git a/opentech/apply/dashboard/templates/dashboard/dashboard.html b/opentech/apply/dashboard/templates/dashboard/dashboard.html
index 4624e4599..828bd832e 100644
--- a/opentech/apply/dashboard/templates/dashboard/dashboard.html
+++ b/opentech/apply/dashboard/templates/dashboard/dashboard.html
@@ -3,13 +3,15 @@
 {% block title %}OTF Dashboard{% endblock %}
 {% block content %}
 <div class="wrapper wrapper--breakout wrapper--admin">
-    <div class="wrapper wrapper--large">
+    <div class="wrapper wrapper--large wrapper--search">
         {% block page_header %}
-            <h3>Received Submissions</h3>
-            <h5>Track and explore recent submissions</h5>
+            <div>
+                <h3 class="heading heading--no-margin">Received Submissions</h3>
+                <h5>Track and explore recent submissions</h5>
+            </div>
         {% endblock %}
+        {% include "dashboard/includes/search.html" %}
     </div>
-    {% include "dashboard/includes/search.html" %}
 </div>
 
 <div class="wrapper wrapper--large wrapper--top-bottom-inner-space">
diff --git a/opentech/apply/dashboard/templates/dashboard/includes/search.html b/opentech/apply/dashboard/templates/dashboard/includes/search.html
index 8797eff8d..4bdba5b46 100644
--- a/opentech/apply/dashboard/templates/dashboard/includes/search.html
+++ b/opentech/apply/dashboard/templates/dashboard/includes/search.html
@@ -1,6 +1,6 @@
 <form action="{% url 'dashboard:search' %}" method="get" role="search" class="form form--header-search-desktop">
-    <button class="button" type="submit" aria-label="Search">
+    <button class="button button--search" type="submit" aria-label="Search">
         <svg class="icon icon--magnifying-glass icon--search"><use xlink:href="#magnifying-glass"></use></svg>
     </button>
-    <input class="input input--transparent input--secondary" type="text" placeholder="Search…" name="query"{% if search_query %} value="{{ search_query }}{% endif %}" aria-label="Search input">
+    <input class="input input--search" type="text" placeholder="Search…" name="query"{% if search_query %} value="{{ search_query }}{% endif %}" aria-label="Search input">
 </form>
diff --git a/opentech/static_src/src/sass/apply/components/_heading.scss b/opentech/static_src/src/sass/apply/components/_heading.scss
new file mode 100644
index 000000000..2b1970218
--- /dev/null
+++ b/opentech/static_src/src/sass/apply/components/_heading.scss
@@ -0,0 +1,5 @@
+.heading {
+    &--no-margin {
+        margin: 0;
+    }
+}
diff --git a/opentech/static_src/src/sass/apply/main.scss b/opentech/static_src/src/sass/apply/main.scss
index dbe0268b2..a74715e1e 100755
--- a/opentech/static_src/src/sass/apply/main.scss
+++ b/opentech/static_src/src/sass/apply/main.scss
@@ -13,6 +13,7 @@
 // Components
 @import 'components/button';
 @import 'components/form';
+@import 'components/heading';
 @import 'components/icon';
 @import 'components/input';
 @import 'components/pagination';
-- 
GitLab