Fix #14 - Barra en home

source/main/static/css/main.css

@@ -23,6 +23,10 @@
 	width: 100%;
 }
 
+.navbar-burger {
+  margin-left: 0;
+}
+
 /* Cada flecha en los títulos de secciones */
 .arrows {
   font-size: 1.5rem;
@@ -297,17 +301,23 @@ section#notice a {
 
 /* SEARCH */
 
+#search-form {
+  width: 80vw;
+  margin: auto auto auto 3rem;
+}
+
 .search-div > * {
   display: inline-block;
 }
 
 .search-div input {
   width: calc(100% - 4.1rem);
+  vertical-align: text-top;
 }
 
 .search-div button {
-  width: 3.8rem;
-  height: 3.8rem;
+  width: 2.9rem;
+  height: 2.9rem;
 }
 
 /* ICONS; cfr: https://css.gg */

source/static/css/main.css

@@ -297,17 +297,26 @@ section#notice a {
 
 /* SEARCH */
 
+#search-form {
+  width: calc(100% - 7em);
+}
+
+.search-div {
+  margin-top: .5em;
+}
+
 .search-div > * {
   display: inline-block;
 }
 
 .search-div input {
   width: calc(100% - 4.1rem);
+  font-size: 1.25rem;
 }
 
 .search-div button {
-  width: 3.8rem;
-  height: 3.8rem;
+  width: 3.1rem;
+  height: 3.1rem;
 }
 
 /* ICONS; cfr: https://css.gg */

source/templates/nav.html

@@ -4,6 +4,11 @@
     <a class="navbar-item" href="{% url 'home' %}">
       <img src="{% static 'img/logo-mauflix.png' %}" width="112" height="28">
     </a>
+    {% if query %}
+      {% include 'search-bar.html' with query=query %}
+    {% else %}
+      {% include 'search-bar.html' %}
+    {% endif %}
     <a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="menu">
       <span aria-hidden="true"></span>
       <span aria-hidden="true"></span>
@@ -12,30 +17,18 @@
   </div>
   <div id="menu" class="navbar-menu force-display">
     <div class="navbar-start">
-      {% if request.get_full_path != "/" %}
-        <a class="navbar-item" href="{% url 'home' %}">Inicio</a>
-      {% endif %}
-      {% if request.path != "/search/" %}
-        <a class="navbar-item" href="{% url 'search' %}">Buscar</a>
-      {% endif %}
       <div class="navbar-item has-dropdown is-hoverable">
         <a class="navbar-link">Más</a>
         <div class="navbar-dropdown">
           <a class="navbar-item" href="{% url 'about' %}" >Acerca</a>
           <a class="navbar-item" href="{% url 'help' %}" >Ayuda</a>
-          <!--
           <hr class="navbar-divider">
+          <a class="navbar-item" href="{% url 'admin:index' %}">Ingresa</a>
+          <!--
           <a class="navbar-item" href="{% url 'bugs' %}">Reporta un problema</a>
           -->
         </div>
       </div>
     </div>
-    <div class="navbar-end">
-      <div class="navbar-item">
-        <div class="buttons">
-          <a class="button is-primary" href="{% url 'admin:index' %}">Ingresa</a>
-        </div>
-      </div>
-    </div>
   </div>
 </nav>

source/templates/search-bar.html

@@ -0,0 +1,8 @@
+<form id="search-form" action="/search" method="get">
+  <div class="search-div">
+    <input id="search-bar" class="input is-primary" type="text" placeholder="Quiero ver…" value="{{ query }}" name="q">
+    <div class="control">
+      <button class="button is-primary"><i class="gg-search"></i></button>
+    </div>
+  </div>
+</form>

source/templates/search.html

@@ -2,17 +2,6 @@
 
 {% block content %}
 
-<div class="hero">
-  <form action="/search" method="get">
-    <div class="hero-body search-div">
-      <input id="search-bar" class="input is-primary is-large" type="text" placeholder="Quiero ver…" value="{{ query }}" name="q">
-      <div class="control">
-        <button class="button is-primary"><i class="gg-search"></i></button>
-      </div>
-    </div>
-  </form>
-</div>
-
 {% if movies %}
   {% include 'section.html' with section='Resultados de búsqueda.' content=movies %}
 {% else %}