Make the stars look consistent across platforms
authorAlex Chan <alex@alexwlchan.net>
Wed, 16 Dec 2020 19:31:35 +0000 (19:31 +0000)
committerAlex Chan <alex@alexwlchan.net>
Wed, 16 Dec 2020 19:31:35 +0000 (19:31 +0000)
static/0star.svg [new file with mode: 0644]
static/1star.svg [new file with mode: 0644]
static/2star.svg [new file with mode: 0644]
static/3star.svg [new file with mode: 0644]
static/4star.svg [new file with mode: 0644]
static/5star.svg [new file with mode: 0644]
static/style.css
templates/_review_entry.html

diff --git a/static/0star.svg b/static/0star.svg
new file mode 100644 (file)
index 0000000..c541e96
--- /dev/null
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="1585" height="240" viewBox="0 0 330 48">
+
+<svg x="0">
+    <path fill="none" stroke="#000" stroke-width="3" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="70">
+    <path fill="none" stroke="#000" stroke-width="3" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="140">
+    <path fill="none" stroke="#000" stroke-width="3" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="210">
+    <path fill="none" stroke="#000" stroke-width="3" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="280">
+    <path fill="none" stroke="#000" stroke-width="3" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+</svg>
\ No newline at end of file
diff --git a/static/1star.svg b/static/1star.svg
new file mode 100644 (file)
index 0000000..c0c5bdb
--- /dev/null
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="1585" height="240" viewBox="0 0 330 48">
+
+<svg x="0">
+    <path fill="#000" stroke="#000" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="70">
+    <path fill="none" stroke="#000" stroke-width="3" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="140">
+    <path fill="none" stroke="#000" stroke-width="3" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="210">
+    <path fill="none" stroke="#000" stroke-width="3" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="280">
+    <path fill="none" stroke="#000" stroke-width="3" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+</svg>
\ No newline at end of file
diff --git a/static/2star.svg b/static/2star.svg
new file mode 100644 (file)
index 0000000..66b1a77
--- /dev/null
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="1585" height="240" viewBox="0 0 330 48">
+
+<svg x="0">
+    <path fill="#000" stroke="#000" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="70">
+    <path fill="#000" stroke="#000" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="140">
+    <path fill="none" stroke="#000" stroke-width="3" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="210">
+    <path fill="none" stroke="#000" stroke-width="3" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="280">
+    <path fill="none" stroke="#000" stroke-width="3" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+</svg>
\ No newline at end of file
diff --git a/static/3star.svg b/static/3star.svg
new file mode 100644 (file)
index 0000000..6b0d9c9
--- /dev/null
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="1585" height="240" viewBox="0 0 330 48">
+
+<svg x="0">
+    <path fill="#000" stroke="#000" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="70">
+    <path fill="#000" stroke="#000" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="140">
+    <path fill="#000" stroke="#000" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="210">
+    <path fill="none" stroke="#000" stroke-width="3" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="280">
+    <path fill="none" stroke="#000" stroke-width="3" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+</svg>
\ No newline at end of file
diff --git a/static/4star.svg b/static/4star.svg
new file mode 100644 (file)
index 0000000..f2bcc14
--- /dev/null
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="1585" height="240" viewBox="0 0 330 48">
+
+<svg x="0">
+    <path fill="#000" stroke="#000" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="70">
+    <path fill="#000" stroke="#000" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="140">
+    <path fill="#000" stroke="#000" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="210">
+    <path fill="#000" stroke="#000" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="280">
+    <path fill="none" stroke="#000" stroke-width="3" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+</svg>
\ No newline at end of file
diff --git a/static/5star.svg b/static/5star.svg
new file mode 100644 (file)
index 0000000..ac47605
--- /dev/null
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="1585" height="240" viewBox="0 0 330 48">
+
+<svg x="0">
+    <path fill="#000" stroke="#000" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="70">
+    <path fill="#000" stroke="#000" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="140">
+    <path fill="#000" stroke="#000" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="210">
+    <path fill="#000" stroke="#000" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+<svg x="280">
+    <path fill="#000" stroke="#000" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"/>
+</svg>
+
+</svg>
\ No newline at end of file
index 5dea87f..dabadaf 100644 (file)
@@ -166,7 +166,7 @@ footer a:hover {
   background: rgba(0, 255, 221, 0.3);
 }
 
-.review_preview img, .reading_inner img {
+.review_preview .book_thumbnail img, .reading_inner .book_thumbnail img {
   max-width: 110px;
   max-height: 130px;
   margin-top: 12px;
@@ -251,6 +251,9 @@ footer a:hover {
 }
 
 .star_rating {
-  font-size: 140%;
-  letter-spacing: 4px;
+  margin-top: 1px;
+}
+
+.star_rating img {
+  height: 0.9em;
 }
index 4c6238d..3a2fce5 100644 (file)
@@ -48,18 +48,10 @@ id="review_preview_{{ r }}_{{ g }}_{{ b }}">
           read {{ review_entry.review.date_read | render_date }}
             <br/>
           {% endif %}
+          <div class="star_rating">
+            <img src="/static/{{ review_entry.review.rating }}star.svg">
+          </div>
         </small>
-
-        <span class="star_rating">
-        {% if review_entry.review.rating %}
-          {% for _ in range(review_entry.review.rating) -%}
-          ★
-          {%- endfor -%}
-          {%- for _ in range(5 - review_entry.review.rating) -%}
-          ☆
-          {%- endfor %}
-        {% endif %}
-        </span>
         {% if review_entry.review.did_not_finish %}
           (did not finish)
         {% endif %}