From 1dbe8046c38d43bc87fe6a78b1bfc61a3599de01 Mon Sep 17 00:00:00 2001
From: dawnofmidnight <dawnofmidnight1128@gmail.com>
Date: Tue, 3 Aug 2021 14:53:17 -0400
Subject: styles: filtering resources page

---
 pydis_site/templates/resources/resources.html | 34 ++++++++++++---------------
 1 file changed, 15 insertions(+), 19 deletions(-)

(limited to 'pydis_site/templates')

diff --git a/pydis_site/templates/resources/resources.html b/pydis_site/templates/resources/resources.html
index f2d5a976..8105a557 100644
--- a/pydis_site/templates/resources/resources.html
+++ b/pydis_site/templates/resources/resources.html
@@ -17,58 +17,58 @@
              <h1 class="resource-title has-text-centered">Resources</h1>
               <hr/>
           </div>
-          <div class="panel">
+          <div class="panel is-hidden-mobile">
               <p class="panel-heading has-text-centered">Search Options</p>
 
               <div class="field">
                   <div class="columns">
-                      <div class="column has-text-centered">
-                          Topic
+                      <div class="column pl-6">
+                          <div class="title is-5 pt-2 has-text-centered">Topic</div>
 
                           {% for topic in topics %}
                             <div class="field">
-                              <label class="checkbox ml-0">
+                              <label class="checkbox">
                                 <input name="topicOption" type="checkbox" value="{{ topic }}">
-                                  <span class="has-text-grey is-size-7">{{ topic }}</span>
+                                  <span class="has-text-grey is-size-6">{{ topic }}</span>
                               </label>
                             </div>
                           {% endfor %}
                       </div>
 
-                        <div class="column has-text-centered">
-                            Type
+                        <div class="column pl-6">
+                            <div class="title is-5 pt-2 has-text-centered">Type</div>
 
                             {% for tag_type in tag_types %}
                             <div class="field">
                               <label class="checkbox ml-0">
                                 <input name="typeOption" type="checkbox" value="{{ tag_type }}">
-                                  <span class="has-text-grey is-size-7">{{ tag_type }}</span>
+                                  <span class="has-text-grey is-size-6">{{ tag_type }}</span>
                               </label>
                             </div>
                           {% endfor %}
                         </div>
 
-                        <div class="column has-text-centered">
-                            Payment
+                        <div class="column pl-6">
+                            <div class="title is-5 pt-2 has-text-centered">Payment</div>
 
                             {% for payment_tier in payment_tiers %}
                             <div class="field">
                               <label class="checkbox ml-0">
                                 <input name="paymentOption" type="checkbox" value="{{ payment_tier }}">
-                                  <span class="has-text-grey is-size-7">{{ payment_tier }}</span>
+                                  <span class="has-text-grey is-size-6">{{ payment_tier }}</span>
                               </label>
                             </div>
                           {% endfor %}
                         </div>
 
-                        <div class="column has-text-centered">
-                            Level
+                        <div class="column pl-6">
+                            <div class="title is-5 pt-2 has-text-centered">Level</div>
 
                             {% for complexity in complexities %}
                             <div class="field">
                               <label class="checkbox ml-0">
                                 <input name="complexityOption" type="checkbox" value="{{ complexity }}">
-                                  <span class="has-text-grey is-size-7">{{ complexity }}</span>
+                                  <span class="has-text-grey is-size-6">{{ complexity }}</span>
                               </label>
                             </div>
                           {% endfor %}
@@ -76,7 +76,6 @@
                   </div>
 
                   <div class="ml-3 pb-3">
-
                       <span class="control">
                         <button onclick="buildQueryParams()" class="button is-link is-small">Search</button>
                       </span>
@@ -84,12 +83,9 @@
                       <span class="is-one-fifth control">
                         <button onclick="clearQueryParams()" class="button is-danger is-small">Clear Search</button>
                       </span>
-
                   </div>
-
               </div>
           </div>
-      </div>
   </section>
 
     {% if resources|length > 0 %}
@@ -120,7 +116,7 @@
         </div>
     </section>
     {% else %}
-    <p>No resources matching search.</p>
+    <h2 class="title is-3 has-text-centered pt-0 pb-6 ">No resources matching search.</p>
     {% endif %}
 
 <script>
-- 
cgit v1.2.3