Browse Source

refactor: update main template

- Fix naming to match code
- Disable autocomplete in search bar
- Make pages indexable by robots
Zubarev Grigoriy 7 months ago
parent
commit
caf4d58922
3 changed files with 35 additions and 24 deletions
  1. 1 1
      .editorconfig
  2. 3 1
      src/rural_dict/__main__.py
  3. 31 22
      src/rural_dict/templates/index.html

+ 1 - 1
.editorconfig

@@ -9,5 +9,5 @@ insert_final_newline = true
 trim_trailing_whitespace = true
 max_line_length = 99
 
-[{**.yml,**.yaml}]
+[{**.yml,**.yaml,**.html}]
 indent_size = 2

+ 3 - 1
src/rural_dict/__main__.py

@@ -62,7 +62,9 @@ def root_route(path):
         pagination.attrs["class"] = "pagination"
         pagination = pagination.html
 
-    return render_template("index.html", data=(results, pagination), term=request.args.get("term"))
+    return render_template(
+        "index.html", results=results, pagination=pagination, term=request.args.get("term")
+    )
 
 
 if __name__ == "__main__":

+ 31 - 22
src/rural_dict/templates/index.html

@@ -1,41 +1,50 @@
-<!DOCTYPE html>
-<html>
+<!doctype html>
+<html lang="en">
   <head>
     <title>Rural Dictionary{% if term %}: {{ term }}{% endif %}</title>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width">
-    <link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}">
-    <link rel="icon" type="image/png" href="{{ url_for('static', filename='img/favicon.png') }}">
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="robots" content="index, follow" />
+    <link rel="stylesheet" href="{{ url_for('static', path='css/main.css') }}" />
+    <link rel="icon" type="image/png" href="{{ url_for('static', path='img/favicon.png') }}" />
   </head>
   <body>
-    <center>
+    <div style="text-align: center">
       <a href="/">
-        <img src="{{ url_for('static', filename='img/logo.png')  }}">
+        <img src="{{ url_for('static', path='img/logo.png') }}" />
       </a>
       <form id="search" role="search" method="get" action="/define.php">
-        <input type="search" id="term" name="term" placeholder="Search" autofocus>
+        <input
+          autocomplete="off"
+          type="search"
+          id="term"
+          name="term"
+          placeholder="Search"
+          autofocus
+        />
         <button>Go</button>
       </form>
-      <a href=/random.php>Random</a>
-      <br>
+      <a href="/random.php">Random</a>
+      <br />
       <a href="https://git.vern.cc/cobra/rural-dict">Source Code</a>
-    </center>
-    <br>
-    {% for defid, word, definition, example, author, thumbs_up, thumbs_down in data[0] %}
-    
-    <div class="{{ defid }}">
+    </div>
+    <br />
+    {% for definition_id, word, meaning, example, contributor, thumbs_up, thumbs_down in results %}
+    <div data-id="{{ definition_id }}">
       <a href="/define.php?term={{ word }}">
         <h2>{{ word }}</h2>
       </a>
-      <p>{{ definition|safe }}</p>
+      <p>{{ meaning|safe }}</p>
       <p><i>{{ example|safe }}</i></p>
-      <p>{{ author|safe }}</p>
+      <div>{{ contributor|safe }}</div>
       {% if thumbs_up and thumbs_down %}
-      <p>{{ thumbs_up|safe }}<span title="thumbs up">👍</span> {{ thumbs_down|safe }}<span title="thumbs down">👎</span></p>
+      <p>
+        <span title="thumbs up">👍{{ thumbs_up|safe }}</span>
+        <span title="thumbs down">👎{{ thumbs_down|safe }}</span>
+      </p>
       {% endif %}
     </div>
-    <br>
-    {% endfor %}
-    {{ data[1]|safe }}
+    <br />
+    {% endfor %} {{ pagination|safe }}
   </body>
 </html>